如何通过传入类型参数来自定义 Xamarin 模板？

Question

这是我目前想出的方法。然而，这似乎不是一个干净的解决方案。

有没有人对我如何提出更好的解决方案提出任何建议？

<?xml version="1.0" encoding="utf-8"?>
<StackLayout xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             xmlns:local="clr-namespace:Japanese;assembly=Japanese" 
             x:Class="Japanese.Templates.HeaderTemplate" 
             x:Name="this" HorizontalOptions="FillAndExpand" Orientation="Vertical" Spacing="0" Margin="0">
    <StackLayout IsVisible="{Binding HeaderType, Converter={StaticResource HeaderType1BoolConverter}, Source={x:Reference this}  }" >
        <!-- code -->
    </StackLayout>
    <StackLayout IsVisible="{Binding HeaderType, Converter={StaticResource HeaderType2BoolConverter}, Source={x:Reference this}  }" >
        <!-- code -->
    </StackLayout>
</StackLayout>

在我的银行端 CS：

using System;
using System.Collections.Generic;
using Xamarin.Forms;

namespace Japanese.Templates
{
    public partial class HeaderTemplate : StackLayout
    {
        public HeaderTemplate()
        {
            InitializeComponent();
        }

   public static readonly BindableProperty HeaderTypeProperty =
        BindableProperty.Create(
            nameof(HeaderType),
            typeof(string),
            typeof(DataViewCellTemplate),
            default(string));

    public string HeaderType
    {
        get { return (string)GetValue(HeaderTypeProperty); }
        set { SetValue(HeaderTypeProperty, value); }
    }

    }
}

转换器代码：

public class HeaderType1BoolConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        return object.Equals(value, "1");
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

public class HeaderType2BoolConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        return object.Equals(value, "2");
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

在调用代码中：

<template:HeaderTemplate Header="Application" HeaderType="1" />

Answer 1

使用triggers 是一个选项。

例如：您可以添加属性触发器来检查 HeaderType 上的值，并相应地更新自定义控件 HeaderView 中的 Content（或布局）。

请注意，在这种情况下，我们是从 ContentView 而不是 StackLayout 扩展的，假设一次只有一个布局/控件可见。

XAML

<ContentView 
    xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
    xmlns:local="clr-namespace:SampleApp" 
    x:Class="SampleApp.HeaderView">

    <ContentView.Triggers>

        <!-- if header type is 1, use header1 layout -->
        <Trigger TargetType="local:HeaderView" Property="HeaderType" Value="1">
            <Setter Property="Content">
                <Setter.Value>
                    <Label Text="Header1" />
                </Setter.Value>
            </Setter>
        </Trigger>

        <!-- if header type is 2, use header2 layout -->
        <Trigger TargetType="local:HeaderView" Property="HeaderType" Value="2">
            <Setter Property="Content">
                <Setter.Value>
                    <StackLayout>
                        <Label Text="Header2" />
                        <BoxView HeightRequest="1" BackgroundColor="Gray" />
                    </StackLayout>
                </Setter.Value>
            </Setter>
        </Trigger>

        <!-- you can add more layouts here if you need -->

    </ContentView.Triggers>

    <!-- add default content that can be displayed in case of no match -->
    <StackLayout>
        <Label Text="DefaultHeader" />
        <BoxView HeightRequest="1" BackgroundColor="Gray" />
    </StackLayout>    

</ContentView>

代码隐藏

public partial class HeaderView : ContentView
{
    public HeaderView()
    {
        InitializeComponent();

    }

    public static readonly BindableProperty HeaderTypeProperty =
        BindableProperty.Create(
            nameof(HeaderType), typeof(string), typeof(HeaderView),
            defaultValue: default(string));

    public string HeaderType
    {
        get { return (string)GetValue(HeaderTypeProperty); }
        set { SetValue(HeaderTypeProperty, value); }
    }
}

用法

<local:HeaderView HeaderType="1" />

Answer 2

我相信你正在寻找的是一个 ControlTemplate 这里是一个实现。

App.xaml

<Application xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="SimpleTheme.App">
    <Application.Resources>
        <ResourceDictionary>
            <ControlTemplate x:Key="Header1Template">
                <StackLayout>
                    <!-- code -->
                </StackLayout>
            </ControlTemplate>
            <ControlTemplate x:Key="Header2Template">
                <StackLayout>
                    <!-- code -->
                </StackLayout>
            </ControlTemplate>
        </ResourceDictionary>
    </Application.Resources>
</Application>

用法（这将使 header1 成为您的默认设置，您可以选择两者中的任何一个）

<ContentView x:Name="contentView" ControlTemplate="{StaticResource Header1Template}">

现在有很多方法可以更改标题，或者通过定义为上面的默认代码或使用可以是按钮单击的操作（如链接上给出的示例）或使用 propertyChange 事件，如果您想依赖用于选择标题的属性，例如：

public int HeaderNumber { get; set; }

protected override void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
    base.OnPropertyChanged(propertyName);

    if (propertyName == "HeaderNumber")
    {
        contentView.ControlTemplate = (HeaderNumber == 1) ? Header1Template : Header2Template;
    }
}

请注意，我从未实现过 ControlTemplate，但我认为这可以解决您的问题。