我遵循this等问题的提示来创建一个类似Material Design上建议的按钮样式。
但是,我需要更改加铺转角,但无法通过继承Widget.AppCompat.Button.Colored样式和设置radius参数来完成此操作。我怎么能有相同的风格,但圆角?
Widget.AppCompat.Button.Colored
ilmyapht1#
尝试以下代码创建一个名为circular_button. xml的可绘制文件并插入以下代码
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="#008577" /> <corners android:bottomRightRadius="100dp" android:bottomLeftRadius="100dp" android:topRightRadius="100dp" android:topLeftRadius="100dp"/> </shape>
然后将按钮的背景更改为该可绘制文件
<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/circle_button" android:text="Button"/>
如果你想要一个完整的圆形按钮,你可以使用下面的绘图
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="#008577"/> <size android:width="120dp" android:height="120dp"/> </shape>
xqnpmsa82#
只使用材质按钮和圆角半径,但不要设置背景色。要设置背景色,请使用backgroundTint,它应该可以正常工作
<com.google.android.material.button.MaterialButton android:id="@+id/post_comment" android:layout_width="100dp" android:layout_height="wrap_content" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:cornerRadius="10dp" android:backgroundTint="@color/blue" android:text="Jogapla" android:textAllCaps="false" android:textSize="14sp" android:textColor="@color/white" android:fontFamily="@font/sfpro_heavy" android:layout_marginHorizontal="10dp" android:layout_marginBottom="10dp" /> ````
x8goxv8g3#
使用**Material Components Library:**。将the dependency添加到您的build.gradle:
build.gradle
dependencies { implementation ‘com.google.android.material:material:1.3.0’ }
在这种情况下,您可以在布局文件中使用MaterialButton:
MaterialButton
<com.google.android.material.button.MaterialButton .... style="@style/Widget.MaterialComponents.Button" app:cornerRadius=".." app:strokeColor="@color/colorPrimary"/>
使用**app:cornerRadius**属性来更改圆角半径的大小。这将使指定尺寸的圆角变圆。
app:cornerRadius
也可以使用**shapeAppearanceOverlay**属性自定义角。
shapeAppearanceOverlay
<style name="MyButton" parent="Widget.MaterialComponents.Button.OutlinedButton"> <item name="shapeAppearanceOverlay">@style/MyShapeAppearance</item> </style> <style name="MyShapeAppearance"> <item name="cornerFamily">rounded</item> <item name="cornerFamilyTopRight">cut</item> <item name="cornerFamilyBottomRight">cut</item> <item name="cornerSizeTopLeft">32dp</item> <item name="cornerSizeBottomLeft">32dp</item> </style>
官方文档是here和所有的android规格here。
对于Jetpack合成1.0.x,使用**shape**参数:
1.0.x
shape
Button( onClick = { /* Do something! */ }, shape = RoundedCornerShape(8.dp)) { Text("Button") }
Button(modifier = Modifier.padding(16.dp), onClick = { /* Do something! */ }, shape = RoundedCornerShape( 50, // topEndPercent 0, // topEndPercent 0, // bottomEndPercent 50. // bottomStartPercent ) ) { Text("Button") }
旧支持库:
在新的支持库28.0.0中,设计库现在包含Material Button。您可以使用以下命令将此按钮添加到布局文件:
Material Button
<android.support.design.button.MaterialButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="XXXXX" android:textSize="18sp" android:backgroundTint="@color/colorPrimary" app:icon="@drawable/ic_android_white_24dp" />
可以使用此属性设置加铺转角:
dependencies { implementation 'com.android.support:design:28.0.0' }
insrf1ej4#
下面Gabriele Mariotti的回答现在更好。
你需要继承这种风格。添加到您的样式.xml:
<style name="AppTheme.RoundedCornerMaterialButton" parent="Widget.AppCompat.Button.Colored"> <item name="android:background">@drawable/rounded_shape</item> </style>
添加文件drawable/rounded_shape.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <solid android:color="@color/colorAccent" > </solid> <corners android:radius="11dp" > </corners> </shape>
最后,在布局中:
<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Test Text" style="@style/AppTheme.RoundedCornerMaterialButton"/>
编辑:更新答案使用主题的颜色,而不是硬编码的颜色。
kxkpmulp5#
具有涟漪效果的圆形材质按钮
在可绘制文件夹涟漪.xml中创建文件
<?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?android:attr/colorControlHighlight"> <item android:id="@android:id/mask"> <shape android:shape="rectangle"> <solid android:color="@color/colorPrimary" /> <corners android:radius="20dp" /> </shape> </item> <item android:drawable="@drawable/rounded_shape" /> </ripple>
在可绘制文件夹rounded_shape.xml中创建文件
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <solid android:color="@color/colorPrimary" > </solid> <corners android:radius="20dp" > </corners> </shape>
在您的按钮上:
<Button android:id="@+id/button1" android:background="@drawable/ripple" android:text="Login"/>
3duebb1j6#
现在使用MaterialButton为圆形按钮更多的事情你可以做这个。请按照链接并为圆角添加app:cornerRadius="8dp"别忘了在build.gradle中添加谷歌素材库
app:cornerRadius="8dp"
implementation "com.google.android.material:material:1.1.0"
brtdzjyr7#
我会告诉你我的确切解决方案。在选择器标签内,你可以把项目(按钮的功能)选择器标签的第二项具有相反的行为。您可以添加选择器(按钮行为)添加此可绘制XML作为按钮的背景android:background="@drawable/this xml”
<?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="#ffffff"> <!-- this is the ripple color(first touch color changes into this color) --> <item> <selector> <item android:state_enabled="true"> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <!-- default button color --> <solid android:color="@color/colorPrimary"></solid> <corners android:radius="151dp"></corners> </shape> </item> <item> //first item was state enabled so this is automatically state disabled <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <!-- button disabled color opposite behaviour --> <solid android:color="#e9d204"></solid> <corners android:radius="151dp"></corners> </shape> </item> </selector> </item> <item> <selector> <item android:state_pressed="true"> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <!-- button first touch of your finger color --> <solid android:color="#1989fa"></solid> <corners android:radius="151dp"></corners> </shape> </item> </selector> </item> <item> <selector> <item android:state_hovered="true"> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <!-- hovered with a note pencil --> <solid android:color="#4affffff"></solid> <corners android:radius="151dp"></corners> </shape> </item> </selector> </item> </ripple>
5ssjco0h8#
另一个简单的方法是将其环绕cardView,记得将cardView的layout_width和layout_height设置为wrap_content,并且按钮所需的所有边距都应应用于cardView
<android.support.v7.widget.CardView android:layout_width="wrap_content" android:layout_height="wrap_content" app:cardCornerRadius="8dp" android:layout_marginLeft="10dp" android:layout_marginRight="10dp" android:layout_marginBottom="40dp" app:elevation="10dp"> <android.support.v7.widget.AppCompatButton android:id="@+id/login_twitter" android:tag="login_twitter" android:layout_width="300dp" android:layout_height="60dp" android:paddingLeft="10dp" android:foreground="?attr/selectableItemBackgroundBorderless" android:textColor="@color/blue_grey_ligthen_5" android:drawableLeft="@drawable/twitter" android:background="@color/twitter" android:text="@string/login_with_twitter" /> </android.support.v7.widget.CardView>
dba5bblo9#
如果您不想更改整个应用的主题,您可以专门为此视图使用材质主题:
<com.google.android.material.button.MaterialButton android:id="@+id/fooButon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="16dp" android:fontFamily="sans-serif" android:padding="8dp" ==> android:theme="@style/Theme.MaterialComponents.Light" app:backgroundTint="@color/base_white" />
9条答案
按热度按时间ilmyapht1#
尝试以下代码创建一个名为circular_button. xml的可绘制文件并插入以下代码
然后将按钮的背景更改为该可绘制文件
如果你想要一个完整的圆形按钮,你可以使用下面的绘图
xqnpmsa82#
只使用材质按钮和圆角半径,但不要设置背景色。要设置背景色,请使用backgroundTint,它应该可以正常工作
x8goxv8g3#
使用**Material Components Library:**。
将the dependency添加到您的
build.gradle
:在这种情况下,您可以在布局文件中使用
MaterialButton
:使用**
app:cornerRadius
**属性来更改圆角半径的大小。这将使指定尺寸的圆角变圆。也可以使用**
shapeAppearanceOverlay
**属性自定义角。官方文档是here和所有的android规格here。
对于Jetpack合成
1.0.x
,使用**shape
**参数:旧支持库:
在新的支持库28.0.0中,设计库现在包含
Material Button
。您可以使用以下命令将此按钮添加到布局文件:
可以使用此属性设置加铺转角:
app:cornerRadius
: 用于定义按钮角的半径insrf1ej4#
更新:
下面Gabriele Mariotti的回答现在更好。
旧答案:
你需要继承这种风格。
添加到您的样式.xml:
添加文件drawable/rounded_shape.xml:
最后,在布局中:
编辑:更新答案使用主题的颜色,而不是硬编码的颜色。
kxkpmulp5#
具有涟漪效果的圆形材质按钮
在可绘制文件夹涟漪.xml中创建文件
在可绘制文件夹rounded_shape.xml中创建文件
在您的按钮上:
3duebb1j6#
现在使用MaterialButton为圆形按钮更多的事情你可以做这个。请按照链接
并为圆角添加
app:cornerRadius="8dp"
别忘了在build.gradle中添加谷歌素材库
brtdzjyr7#
我会告诉你我的确切解决方案。在选择器标签内,你可以把项目(按钮的功能)
选择器标签的第二项具有相反的行为。您可以添加选择器(按钮行为)添加此可绘制XML作为按钮的背景android:background="@drawable/this xml”
5ssjco0h8#
另一个简单的方法是将其环绕cardView,记得将cardView的layout_width和layout_height设置为wrap_content,并且按钮所需的所有边距都应应用于cardView
dba5bblo9#
如果您不想更改整个应用的主题,您可以专门为此视图使用材质主题: