Android

Question

几天前才开始学习Android。今天在玩 Button 的时候，发现无法按预期设置边框。

xml 个文件如下：
按钮参与 activity_main.xml:

<Button
    android:layout_width="200sp"
    android:layout_height="100dp"
    android:background="@drawable/start_button_selector"
    app:backgroundTint="@color/start_button_color_selector"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias=".4" />

start_button_selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/arrow_button">
        <shape android:shape="rectangle">
            <solid android:color="@color/transparent" />
            <corners android:radius="12sp" />
            <stroke android:width="10sp" android:color="@color/start_button_color_selector"/>
        </shape>
    </item>
</selector>

start_button_color_selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/black" android:state_pressed="true"/>
    <item android:color="@color/gray"/>
</selector>

然而，预览和模拟器都没有给出预期的结果。
预览不显示任何边框，模拟器显示紫色边框\

预期（点击时所有颜色变为黑色）：

但这里是 xml 设计模式下的预览：

这是它在模拟器中显示的内容 (API 30):

也尝试过：
将按钮更改为 androidx.appcompat.widget.AppCompatButton
删除笔画标签内的颜色
任何帮助都会很棒！

编辑：对不起，如果我没说清楚。问题是按下时没有改变颜色，使用上面的 xml 文件，按钮已经能够在按下时改变颜色。我遇到的问题是边框在预览中是透明的，在模拟器中是紫色的，这不是我预期的 gray/black。

Answer 1

您应该从代码中删除这一行。

app:backgroundTint="@color/start_button_color_selector"

Answer 2

You can create a vector of expected result and apply as background to button, then apply a android:state_pressed on it

Answer 3

您可以使用 Material Button 实现此目的。您可以根据需要使用许多有用的属性来制作按钮，例如 app:strokeWidth、app:strokeColor、app:cornerRadius, app:backgroundTint, app:icon, app:iconSize 以及更多您可以在上面找到它们的地方 link.

下面是使用上述 Material 按钮属性的按钮示例：

<com.google.android.material.button.MaterialButton
        android:id="@+id/button"
        android:layout_width="200dp"
        android:layout_height="100dp"
        android:padding="0dp"
        android:insetLeft="0dp"
        android:insetTop="0dp"
        android:insetRight="0dp"
        android:insetBottom="0dp"
        app:cornerRadius="12dp"
        app:strokeWidth="10dp"
        app:strokeColor="@color/start_button_color_selector"
        app:backgroundTint="@android:color/white"
        app:icon="@drawable/button_selector"
        app:iconTint="@null"
        app:iconSize="80dp"
        app:iconGravity="textStart"
        app:iconPadding="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"/>

其中@color/start_button_color_selector.xml 会像下面这样根据 selected/unselected 状态设置描边颜色：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@android:color/black" android:state_pressed="true"/>
    <item android:color="#969292"/>
</selector>

和@drawable/button_selector会像下面这样根据selected/unselected状态设置正确的矢量图标：

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

和@drawable/ic_arrow_black_right_24dp是一个样本黑色选择箭头：

<vector android:autoMirrored="true" android:height="24dp"
    android:tint="@android:color/black" android:viewportHeight="24"
    android:viewportWidth="24" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
    <path android:fillColor="@android:color/black" android:pathData="M12,4l-1.41,1.41L16.17,11H4v2h12.17l-5.58,5.59L12,20l8,-8z"/>
</vector>

和@drawable/ic_arrow_gray_right_24dp是一个示例灰色未选中箭头：

<vector android:autoMirrored="true" android:height="24dp"
    android:tint="#969292" android:viewportHeight="24"
    android:viewportWidth="24" android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
    <path android:fillColor="#969292" android:pathData="M12,4l-1.41,1.41L16.17,11H4v2h12.17l-5.58,5.59L12,20l8,-8z"/>
</vector>

未选中状态的最终结果将是：

selected/clicked 状态的最终结果将是：

Android - 无法按预期设置按钮边框

Android - cannot set button border as expected

xml

android-studio

android-layout

android-button