Android材质设计按钮样式

我对材质设计的纽扣款式很困惑。我想要像附件链接那样的彩色凸起按钮。，比如用法部分下面的“强制停止”和“卸载”按钮。是否有可用的样式或者我需要定义它们?

http://www.google.com/design/spec/components/buttons.html#buttons-usage

我找不到默认的按钮样式。

例子:

 <Button style="@style/PrimaryButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Calculate"
    android:id="@+id/button3"
    android:layout_below="@+id/editText5"
    android:layout_alignEnd="@+id/editText5"
    android:enabled="true" />

如果我尝试通过添加来改变按钮的背景颜色

    android:background="@color/primary"

所有的样式都消失了，比如触摸动画、阴影、圆角等等。

当前回答

我尝试了很多答案和第三方的libs，但没有一个是保持边界和提高效果的前棒棒糖，同时对棒棒糖产生无缺陷的涟漪效应。以下是我的最终解决方案，结合了几个答案(由于灰度颜色深度，边框/凸起在gif上不能很好地渲染):

棒棒糖

Pre-lollipop

build.gradle

compile 'com.android.support:cardview-v7:23.1.1'

layout.xml

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card"
    card_view:cardElevation="2dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardMaxElevation="8dp"
    android:layout_margin="6dp"
    >
    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="0dp"
        android:background="@drawable/btn_bg"
        android:text="My button"/>
</android.support.v7.widget.CardView>

drawable-v21 / btn_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?attr/colorControlHighlight">
    <item android:drawable="?attr/colorPrimary"/>
</ripple>

可拉的/ btn_bg.xml

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

活动的onCreate

    final CardView cardView = (CardView) findViewById(R.id.card);
    final Button button = (Button) findViewById(R.id.button);
    button.setOnTouchListener(new View.OnTouchListener() {
        ObjectAnimator o1 = ObjectAnimator.ofFloat(cardView, "cardElevation", 2, 8)
                .setDuration
                        (80);
        ObjectAnimator o2 = ObjectAnimator.ofFloat(cardView, "cardElevation", 8, 2)
                .setDuration
                        (80);

        @Override
        public boolean onTouch(View v, MotionEvent event) {

            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    o1.start();
                    break;
                case MotionEvent.ACTION_CANCEL:
                case MotionEvent.ACTION_UP:
                    o2.start();
                    break;
            }
            return false;
        }
    });

2016-02-02 12:03:16

其他回答

你可以通过添加z轴来给视图添加航空，并且可以有默认的阴影。该功能在L预览版中提供，并将在发布后可用。现在，你可以简单地添加一个图像给这个按钮的背景

2014-10-13 19:00:48

我是这样得到我想要的东西的。

首先，创建一个按钮(在styles.xml中):

<style name="Button">
    <item name="android:textColor">@color/white</item>
    <item name="android:padding">0dp</item>
    <item name="android:minWidth">88dp</item>
    <item name="android:minHeight">36dp</item>
    <item name="android:layout_margin">3dp</item>
    <item name="android:elevation">1dp</item>
    <item name="android:translationZ">1dp</item>
    <item name="android:background">@drawable/primary_round</item>
</style>

按钮的波纹和背景，作为一个可绘制的primary_round.xml:

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@color/primary_600">
  <item>
    <shape xmlns:android="http://schemas.android.com/apk/res/android">
        <corners android:radius="1dp" />
        <solid android:color="@color/primary" />
    </shape>
  </item>
</ripple>

这增加了我正在寻找的连锁反应。

2014-10-13 21:36:36

// here is the custom button style
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape>
        <gradient
            android:angle="45"
            android:centerColor="@color/colorPrimary"
            android:startColor="@color/colorPrimaryDark"
            android:endColor="@color/colorAccent"
            >
        </gradient>
        <corners
            android:topLeftRadius="10dp"
            android:topRightRadius="10dp"
            android:bottomLeftRadius="10dp"
            android:bottomRightRadius="10dp"
            >
        </corners>
        <stroke
            android:width="2dp"
            android:color="@color/colorWhite"
            >
          </stroke>
      </shape>
       </item>

</selector>

2021-03-24 12:49:00

1)你可以通过定义xml drawable来创建圆角按钮，你可以增加或减少半径来增加或减少按钮角的圆度。设置此xml绘图作为按钮的背景。

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetLeft="4dp"
    android:insetTop="6dp"
    android:insetRight="4dp"
    android:insetBottom="6dp">
    <ripple android:color="?attr/colorControlHighlight">
        <item>
            <shape android:shape="rectangle"
                android:tint="#0091ea">
                <corners android:radius="10dp" />
                <solid android:color="#1a237e" />
                <padding android:bottom="6dp" />
            </shape>
        </item>
    </ripple>
</inset>

2)改变默认的阴影和阴影过渡动画之间的按钮状态，你需要定义选择器，并应用到按钮使用android:stateListAnimator属性。完整的按钮定制参考:http://www.zoftino.com/android-button

2017-09-09 06:00:03

棒棒糖