单击时更改按钮的颜色,同时保持其形状

Change color of Button on click while keeping its shape

下面的代码在单击时将按钮的背景颜色从绿色更改为红色,其中 bgColor 的适当 MvxColor 在我的 StartStopCommand 中定义。它可以工作,但是 MvxBind BackgroundColor 会覆盖 Button 的形状。

有没有办法在 Android 中保持这种形状并且仅以不需要平台特定代码(如下所示)的方式更改颜色?

Android中的按钮:

<Button
            android:text="Start"
            android:textColor="#FFFFFF"
            android:textSize="30sp"
            android:layout_margin="5dip"
            android:layout_width="270dp"
            android:layout_height="wrap_content"
            android:background="@drawable/buttonshape"
            local:MvxBind="Click StartStopCommand; BackgroundColor bgColor, Converter=NativeColor" />

其中形状 xml 是:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
  <corners
  android:radius="10dp"
/>
  <solid
  android:color="#3497db"
/>
  <size
  android:width="270dp"
  android:height="60dp"
/>
</shape>

由于您正在为按钮设置 Background 资源,稍后使用 BackgroundColor 将丢弃您在那里设置的所有内容。

您可能想要的是 Background 资源的 Selector,它决定了当 Button 正常、专注、活动以及您想要的任何其他状态时设置的内容回应。这是一个非常特定于平台的事情,您可能无法在其他平台上重用该行为。

总之。你可以尝试这样的事情:

shape_selected.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"   
  android:shape="rectangle" >
  <corners android:radius="10dp" />
  <solid android:color="#dddddd" /> <!-- use selected color here -->
  <size
    android:width="270dp"
    android:height="60dp"/>
</shape>

shape_unselected.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"   
  android:shape="rectangle" >
  <corners android:radius="10dp" />
  <solid android:color="#3497db" />
  <size
    android:width="270dp"
    android:height="60dp"/>
</shape>

button_background.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/shape_selected" android:state_selected="true" />
    <item android:drawable="@drawable/shape_selected" android:state_pressed="true" />
    <item android:drawable="@drawable/shape_unselected" />
</selector>

然后你会使用 button_background 作为你的 Button Background 属性:

<Button
    ...
    android:background="@drawable/buttonshape"
    local:MvxBind="Click StartStopCommand" />

否则,如果您想继续使用 属性 设置 BackgroundColor 而不更改形状,则需要使用 Background 属性,动态构建可绘制形状的转换器。

因此,在您的转换器中,您只需 return 一个带有您的颜色的 ShapeDrawable,您可以这样构建它:

private ShapeDrawable CreateShapeDrawable(Color color)
{
    var roundRect = new RoundRectShape (new [] { 10f, 10f, 10f, 10f, 10f, 10f, 10f, 10f }, null, null);
    var shape = new ShapeDrawable (roundRect) {
        Paint = new Paint { Color = color }
    };
    return shape;
}

编辑:

类似这样的东西可能适用于转换器方法:

public class MyStateToDrawableConverter : MvxValueConverter<MvxColor, Drawable>
{
    protected override Drawable Convert(MvxColor value, object parameter, CultureInfo culture)
    {
        return CreateShapeDrawable(value.ToNative());
    }

    private ShapeDrawable CreateShapeDrawable(Color color)
    {
        var roundRect = new RoundRectShape (new [] { 10f, 10f, 10f, 10f, 10f, 10f, 10f, 10f }, null, null);
        var shape = new ShapeDrawable (roundRect) {
            Paint = new Paint { Color = color }
        };
        return shape;
    }
}

button_selected

<solid android:color="@color/btn_grey" />

<stroke
    android:width="1dp"
    android:color="@color/transparant" />

<padding
    android:bottom="1dp"
    android:left="1dp"
    android:right="1dp"
    android:top="1dp" />

<corners
    android:bottomLeftRadius="5dp"
    android:bottomRightRadius="5dp"
    android:topLeftRadius="5dp"
    android:topRightRadius="5dp" />

button_unselected

<solid android:color="@color/orange_500" />

<stroke
    android:width="1dp"
    android:color="@color/transparant" />

<padding
    android:bottom="1dp"
    android:left="1dp"
    android:right="1dp"
    android:top="1dp" />

<corners
    android:bottomLeftRadius="5dp"
    android:bottomRightRadius="5dp"
    android:topLeftRadius="5dp"
    android:topRightRadius="5dp" />

在java文件中

私有按钮 btnMap;

btnMap = (按钮) findViewById(R.id.btn_map);

如果(布尔) { btnMap.setBackgroundDrawable(getResources().getDrawable(R.drawable.button_selected)); }

其他{ btnMap.setBackgroundDrawable(getResources().getDrawable(R.drawable.button_unselected));