更改 Xamarin.Forms 按钮单击的颜色

Posted 2023-03-25

【中文标题】更改 Xamarin.Forms 按钮单击的颜色

【英文标题】：Change Xamarin.Forms button clicked colour

【发布时间】：2018-07-28 21:05:28

【问题描述】：

我正在开发 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;
        );
    

但是，就我个人而言，我不太喜欢这种方法。怎样才能做得更好？

【问题讨论】：

在按钮模板中简单地编辑按钮按下状态

@ShubhamSahu，这在 Xamarin Forms 中可行吗？根据我的研究，目前是不可能的

【参考方案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>

【讨论】：

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

【参考方案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>

您可以在here 阅读更多信息。

【参考方案3】：

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

这里的问题是每个平台都以不同的方式实现“按下”状态，而 Xamarin.Forms 没有任何内置方式来处理这个问题。

对于 UWP，您有两种选择。首先，您可以创建将在整个应用程序中使用的新默认按钮样式。你可以找到默认的style here，直接复制，修改PressedVisualState，添加is作为默认资源：

<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"];
    

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

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

【讨论】：

感谢您的回答！我认为你上面提到的指针是一个很好的开始。非常感激！ :)

希望对您有所帮助:-)。编码愉快！