Xamarin.Forms 默认控件模板

Question

我想调整按钮的默认控件模板。在 WPF 中，我只会使用 blend 来查看默认控件模板，但对于 Xamarin.Forms 我不能使用 blend。

我还在 App.xaml 文件中看到了对

的引用

<ResourceDictionary Source="Resource Dictionaries/StandardStyles.xaml"/>

但我没有找到 StandardStyles.xaml 文件，所以我也很不走运。

在 Xamarin 网站上，我也没有找到默认的控件模板。 那么我在哪里/如何找到 Xamarin.Forms 控件的默认控件模板？

Answer 1

此时，Xamarin.Forms 不提供对按钮的模板支持 - 因此没有默认模板可供参考（就像我们在 WPF 中所做的那样）或 Button 中的 ControlTemplate 属性。它只是在目标平台上呈现按钮的平台版本。

控件模板通常由具有Content 属性的控件支持。一个很好的例子是ContentView。您可以在扩展ContentView 的同时编写自定义按钮控件，同时提供模板支持，并使用ContentPresenter 呈现关联的按钮。

EDIT 1 - 支持模板化的自定义按钮控件

例如：

public class TemplatedButton : ContentView
{
    public TemplatedButton()
    {
        var button = new Button();
        button.SetBinding(Button.TextColorProperty, new Binding(nameof(TextColor), source: this));
        button.SetBinding(BackgroundColorProperty, new Binding(nameof(BackgroundColor), source: this));

        button.SetBinding(IsEnabledProperty, new Binding(nameof(IsEnabled), source: this));
        button.SetBinding(Button.TextProperty, new Binding(nameof(Text), source: this));

        button.SetBinding(Button.CommandProperty, new Binding(nameof(Command), source: this));
        button.SetBinding(Button.CommandParameterProperty, new Binding(nameof(CommandParameter), source: this));

        var tapGestureRecognizer = new TapGestureRecognizer();
        tapGestureRecognizer.SetBinding(TapGestureRecognizer.CommandProperty, new Binding(nameof(Command), source: this));
        tapGestureRecognizer.SetBinding(TapGestureRecognizer.CommandParameterProperty, new Binding(nameof(CommandParameter), source: this));
        GestureRecognizers.Add(tapGestureRecognizer);

        Content = button;
    }

    public static readonly BindableProperty TextProperty =
        BindableProperty.Create(
            "Text", typeof(string), typeof(TemplatedButton),
            defaultValue: default(string));

    public string Text
    {
        get { return (string)GetValue(TextProperty); }
        set { SetValue(TextProperty, value); }
    }

    public static readonly BindableProperty CommandProperty =
        BindableProperty.Create(
            "Command", typeof(ICommand), typeof(TemplatedButton),
            defaultValue: new Command((obj) => System.Diagnostics.Debug.WriteLine("TemplatedButton Tapped")));

    public ICommand Command
    {
        get { return (ICommand)GetValue(CommandProperty); }
        set { SetValue(CommandProperty, value); }
    }

    public static readonly BindableProperty CommandParameterProperty =
        BindableProperty.Create(
            "CommandParameter", typeof(object), typeof(TemplatedButton),
            defaultValue: default(object));

    public object CommandParameter
    {
        get { return (object)GetValue(CommandParameterProperty); }
        set { SetValue(CommandParameterProperty, value); }
    }

    public static readonly BindableProperty TextColorProperty =
        BindableProperty.Create(
            "TextColor", typeof(Color), typeof(TemplatedButton),
            defaultValue: default(Color));

    public Color TextColor
    {
        get { return (Color)GetValue(TextColorProperty); }
        set { SetValue(TextColorProperty, value); }
    }
}

示例用法：

<!-- App/Page resources -->
<ResourceDictionary>
    <ControlTemplate x:Key="ThreeBorderBtn">
        <Grid RowSpacing="0" ColumnSpacing="0" Margin="0">
            <BoxView Margin="5" BackgroundColor="Purple" />
            <BoxView Margin="10" BackgroundColor="Green" />
            <BoxView Margin="15" BackgroundColor="Red" />
            <ContentPresenter Margin="20" />
        </Grid>
    </ControlTemplate>
</ResourceDictionary>

<!-- Control usage -->
<!-- make sure to register xmlns:local namespace --> 
<local:TemplatedButton 
    HeightRequest="100"
    Text="Button Caption!" 
    TextColor="Teal" 
    Command="{Binding ClickCommand}"
    BackgroundColor="White"
    ControlTemplate="{StaticResource ThreeBorderBtn}" />