如何在Android中创建无边框按钮

时间:2012-02-06 21:57:27

标签: android layout button borderless

Android Design Guidelines说使用无边框按钮(见下图),但没有真正解释如何。几个星期前有人在这里问了同样的问题:How to create standard Borderless buttons (like in the design guidline mentioned)?并且有一个答案被标记为“答案”,但我仍然输了,我没有办法在一个问题上添加评论“封闭”

答案者说

  

“查看主题属性buttonBarStyle,   buttonBarButtonStyleborderlessButtonStyle

但我仍然无法弄清楚如何实际使用这些东西。我用Google搜索了一下,找不到任何东西,所以我想我只是再问这个问题,希望有人可以提供一些更详细的信息。

enter image description here

8 个答案:

答案 0 :(得分:141)

我认为几周前我看到这里就解决了这个问题并注意到了使用透明背景的答案,但它不够好,因为它会阻止按钮在按下时突出显示。

此外,将样式设置为Widget.Holo.Button.Borderless是不合适的,因为它会使按钮边界变大。

为了一劳永逸地解决这个问题,我检查标准日历应用程序的android源代码,发现它使用以下内容:

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

这样做可确保按钮无边框的大小正确。

答案 1 :(得分:78)

看看这个:http://developer.android.com/guide/topics/ui/controls/button.html#Borderless

ButtonImageButton代码中的属性:

    style="?android:attr/borderlessButtonStyle"

答案 2 :(得分:24)

如果您使用ActionbarSherlock ...

<Button 
  android:id="@+id/my_button" 
  style="@style/Widget.Sherlock.ActionButton" />

答案 3 :(得分:19)

前几天再次对此进行了标记。

这是我的解决方案:

这是通过两个步骤完成的:将按钮背景属性设置为 android:attr / selectableItemBackground 会为您创建一个包含反馈但没有背景的按钮。

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

将无边框按钮与其他人布局分开的线由背景 android:attr / dividerVertical

的视图完成
android:background="?android:attr/dividerVertical"

为了更好地理解,屏幕底部是OK / Cancel无边框按钮组合的布局(如右上图所示)。

<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>

答案 4 :(得分:12)

此代码适用于我:

<View
    android:layout_width="match_parent"
    android:layout_height="1dip"
    android:background="?android:attr/dividerVertical" />

<LinearLayout
    style="?android:attr/buttonBarStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:measureWithLargestChild="true"
    android:orientation="horizontal"
    android:paddingLeft="2dip"
    android:paddingRight="2dip"
    android:paddingTop="0dip" >

    <Button
        android:id="@+id/cancel"
        style="?android:attr/buttonBarButtonStyle"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:onClick="onClickCancel"
        android:text="@string/cancel" />

     <Button
        android:id="@+id/info"
        style="?android:attr/buttonBarButtonStyle"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:onClick="onClickInfo"
        android:visibility="gone"
        android:text="@string/info" />

    <Button
        android:id="@+id/ok"
        style="?android:attr/buttonBarButtonStyle"
        android:layout_width="0dip"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:onClick="onClickSave"
        android:text="@string/save" />
</LinearLayout>

我在底部显示3个按钮

答案 5 :(得分:9)

android:background="@android:color/transparent"

答案 6 :(得分:7)

<Button android:id="@+id/my_button" style="@android:style/Widget.Holo.Button.Borderless" />

答案 7 :(得分:0)

您还应该将图片的边距和填充设置为0。 另请查看How to create standard Borderless buttons (like in the design guidline mentioned)?

上的第二个未标记的答案