Xamarin.Forms 中的外部 ControlTemplate 页面上没有模板布局属性

Question

Xamarin 新手在这里。 我需要避免在应用程序中重复控件和布局，因此我尝试使用控件模板来实现这一点。 但是，根据上一个链接（ 此处为源代码）中的示例，我总是需要在要使用控件的每个页面上包含一个带有标记的ControlTemplate属性。

这是必要的还是我可以在内容视图中单独创建控件并在我希望将其添加到的页面正文中引用它？ 我已经走了这条路线，因为在从不同页面调用控件时需要添加参数。 这是正确的方法吗？ 这将主要用于 android 和 ios 应用程序，如果这有什么不同的话。

在需要的每个页面上添加控制模板布局似乎与我尝试使用 go 的一次性使用无处不在的基本原理背道而驰。

Answer 1

我总是需要在要使用控件的每个页面上包含一个带有标记的 ControlTemplate 属性。

不，您可以将ControlTemplate放在App.xaml的Application.Resources选项卡中，如下面的代码。

<Application xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ControlTemplateDemos.App">
    <Application.Resources>
        <ControlTemplate x:Key="CardViewControlTemplate">
            <!--
            In this example, the frame's BindingContext is set to the control instance that the template is applied to. Therefore,
            the binding expressions resolve against the properties of each CardView object.
            -->
            <Frame BindingContext="{Binding Source={RelativeSource TemplatedParent}}"
                   BackgroundColor="{Binding CardColor}"
                   BorderColor="{Binding BorderColor}"
                   CornerRadius="5"
                   HasShadow="True"
                   Padding="8"
                   HorizontalOptions="Center"
                   VerticalOptions="Center">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="75" />
                        <RowDefinition Height="4" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="75" />
                        <ColumnDefinition Width="200" />
                    </Grid.ColumnDefinitions>
                    <Frame IsClippedToBounds="True"
                           BorderColor="{Binding BorderColor}"
                           BackgroundColor="{Binding IconBackgroundColor}"
                           CornerRadius="38"
                           HeightRequest="60"
                           WidthRequest="60"
                           HorizontalOptions="Center"
                           VerticalOptions="Center">
                        <Image Source="{Binding IconImageSource}"
                               Margin="-20"
                               WidthRequest="100"
                               HeightRequest="100"
                               Aspect="AspectFill" />
                    </Frame>
                    <Label Grid.Column="1"
                           Text="{Binding CardTitle}"
                           FontAttributes="Bold"
                           FontSize="Large"
                           VerticalTextAlignment="Center"
                           HorizontalTextAlignment="Start" />
                    <BoxView Grid.Row="1"
                             Grid.ColumnSpan="2"
                             BackgroundColor="{Binding BorderColor}"
                             HeightRequest="2"
                             HorizontalOptions="Fill" />
                    <Label Grid.Row="2"
                           Grid.ColumnSpan="2"
                           Text="{Binding CardDescription}"
                           VerticalTextAlignment="Start"
                           VerticalOptions="Fill"
                           HorizontalOptions="Fill" />
                </Grid>
            </Frame>
        </ControlTemplate>
    </Application.Resources>
</Application>

如果我想在Page1.xaml中使用这个ControlTemplate 。 我们可以直接使用它。

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:controls="clr-namespace:ControlTemplateDemos.Controls"
             mc:Ignorable="d"
             x:Class="ControlTemplateDemos.Views.Page1">
    <ContentPage.Content>
        <StackLayout>
            <controls:CardView BorderColor="DarkGray"
                           CardTitle="John Doe"
                           CardDescription="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla elit dolor, convallis non interdum."
                           IconBackgroundColor="SlateGray"
                           IconImageSource="user.png"
                           ControlTemplate="{StaticResource CardViewControlTemplate}" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

这里正在运行 GIF。

Answer 2

谢谢李昂。

我不想在 App.xaml 中添加模板，因为我添加的模板越多越麻烦。 我最终使用我想要的控件布局创建了一个单独的内容视图，并直接在每个需要它的页面中使用它，如下所示：

 <ContentPage.Resources>
            <ControlTemplate x:Key="StellaControlTemplate">
                <controls:MyTemplate></controls:MyTemplate>
            </ControlTemplate>
 </ContentPage.Resources>

     <StackLayout Spacing="10" x:Name="layout">            
               <Label Text="My template below"></Label>
               <controls:MyTemplate PicForTemplate="harold.png" 
                 ControlTemplate="{StaticResource StellaControlTemplate}"> 
               </controls:MyTemplate>
     </StackLayout>