Geek Answers Handbook

Can I include a XAML block in another XAML block?

I have XAML that looks like this:

<Grid VerticalOptions="Start"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Label Grid.Row="0" Grid.Column="0" HorizontalOptions="Start" Text="Exclude Hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="0" Grid.Column="1" HorizontalOptions="Start" Text="All cards except those tagged as hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="1" Grid.Column="0" HorizontalOptions="Start" Text="Include Hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="1" Grid.Column="1" HorizontalOptions="Start" Text="All cards including those tagged as hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="2" Grid.Column="0" HorizontalOptions="Start" Text="Favorites" Style="{StaticResource helpDetail}" /> <Label Grid.Row="2" Grid.Column="1" HorizontalOptions="Start" Text="Only cards tagged as favorites" Style="{StaticResource helpDetail}" /> <Label Grid.Row="3" Grid.Column="0" HorizontalOptions="Start" Text="Hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="3" Grid.Column="1" HorizontalOptions="Start" Text="Only those cards tagged as hidden" Style="{StaticResource helpDetail}" /> </Grid>

The code appears on two pages. I would like to leave it as XAML.

Is there a way that I can put this XAML in a file and include it in another XAML for each of the two pages. Please note that I do not want to convert everything to C # since I have many such examples.

+8
xamarin xamarin.forms
source share
3 answers

Create a directory called Templates, and then create a new View class, MyCustomGrid , for example:

Templates / MyCustomGrid.xaml:

 <?xml version="1.0" encoding="UTF-8"?> <Grid xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="MyProject.Templates.MyCustomGrid"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <Label Grid.Row="0" Grid.Column="0" HorizontalOptions="Start" Text="Exclude Hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="0" Grid.Column="1" HorizontalOptions="Start" Text="All cards except those tagged as hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="1" Grid.Column="0" HorizontalOptions="Start" Text="Include Hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="1" Grid.Column="1" HorizontalOptions="Start" Text="All cards including those tagged as hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="2" Grid.Column="0" HorizontalOptions="Start" Text="Favorites" Style="{StaticResource helpDetail}" /> <Label Grid.Row="2" Grid.Column="1" HorizontalOptions="Start" Text="Only cards tagged as favorites" Style="{StaticResource helpDetail}" /> <Label Grid.Row="3" Grid.Column="0" HorizontalOptions="Start" Text="Hidden" Style="{StaticResource helpDetail}" /> <Label Grid.Row="3" Grid.Column="1" HorizontalOptions="Start" Text="Only those cards tagged as hidden" Style="{StaticResource helpDetail}" /> </Grid>

Templates / MyCustomGrid.xaml.cs

 using Xamarin.Forms; namespace MyProject.Templates { public partial class MyCustomGrid : Grid { public MyCustomGrid() { InitializeComponent(); } } }

To use it on another page, i.e. MyPage.xaml:

 <?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:templates="clr-namespace:MyProject.Templates;assembly=MyProject" x:Class="MyProject.MyPage"> <templates:MyCustomGrid /> </ContentPage>
+10
source share

Paste the code into the ContentView. Call this code also in ContentPages.

https://forums.xamarin.com/discussion/87415/how-to-display-content-from-one-xaml-inside-another

+4
source share

In this case / dilemma you can use the Xamarin ContentView class.

You can think of ContentView as a subclass or child of ContentPage. So basically, if you have a Xamarin page, which is a ContentPage. And a ContentView can be a view or a subitem in a ContentPage. Both of them can have their own structure:

A ContentPage XAML (e.g. MainContentPage.xaml)

  <?xml version="1.0" encoding="utf-8" ?> <ContentPage> <ContentPage.Content> <StackLayout x:Name="MainLayout"> ... </StackLayout> </ContentPage.Content> </ContentPage>

ContentView XAML (e.g. ChildContentView.xaml)

  <?xml version="1.0" encoding="utf-8" ?> <ContentView> <ContentView.Content> <StackLayout> ... </StackLayout> </ContentView.Content> </ContentView>

And the ContentPage class (e.g. MainContentPage.cs) looks something like this:

  namespace Your.Package { public class MainContentPage : ContentPage { public MainContentPage() { //Some code here, binding, initialization etc. //Create an object of the ChildContentView code behind/class ChildContentView childView = new ChildContentView(); //Add the childView to the MainLayout of the ContentPage this.MainLayout.Children.Add(childView); InitializeComponent(); } } }

And in your ChildContentView.cs (the code behind), you can basically do the same coding as what you can do in the code for any ContentPage class. You can add a StackLayout, you can make a binding, and you can use other inherited methods from the parent TemplatedView class. For more information see this link .

0
source share

More articles:


All Articles