Xamarin forms ControlTemplate for header, another for footer and bindings

643 views Asked by At

I am making an App that has the same header on every screen, so I created a ControlTemplate for that part of the app, put some buttons on it and that works. I am pretty happy with it.

Three screens have almost identical footer, only different text color and images. I made another ControlTemplate for the footer, and I would like to manipulate the IsVisible property on the images with bindings, according to what page is currently dislayed, but I am not able to figure out how to do it.

I know that I need to write a converter, I did that, that doesn't seem to be complicated, but I can't figure out a way to actually bind the values in those properties.

Both of ControlTemplates are defined on the application level.

This is an example of how I use them, maybe this is wrong:

<ContentView ControlTemplate="{StaticResource Header}">
<!--This is the actuall page content-->
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="9*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
    <!--Content of the page!-->
<Label Text="Welcome to Xamarin.Forms!" 
       VerticalOptions="Center" 
       HorizontalOptions="Center" 
       Grid.Row="0"/>
<!--Footer of the page!-->
    <ContentView ControlTemplate="{StaticResource BuySellPayFooter}"
                             Grid.Row="1"/>
    </Grid>
</ContentView>

I need to bind properties of some class in the footer. How to do it? Is it achievable?

1

There are 1 answers

0
The Long Nguyen On

I use ControlTemplate to show an ActivityIndicator on every page.

For property IsVisible of the indicator, I bind it with property IsBusy of the page.

And this is how I bind it in the XAML of the ControlTemplate:

IsVisible="{TemplateBinding BindingContext.IsBusy}"

If I want to change the color of the indicator on each page, I can define BusyColor property for the page and binding it:

Color="{TemplateBinding BindingContext.BusyColor}"