Forum Xamarin.Forms

ContentPresenter Content Not Rendered When IsVisible changed from False to True

drouleaudrouleau Member ✭✭
edited April 2018 in Xamarin.Forms

I have a series of StackPanels each bound to different Visibility properties to change out the UI based on a set of conditions. The StackPanel and Label contained within become visible as expected, the but the content in my ContentPresenter is not rendered except for the last StackLayout (IsRight). You can see in the screenshot that space is allocated for the controls, but nothing is drawn. When I do investigate in visual studio, the height of the content is set to 0.

Here is the ControlTemplate with the StackPanels

<ControlTemplate x:Key="LabeledFieldTemplate">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <!--<StackLayout IsVisible="{TemplateBinding IsBelow}" {TemplateBinding LabelForeground}>
                <Label Text="{TemplateBinding Label}"></Label>
                <ContentPresenter></ContentPresenter>
            </StackLayout>-->
            <StackLayout Orientation="Vertical" 
                         IsVisible="{TemplateBinding IsAbove}" 
                         VerticalOptions="StartAndExpand"
                         Grid.Row="0" Grid.Column="0">
                <Label Text="{TemplateBinding Label}"
                       TextColor="{TemplateBinding LabelForeground}"
                       VerticalOptions="End"
                       HorizontalOptions="Start"
                       WidthRequest="{Binding Width, Source={x:Reference ContentBelow}}"
                       Margin="{TemplateBinding LabelPaddingWhenAbove}"/>
                <ContentPresenter x:Name="ContentBelow" VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"/>
            </StackLayout>

            <StackLayout Orientation="Vertical" IsVisible="{TemplateBinding IsBelow}" VerticalOptions="StartAndExpand"
                         Grid.Row="0" Grid.Column="0">
                <ContentPresenter x:Name="ContentAbove" VerticalOptions="StartAndExpand" HorizontalOptions="CenterAndExpand"/>
                <Label Text="{TemplateBinding Label}"
                       TextColor="{TemplateBinding LabelForeground}"
                       VerticalOptions="Start"
                       HorizontalOptions="Start"
                       WidthRequest="{Binding Width, Source={x:Reference ContentAbove}}"
                       Margin="{TemplateBinding LabelPaddingWhenBelow}"/>
            </StackLayout>

            <StackLayout Orientation="Horizontal" IsVisible="{TemplateBinding IsLeft}" HorizontalOptions="StartAndExpand"
                         Grid.Row="0" Grid.Column="0">
                <Label Text="{TemplateBinding Label}"
                       TextColor="{TemplateBinding LabelForeground}"
                       VerticalOptions="Center"
                       WidthRequest="{TemplateBinding LabelColumnWidth}"
                       Margin="{TemplateBinding LabelPaddingWhenLeft}"/>
                <ContentPresenter VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"/>
            </StackLayout>

            <StackLayout Orientation="Horizontal" IsVisible="{TemplateBinding IsRight}" HorizontalOptions="StartAndExpand"
                         Grid.Row="0" Grid.Column="0">
                <ContentPresenter VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"/>
                <Label Text="{TemplateBinding Label}"
                       TextColor="{TemplateBinding LabelForeground}"
                       WidthRequest="{TemplateBinding LabelColumnWidth}"
                       VerticalOptions="Center"
                       Margin="{TemplateBinding LabelPaddingWhenRight}"/>
            </StackLayout>

        </Grid>
    </ControlTemplate>

