在 Android 上使无边框图像按钮变小
Make borderless image button small on Android
我的应用程序中有一些可关闭的视图,它在 header 中有一个关闭按钮。我想让这个按钮无边框而且小。
代码:
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/borderlessButtonStyle"
android:layout_margin="0dp"
android:padding="0dp"
android:src="@android:drawable/ic_menu_close_clear_cancel"/>
结果按钮是无边框的,但十字图像周围有很多空白区域(在屏幕截图上点击按钮使空白 space 可见)
我该如何解决?
为此使用 textView..
并使用 textview.OnTouchListener
最后 onTouch 更改文本的颜色..就是这样
否则在您的代码中使用
android:background="@null"
您可以在 ImageButton 上使用以下内容删除 'border':
android:background="@android:color/transparent"
或
android:background="@null"
如果您想在用户单击按钮时更改背景,您可以创建一个选择器。示例 ImageButton doesn't highlight on click with Transparent background.
已添加
android:minHeight="0dp"
android:minWidth="0dp"
android:padding="2dp"
结果
此外,我将使用负边距将按钮放置在更靠近角落的位置。
你应该使用:
android:background="?selectableItemBackgroundBorderless"
随着 ConstraintLayout
的引入,您可以使用约束来减少无边框 ImageButton
的宽度,默认情况下太宽了,方法是将其限制为与高度一样宽:
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/my_closeable_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
style="?android:attr/borderlessButtonStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:contentDescription="@string/action_close"
android:src="@android:drawable/ic_menu_close_clear_cancel"
app:layout_constraintDimensionRatio="w,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
我不建议你将它设置得比这个小,因为触摸目标至少需要 48dp x 48dp,至于 Google's Material Design guidelines,否则用户将很难尝试触摸它。
如果你真的需要它看起来更接近视图的边缘,你总是可以使用不居中的图像(在一侧或两侧有透明填充),但我会尽力避免执行此解决方法并尝试重新考虑我的应用程序设计以按原样容纳按钮。
我的应用程序中有一些可关闭的视图,它在 header 中有一个关闭按钮。我想让这个按钮无边框而且小。
代码:
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/borderlessButtonStyle"
android:layout_margin="0dp"
android:padding="0dp"
android:src="@android:drawable/ic_menu_close_clear_cancel"/>
结果按钮是无边框的,但十字图像周围有很多空白区域(在屏幕截图上点击按钮使空白 space 可见)
我该如何解决?
为此使用 textView.. 并使用 textview.OnTouchListener 最后 onTouch 更改文本的颜色..就是这样
否则在您的代码中使用
android:background="@null"
您可以在 ImageButton 上使用以下内容删除 'border':
android:background="@android:color/transparent"
或
android:background="@null"
如果您想在用户单击按钮时更改背景,您可以创建一个选择器。示例 ImageButton doesn't highlight on click with Transparent background.
已添加
android:minHeight="0dp"
android:minWidth="0dp"
android:padding="2dp"
结果
此外,我将使用负边距将按钮放置在更靠近角落的位置。
你应该使用:
android:background="?selectableItemBackgroundBorderless"
随着 ConstraintLayout
的引入,您可以使用约束来减少无边框 ImageButton
的宽度,默认情况下太宽了,方法是将其限制为与高度一样宽:
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/my_closeable_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
style="?android:attr/borderlessButtonStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:contentDescription="@string/action_close"
android:src="@android:drawable/ic_menu_close_clear_cancel"
app:layout_constraintDimensionRatio="w,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
我不建议你将它设置得比这个小,因为触摸目标至少需要 48dp x 48dp,至于 Google's Material Design guidelines,否则用户将很难尝试触摸它。
如果你真的需要它看起来更接近视图的边缘,你总是可以使用不居中的图像(在一侧或两侧有透明填充),但我会尽力避免执行此解决方法并尝试重新考虑我的应用程序设计以按原样容纳按钮。