如何创建标准的无边界按钮(如上述设计指南中所述)? [英] How to create standard Borderless buttons (like in the design guideline mentioned)?

问题描述

我只是查看设计指南，想知道无边界按钮. 我凝视了一下，试图在源头中查找，但我自己无法将其组合在一起. 这是普通的Button小部件，但是您添加了自定义(Android默认)样式? 如何制作这些无边界按钮(当然您可以将背景设置为空，但是我没有分隔线)?

I was just checking the design guidelines and wondering about the borderless buttons. I goggled and tried to find in the source but can't bring it together by myself. Is this the normal Button widget but you add a custom (Android default) style? How to make these borderless buttons (of course you can set the background to empty, but then I don't have the divider)?

此处提供了设计指南的链接:

Here links to the design guidelines:

• http://developer.android.com/design/building-blocks/button.html
• http://developer.android.com/guide/topic/ui/controls/button.html#Borderless

• http://developer.android.com/design/building-blocks/buttons.html
• http://developer.android.com/guide/topics/ui/controls/button.html#Borderless

推荐答案

清除一些困惑:

这可以通过2个步骤完成:将按钮背景属性设置为 android:attr/selectableItemBackground 会创建一个带有反馈但没有背景的按钮.

This is done in 2 steps: Setting the button background attribute to android:attr/selectableItemBackground creates you a button with feedback but no background.

android:background="?android:attr/selectableItemBackground"

将无边界按钮与其余布局分开的行是通过具有背景 android:attr/dividerVertical

The line to divide the borderless button from the rest of you layout is done by a view with the background android:attr/dividerVertical

android:background="?android:attr/dividerVertical"

为了更好地理解，此处是屏幕底部的确定"/取消无边界"按钮组合的布局(如上图所示).

For a better understanding here is a layout for a OK / Cancel borderless button combination at the bottom of your screen (like in the right picture above).

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_alignParentBottom="true">
        <View
            android:layout_width="match_parent"
            android:layout_height="1dip"
            android:layout_marginLeft="4dip"
            android:layout_marginRight="4dip"
            android:background="?android:attr/dividerVertical"
            android:layout_alignParentTop="true"/>
        <View
            android:id="@+id/ViewColorPickerHelper"
            android:layout_width="1dip"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="4dip"
            android:layout_marginTop="4dip"
            android:background="?android:attr/dividerVertical" 
            android:layout_centerHorizontal="true"/>
        <Button
            android:id="@+id/BtnColorPickerCancel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:layout_toLeftOf="@id/ViewColorPickerHelper"
            android:background="?android:attr/selectableItemBackground"
            android:text="@android:string/cancel" 
            android:layout_alignParentBottom="true"/>
        <Button
            android:id="@+id/BtnColorPickerOk"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:background="?android:attr/selectableItemBackground"
            android:text="@android:string/ok" 
            android:layout_alignParentBottom="true" 
            android:layout_toRightOf="@id/ViewColorPickerHelper"/>
    </RelativeLayout>

这篇关于如何创建标准的无边界按钮(如上述设计指南中所述)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！