首页 文章

Android Material Design中的“Touch Target Size”究竟是什么?

提问于
浏览
4

参考Material Design上的Android文档,我经常发现我们被引导将按钮的"touch target"设置为48dp(https://www.google.com/design/spec/components/buttons.html#buttons-style) . 但它是每个Button元素的默认值,还是我必须明确设置它以及如何设置它?

2 回答

  • 1

    如果你对默认的材质按钮没问题,只需使用它 . 大多数事情都可以 . Button的材质主题定义为:

    <!-- Bordered ink button -->
    <style name="Widget.Material.Button">
        <item name="background">@drawable/btn_default_material</item>
        <item name="textAppearance">?attr/textAppearanceButton</item>
        <item name="minHeight">48dip</item>
        <item name="minWidth">88dip</item>
        <item name="stateListAnimator">@anim/button_state_list_anim_material</item>
        <item name="focusable">true</item>
        <item name="clickable">true</item>
        <item name="gravity">center_vertical|center_horizontal</item>
    </style>
    

    如您所见,minHeight属性设置为48dp,这意味着此按钮的高度至少为48dp . 有什么不好的是,Button的背景有插图,这意味着通过在按钮周围放置一些透明像素来实现额外的触摸区域 . 它使按钮很难正确布局,如下面的SO帖子:

    How to align Material buttons with other UI elements

    这种小部件设计确实限制了布局构建选项该指南将触摸目标描述为应影响窗口小部件的外部附加触摸区域 . 它应该这样做:

    • 用半径为2dp的圆形矩形覆盖默认背景

    • 将minHeight设置为36dp

    • 使用setTouchDelegate更改触摸目标

    • 或覆盖getHitRect以更改触摸目标

    看到:

    https://developer.android.com/reference/android/view/TouchDelegate.html

    https://developer.android.com/reference/android/view/View.html#getHitRect(android.graphics.Rect)

  • 1

    材料设计是一个设计规范,因此,谈论很多关于“什么”,而不是很多关于“如何” . 触摸目标大小基于多年来发现的小部件的最小尺寸,以便与普通人的手指轻松地进行交互 . 如果您坚持使用Google定义的主题和样式(例如AppCompat主题),那么您应该没问题 . 如果您使用的是完全自定义的主题(我个人建议您不要这样做),那么您必须使用48Wp的minWidth和/或minHeight来设置小部件的样式 .

相关问题