如何在 Android 中创建无边框按钮 [重复]

Posted 2023-02-22

【中文标题】如何在 Android 中创建无边框按钮 [重复]

【英文标题】：How to Create Borderless Buttons in Android [duplicate]

【发布时间】：2012-02-28 09:18:18

【问题描述】：

android Design Guidelines 说要使用无边框按钮（见下图），但并没有真正解释如何使用。几周前有人在这里问过同样的问题：How to create standard Borderless buttons (like in the design guidline mentioned)? 并且有一个标记为“the”的答案，但我仍然迷路，我看不到将 cmets 添加到已“关闭”的问题的方法"

答主说

"查看主题属性buttonBarStyle, buttonBarButtonStyle 和 borderlessButtonStyle"

但我仍然不知道如何实际使用这些东西。我用谷歌搜索了一下，找不到任何东西，所以我想我再问一次，希望有人能提供更多关于它是如何工作的细节。

【参考方案1】：

当我几周前查看这里并注意到有关使用透明背景的答案时，我以为我已经解决了这个问题，但这还不够好，因为它会阻止按钮在按下时突出显示。

另外，将样式设置为Widget.Holo.Button.Borderless 也不合适，因为它会使按钮边界变大。

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

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

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

【讨论】：

这是正确的做法。

我找这个已经有一段时间了。谢谢！

如何通过 java 代码而不是 XML 来完成？我正在代码中创建一个 ImageButton 并希望它是无边框的，但在触摸时也具有突出显示颜色

selectableItemBackground 仅从 API 级别 11 开始支持，是否有针对旧版本的解决方案？

@alexandroid 你必须为低版本创建自己的

【参考方案2】：

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

Button 或 ImageButton 标签上的属性：

    style="?android:attr/borderlessButtonStyle"

【讨论】：

那种会产生有点超出视图的涟漪效果的样式呢？例如，在 Lollipop 的联系人应用程序中，当您搜索联系人时，然后单击“向上”按钮（箭头）？就好像按钮本身是圆形的，但具有透明背景......

@Dalc，很棒的工作

@Dalc 我如何以编程方式应用它..？

这适用于按钮，但是当您对 ImageButtons 执行此操作时，虽然边框消失了，但它失去了仅将其宽度包裹到提供的图像的能力，并开始表现得像一个带有最小宽度。所以对于ImageButtons，最好的办法是android:background="?android:attr/selectableItemBackground"

【参考方案3】：

如果你使用 ActionbarSherlock...

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

【讨论】：

如果你使用 HoloEverywhere <Button android:background="?selectableItemBackground" />

使用 minimumSdk 9 非常适合我

【参考方案4】：

前几天又被这个绊倒了。

这是我的解决方案：

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

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

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

的视图完成

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

为了更好地理解，这里是屏幕底部的“确定/取消”无边框按钮组合的布局（如上右图所示）。

<RelativeLayout
        android:layout_
        android:layout_
        android:layout_alignParentBottom="true">
        <View
            android:layout_
            android:layout_
            android:layout_marginLeft="4dip"
            android:layout_marginRight="4dip"
            android:background="?android:attr/dividerVertical"
            android:layout_alignParentTop="true"/>
        <View
            android:id="@+id/ViewColorPickerHelper"
            android:layout_
            android:layout_
            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_
            android:layout_
            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_
            android:layout_
            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>

【参考方案5】：

此代码适用于我：

<View
    android:layout_
    android:layout_
    android:background="?android:attr/dividerVertical" />

<LinearLayout
    style="?android:attr/buttonBarStyle"
    android:layout_
    android:layout_
    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_
        android:layout_
        android:layout_weight="1"
        android:onClick="onClickCancel"
        android:text="@string/cancel" />

     <Button
        android:id="@+id/info"
        style="?android:attr/buttonBarButtonStyle"
        android:layout_
        android:layout_
        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_
        android:layout_
        android:layout_weight="1"
        android:onClick="onClickSave"
        android:text="@string/save" />
</LinearLayout>

我在底部显示 3 个按钮

【参考方案6】：

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

【讨论】：

如果图片背景本身不透明，那也没多大用。

android:background="@null" 也有效

【参考方案7】：

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

【参考方案8】：

您还应该将图片的边距和内边距设置为 0。 另请查看 How to create standard Borderless buttons (like in the design guidline mentioned)? 处的第二个未标记答案