改变Xamarin.Forms按钮点击颜色

Question

我正在开发一款基于Xamarin.Forms的UWP应用程序，希望在按钮按下时更改其背景颜色。经过在网上搜索，我找到最直接的方法如下：

 private void Button_OnClicked(object s, EventArgs e)
    {
        var b = (Button) s;
        var originalColour = b.BackgroundColor;
        b.BackgroundColor = Color.DarkOrange;
        Device.StartTimer(TimeSpan.FromSeconds(0.25), () =>
        {
            b.BackgroundColor = originalColour;
            return false;
        });
    }

然而，就个人而言，我并不太喜欢这种方法。如何更好地完成呢？

- Georgi Koemdzhiev

---

只需在按钮模板中编辑按钮按下状态。 - Shubham Sahu

@ShubhamSahu，在Xamarin Forms中是否可能？根据我的研究，目前不可能。 - Georgi Koemdzhiev

Answer 1

XAML中的EventTrigger解决方案：

在MyAssembly中实现以下内容，例如包含App.xaml的可移植程序集：

using Xamarin.Forms;

namespace MyNamespace
{
  public class ButtonTriggerAction : TriggerAction<VisualElement>
  {
    public Color BackgroundColor { get; set; }

    protected override void Invoke(VisualElement visual)
    {
        var button = visual as Button;
        if (button == null) return;
        if (BackgroundColor != null) button.BackgroundColor = BackgroundColor;
    }
  }
}

XAML：

xmlns:local="clr-namespace:MyNamespace;assembly=MyAssembly"
...
<Button Text="EventTrigger">
  <Button.Triggers>
    <EventTrigger Event="Pressed">
      <local:ButtonTriggerAction BackgroundColor="Red" />
    </EventTrigger>
    <EventTrigger Event="Released">
      <local:ButtonTriggerAction BackgroundColor="Default" />
    </EventTrigger>
  </Button.Triggers>
</Button>

- Benl

---

太棒了！非常简单明了，易于实现，甚至不需要我编辑UWP项目。谢谢！ - Georgi Koemdzhiev

Answer 2

更自然、更简洁的做法是使用 VisualStateManager

<Button Text="Click Me!">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">
            <VisualState x:Name="Normal">
                <VisualState.Setters>
                    <Setter Property="BackgroundColor" Value="Green" />
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="Pressed">
                <VisualState.Setters>
                    <Setter Property="BackgroundColor" Value="Red" />
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</Button>

您可以在此处阅读更多相关信息。

- Joseph

Answer 3

这是最简单的解决方案，但当然不太干净。

问题在于每个平台对“按下”状态的实现方式不同，而Xamarin.Forms没有任何内置的处理方式。

在UWP的情况下，您有两个选项。首先，您可以创建一个新的默认按钮样式，该样式将在整个应用程序中使用。您可以在此处找到默认样式，并只需复制它，修改Pressed VisualState，并将其添加为默认资源：

<Style TargetType="Button">
   <!-- ... your style -->
</Style>

然而，如果按下的按钮颜色只应用于某些地方，则应创建一个新视图，该视图派生自按钮并在UWP上使用自定义渲染器，在 OnElementChanged 事件处理程序中应用自定义样式：

protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
{
    base.OnElementChanged(e);

    if (this.Element != null)
    {
        this.Control.Style = ( Style )Application.Current.Resources["CustomButtonStyle"];
    }
}

其他平台也会有类似的解决方案，但你必须以特定于该平台的方式实现它们，可能需要使用自定义渲染器。

有关自定义渲染器的更多信息请参阅文档。您还可以在 Xamarin.Forms Labs 存储库中找到一些灵感。

- Martin Zikmund

---

谢谢您的回答！我认为您上面提到的指针是一个很好的起点。非常感谢！ :) - Georgi Koemdzhiev

希望能有所帮助 :-) 。愉快编程！ - Martin Zikmund