Android材质devisebutton – 预棒棒糖

如何按照谷歌的材料devise指导原则实施“凸起button”和“平面button”?


凸起的button增加了大多数平面布局的维度。 他们强调在繁忙或广阔的空间>function。

凸起的按钮


使用工具栏和对话框的平面button来避免过多的分层。

平面按钮

来源: http : //www.google.com/design/spec/components/buttons.html

这需要Android 5.0

凸起的button

从Widget.Material.Buttoninheritance你的button风格,标准的提升和提升动作将被自动应用。

<style name="Your.Button" parent="android:style/Widget.Material.Button"> <item name="android:background">@drawable/raised_button_background</item> </style> 

然后,您需要在ripple标记中使用button的背景色创build一个raised_button_background.xml文件:

 <ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?attr/colorControlHighlight"> <item android:drawable="@color/button_color"/> </ripple> 

平的button

编辑:而不是我以前的平面button的build议,而应该使用下面的斯蒂芬凯撒给出的build议:

 <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="DONE" style="?android:attr/borderlessButtonStyle" /> 

编辑:如果您使用Support Library,则可以使用style="?attr/borderlessButtonStyle"在Pre-Lollipop设备上获得相同的结果。 (注意android:的缺席android:上面的例子就变成了

 <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="DONE" style="?attr/borderlessButtonStyle" /> 

为了实现平面button,你可以添加style="?android:attr/borderlessButtonStyle"

例:

 <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="DONE" style="?android:attr/borderlessButtonStyle" /> 

这是该属性的参考 。

您可以使用MaterialDesignLibrary 。 这是第三方图书馆。

这是一个包含Android L组件的库,可以在android 2.2中使用。如果你想使用这个库,你只需要下载MaterialDesign项目,将它导入到你的工作区,并把项目作为一个库添加到你的android项目设置中。

我正在研究一个材料兼容性库。 button类在那里,支持animation阴影和触摸波纹。 也许你会觉得它有用。 这是链接 。

我用这个作为AppCompat的button的背景,它描绘了一个凸起的button(所有的涟漪),希望它有帮助。

myRaisedButton.xml – 在drawable文件夹中:

 <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="@color/yourColor"/> <corners android:radius="6dp"/> </shape> </item> <item android:drawable="?android:selectableItemBackground"/> </layer-list> 

styles.xml

 <resources> <style name="AppTheme" parent="AppTheme.Base"/> <style name="AppTheme.Base" parent="Theme.AppCompat"> </resources> 

styles.xml(v21)

 ... <style name="AppTheme" parent="AppTheme.Base"> 

layout.xml

 ... android:background="@drawable/myRaisedButton" 

有关如何使用appcompat libray执行此操作的说明,请查看另一个问题的答案: https ://stackoverflow.com/a/27696134/1932522

这将显示如何使用Android 5.0和更早版本(高达API级别11)的凸起和平面button!

你要求材料devisebutton库你知道https://github.com/navasmdc/MaterialDesignLibrary

您可能还需要为button添加底部边距,以便能够看到凸起button的阴影效果:

 <item name="android:layout_marginBottom">@dimen/activity_vertical_margin</item> <item name="android:elevation">1dp</item>