如何也显示来自派生 XAML 的 GUI 元素？答案

【问题标题】：How to display the GUI elements from derived XAML too?如何也显示来自派生 XAML 的 GUI 元素？
【发布时间】：2019-06-10 15:04:45
【问题描述】：

我成功继承了类ContentPage，派生类叫SubContentPage。
它包含一些模板元素（按钮和标题标签）。我有两个继承自 SubContentPage 的类 FilterPage 和 SettingsPage。当我显示其中一个派生页面时，我只能看到 SubContentPage 的 GUI 内容，尽管之前从 ContentPage 继承的 FilterPage 和 SettingsPage 可以正常工作。所以我的GUI代码没有错。

我的想法是 SubContentPage 和派生类不使用图形控件出现的相同内容。因此派生的 GUI 元素将被忽略。我尝试对 SubContentPage 和 FilterPage 类使用相同的 StackLayout 名称。但这行不通。

SubContentPage.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"
             x:Class="solna_app.GUI.Pages.SubContentPage">
    <ContentPage.Content>
        <StackLayout>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Image x:Name="BackIcon" HorizontalOptions="Start" 
                    Grid.Row="0" />
                <Label x:Name="TitleLabel" HorizontalOptions="Center"
                    FontSize="Large" FontAttributes="Bold"
                    TextColor="Black" Grid.Row="0" />
            </Grid>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

FilterPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<d:SubContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="clr-namespace:solna_app.GUI.Pages;assembly=solna_app"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="solna_app.GUI.Pages.FilterPage">
    <d:SubContentPage.Content>
        <StackLayout>
            <Label  x:Name="SearchLabel" Text="Search keyword" 
                TextColor="Black" FontSize="Large" Margin="10,10,0,0" />
            <Editor x:Name="SearchEditor" Placeholder="Type a keyword"
                PlaceholderColor="Gray" Margin="10,10,10,0"
                HorizontalOptions="CenterAndExpand"/>
        </StackLayout>
    </d:SubContentPage.Content>
</d:SubContentPage>

我希望显示 SubContentPage 的 UI 控件和派生类的 UI 控件。

【问题讨论】：

如果你替换了基类的内容，你会得到你替换它的内容。只有一个 Content 属性。它只有一个值。赋予控件相同的名称不会影响任何事情。子类化不是 WPF 中执行此操作的方法。您想通过组合来实现：控件的模板创建自己的控件，并通过 ContentPresenter 嵌入其内容。代替子类，将可视子类放在控件实例的 Content 中。孩子可以有自己的模板和自己的内容。它的内容可能是另一个孩子，广告（几乎）无限。
@EdPlunkett 谢谢，这解决了我的问题！

标签： c# xaml xamarin inheritance xamarin.forms

【解决方案1】：

您可以使用 ControlTemplate 来实现这一目标

1.您可以在应用程序级别定义一个 ControlTemplate，在App.xmal

<Application.Resources>
    <ResourceDictionary>
        <ControlTemplate x:Key="SubContentPageTemplate">
             <StackLayout>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Image x:Name="BackIcon" HorizontalOptions="Start" 
                           Grid.Row="0" />
                    <Label x:Name="TitleLabel" HorizontalOptions="Center"
                           FontSize="Large" FontAttributes="Bold"
                           TextColor="Black" Grid.Row="0" />
                </Grid>
                <ContentPresenter  />
            </StackLayout>
        </ControlTemplate>
    </ResourceDictionary>
</Application.Resources>

2.在你的FilterPage.xaml中使用

<ContentPage>
    <ContentView ControlTemplate="{StaticResource SubContentPageTemplate}">
     <StackLayout>
        <Label  x:Name="SearchLabel" Text="Search keyword" 
            TextColor="Black" FontSize="Large" Margin="10,10,0,0" />
        <Editor x:Name="SearchEditor" Placeholder="Type a keyword"
            PlaceholderColor="Gray" Margin="10,10,10,0"
            HorizontalOptions="CenterAndExpand"/>
     </StackLayout>
   </ContentView>   
</ContentPage>

更多信息您可以参考ControlTemplate

【讨论】：