底部 Sheet 按钮自定义样式不起作用
Bottom Sheet button custom style not working
在我的 BottomSheetDialogFragmen
t 中,我有一个按钮,我想让这个按钮的背景带有灰色边框。
这是我的圆形背景可绘制对象“rounded_tranparent_background.xml”:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle">
<solid android:color="#FFF" />
<stroke
android:width="1dp"
android:color="#8A8383" />
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
</shape>
我将此背景应用到底部 sheet 按钮。
下面是sheet布局代码:
<?xml version="1.0" encoding="utf-8"?>
<layout
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/btnFollowUnfollow"
android:background="@drawable/rounded_tranparent_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/avenir_next_ltpro_medium"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:text="Unfollow"
android:textColor="@color/colorGreyDark"
app:layout_constraintBaseline_toBaselineOf="@+id/tvTitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.71"
app:layout_constraintStart_toEndOf="@+id/tvTitle" />
//...other code...
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
这是我的底部 sheet 对话框样式
<style name="AppBottomSheetDialogTheme"
parent="Theme.Design.Light.BottomSheetDialog">
<item name="android:windowTranslucentStatus">true</item>
<item name="colorPrimary">@color/colorBlue</item>
<item name="colorPrimaryDark">@color/colorBlueDark</item>
<item name="colorAccent">@android:color/transparent</item>
</style>
应用所有这些代码后,我无法实现我正在寻找的东西。
我想要的设计是:
以及我得到的结果
如何在 sheet 对话框底部的按钮上实现自定义设计?
例如,您可以为按钮使用自定义可绘制对象。
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
tools:ignore="ResourceName">
<solid android:color="@color/inside_color" />
<stroke
android:color="@color/border_color"
android:width="3px" />
<corners android:radius="16dp" />
</shape>
输出会是这样的
您可以使用简单的 MaterialButton
:
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cornerRadius="10dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:textColor="..."
app:strokeColor="..."/>
这个修复对我有用:
<Button
android:background="@drawable/rounded_tranparent_background"
...
同时添加“android:backgroundTint”和app:backgroundTint:
<Button
android:background="@drawable/rounded_tranparent_background"
android:backgroundTint="@null"
app:backgroundTint="@null"
...
我的按钮主题定义在 BottomSheetDialogFragment 中也被忽略了
<-- Themes.xml -->
<style>
<item name="materialButtonStyle">MyButtonStyle</item>
<!-- So quick fix: -->
<Button
android:background="@drawable/rounded_tranparent_background"
android:theme="@style/MyButtonStyle"
在我的 BottomSheetDialogFragmen
t 中,我有一个按钮,我想让这个按钮的背景带有灰色边框。
这是我的圆形背景可绘制对象“rounded_tranparent_background.xml”:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle">
<solid android:color="#FFF" />
<stroke
android:width="1dp"
android:color="#8A8383" />
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
</shape>
我将此背景应用到底部 sheet 按钮。
下面是sheet布局代码:
<?xml version="1.0" encoding="utf-8"?>
<layout
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/btnFollowUnfollow"
android:background="@drawable/rounded_tranparent_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/avenir_next_ltpro_medium"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:text="Unfollow"
android:textColor="@color/colorGreyDark"
app:layout_constraintBaseline_toBaselineOf="@+id/tvTitle"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.71"
app:layout_constraintStart_toEndOf="@+id/tvTitle" />
//...other code...
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
这是我的底部 sheet 对话框样式
<style name="AppBottomSheetDialogTheme"
parent="Theme.Design.Light.BottomSheetDialog">
<item name="android:windowTranslucentStatus">true</item>
<item name="colorPrimary">@color/colorBlue</item>
<item name="colorPrimaryDark">@color/colorBlueDark</item>
<item name="colorAccent">@android:color/transparent</item>
</style>
应用所有这些代码后,我无法实现我正在寻找的东西。
我想要的设计是:
以及我得到的结果
如何在 sheet 对话框底部的按钮上实现自定义设计?
例如,您可以为按钮使用自定义可绘制对象。
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
tools:ignore="ResourceName">
<solid android:color="@color/inside_color" />
<stroke
android:color="@color/border_color"
android:width="3px" />
<corners android:radius="16dp" />
</shape>
输出会是这样的
您可以使用简单的 MaterialButton
:
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:cornerRadius="10dp"
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:textColor="..."
app:strokeColor="..."/>
这个修复对我有用:
<Button
android:background="@drawable/rounded_tranparent_background"
...
同时添加“android:backgroundTint”和app:backgroundTint:
<Button
android:background="@drawable/rounded_tranparent_background"
android:backgroundTint="@null"
app:backgroundTint="@null"
...
我的按钮主题定义在 BottomSheetDialogFragment 中也被忽略了
<-- Themes.xml -->
<style>
<item name="materialButtonStyle">MyButtonStyle</item>
<!-- So quick fix: -->
<Button
android:background="@drawable/rounded_tranparent_background"
android:theme="@style/MyButtonStyle"