Search code examples
c#xamlxamarinxamarin.formscontent-pages

Xamarin base ContentPage with loading (or common ContentViews)


how can I create a "base" ContentPage that contains, for sample, a busy indicator, and make this Page the base for each other pages inside my application?

I have tried to do in this way, but the busy indicator isn't showed.

Base Page:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:core="clr-namespace:SgatMobileV3.Core;assembly=SgatMobileV3"
             x:Class="SgatMobileV3.Core.BasePage">
    <ContentPage.Content>
        <Grid>
            <core:VolosLoadingView />
        </Grid>
    </ContentPage.Content>
</ContentPage>

Busy indicator view:

<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:core="clr-namespace:SgatMobileV3.Core;assembly=SgatMobileV3"
             core:LocatorViewModel.AutoWireViewModel="true"
             x:Class="SgatMobileV3.Core.VolosLoadingView"
             xmlns:busyindicator="clr-namespace:Syncfusion.SfBusyIndicator.XForms;assembly=Syncfusion.SfBusyIndicator.XForms">

    <Grid>
     <Grid BackgroundColor="LightGray" Opacity="0.6" IsVisible="True" />
     <busyindicator:SfBusyIndicator
        IsBusy="True"
        IsVisible="True"
        x:Name="loading" AnimationType="DoubleCircle"
        ViewBoxWidth="150" ViewBoxHeight="150"
        TextColor="Green" BackgroundColor="Transparent"
        HorizontalOptions="Center" VerticalOptions="Center"/>       
     </Grid>
</ContentView>

A page:

<core:BasePage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:core="clr-namespace:SgatMobileV3.Core;assembly=SgatMobileV3"
             core:LocatorViewModel.AutoWireViewModel="true"
             x:Class="SgatMobileV3.Views.MockPage">

    <ContentPage.Content>
        <Grid>
            <Button Text="Welcome to Xamarin.Forms! 1"
                    VerticalOptions="CenterAndExpand" 
                    HorizontalOptions="CenterAndExpand"
                    Command="{Binding Test_ClickCommand}" />
        </Grid>
    </ContentPage.Content>
</core:BasePage>

I have tried to include a sample label inside the base page but nothing appears.


Solution

  • how can I create a "base" ContentPage that contains, for sample, a busy indicator, and make this Page the base for each other pages

    If want Creating a ControlTemplate at Page Level,creating ControlTemplate instances at the application level, they can also be created at the page level, as shown in the following code example:

    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="SimpleTheme.HomePage">
        <ContentPage.Resources>
            <ResourceDictionary>
                <ControlTemplate x:Key="TealTemplate">
                    ...
                </ControlTemplate>
                <ControlTemplate x:Key="AquaTemplate">
                    ...
                </ControlTemplate>
            </ResourceDictionary>
        </ContentPage.Resources>
        <ContentView ... ControlTemplate="{StaticResource TealTemplate}">
            ...
        </ContentView>
    </ContentPage>
    

    When adding a ControlTemplate at the page level, a ResourceDictionary is added to the ContentPage, and then theControlTemplate` instances are included in the ResourceDictionary.

    And also can use code , from doc has a sample for example.