Here is where I use the template -

            <StackLayout>
                <controls:LabeledField Label="Above" 
                                       LabelForeground="MediumAquamarine" 
                                       LabelPosition="Above"
                                       ControlTemplate="{StaticResource LabeledFieldTemplate}">
                    <Label Text="NonEditableFieldTest 1"></Label>
                </controls:LabeledField>
                <controls:LabeledField Label="Below" 
                                       LabelForeground="RoyalBlue" 
                                       LabelPosition="Below"
                                       ControlTemplate="{StaticResource LabeledFieldTemplate}">
                    <Label Text="NonEditableFieldTest 2"></Label>
                </controls:LabeledField>
                <controls:LabeledField Label="Left" 
                                       LabelForeground="MediumVioletRed" 
                                       LabelPosition="Left"
                                       ControlTemplate="{StaticResource LabeledFieldTemplate}">
                    <Label Text="NonEditableFieldTest 3"></Label>
                </controls:LabeledField>
                <controls:LabeledField Label="Right" 
                                       LabelForeground="Plum" 
                                       LabelPosition="Right"
                                       ControlTemplate="{StaticResource LabeledFieldTemplate}">
                    <Entry/>
                </controls:LabeledField>
            </StackLayout>

Here is what it looks like -

In my googling I found a couple of bugs that seemed similar, but sounded like they've been resolved. I'm using Xamarin.Forms 3.2.0

Answers

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    he but the content in my ContentPresenter is not rendered

    Can you just bind the IsVisible binding property on the ContentPresenter itself? Hide and show the entire ContentPresenter instead of controls within?

  • drouleaudrouleau Member ✭✭

    I moved the IsVisible to the Label and ContentPresenter and that has the same behavior.

                <StackLayout Orientation="Vertical"  
                             VerticalOptions="StartAndExpand"
                             Grid.Row="0" Grid.Column="0">
                    <Label Text="{TemplateBinding Label}"
                           TextColor="{TemplateBinding LabelForeground}"
                           VerticalOptions="End"
                           HorizontalOptions="Start"
                           WidthRequest="{Binding Width, Source={x:Reference ContentBelow}}"
                           Margin="{TemplateBinding LabelPaddingWhenAbove}"
                           IsVisible="{TemplateBinding IsAbove}"/>
                    <ContentPresenter x:Name="ContentBelow" VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"
                                      IsVisible="{TemplateBinding IsAbove}"/>
                </StackLayout>
    
                <StackLayout Orientation="Vertical" VerticalOptions="StartAndExpand"
                             Grid.Row="0" Grid.Column="0">
                    <ContentPresenter x:Name="ContentAbove" VerticalOptions="StartAndExpand" HorizontalOptions="CenterAndExpand" IsVisible="{TemplateBinding IsBelow}" />
                    <Label Text="{TemplateBinding Label}"
                           TextColor="{TemplateBinding LabelForeground}"
                           VerticalOptions="Start"
                           HorizontalOptions="Start"
                           WidthRequest="{Binding Width, Source={x:Reference ContentAbove}}"
                           Margin="{TemplateBinding LabelPaddingWhenBelow}"
                           IsVisible="{TemplateBinding IsBelow}" />
                </StackLayout>
    
                <StackLayout Orientation="Horizontal" HorizontalOptions="StartAndExpand"
                             Grid.Row="0" Grid.Column="0">
                    <Label Text="{TemplateBinding Label}"
                           TextColor="{TemplateBinding LabelForeground}"
                           VerticalOptions="Center"
                           WidthRequest="{TemplateBinding LabelColumnWidth}"
                           Margin="{TemplateBinding LabelPaddingWhenLeft}"
                           IsVisible="{TemplateBinding IsLeft}" />
                    <ContentPresenter VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand" IsVisible="{TemplateBinding IsLeft}" />
                </StackLayout>
    
                <StackLayout Orientation="Horizontal" HorizontalOptions="StartAndExpand"
                             Grid.Row="0" Grid.Column="0">
                    <ContentPresenter VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand" IsVisible="{TemplateBinding IsRight}" />
                    <Label Text="{TemplateBinding Label}"
                           TextColor="{TemplateBinding LabelForeground}"
                           WidthRequest="{TemplateBinding LabelColumnWidth}"
                           VerticalOptions="Center"
                           Margin="{TemplateBinding LabelPaddingWhenRight}"
                           IsVisible="{TemplateBinding IsRight}" />
                </StackLayout>
    
Sign In or Register to comment.