百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

Material Design 基础 - Applying density

cac55 2024-10-26 08:11 21 浏览 0 评论

前言

Material设计为提高密度改善用户体验的用例提供高密度间距指导。

用法

这些指南描述了如何以及何时应用密度。

原则

可扫描

密集的UI提高了查看和浏览大量内容的便利性。

优先考虑

密集的UI通过减少操作之间的空间来帮助用户集中精力。

可见的

增加密度可以在单个屏幕上容纳更多内容和动作。

组件密度指南

怎样使用组件密度

Material密度指南是了解何时以及为什么应用密度可以改善用户体验的资源。在代码的支持下,Material组件密度可以在刻度上进行一致调整。
组件密度中解释了使用密度标度的指导,平台支持可在组件密度实施指南中找到。

何时使用组件密度

用户与组件的交互方式应决定是否增加UI中的密度。当用户查看和交互大量信息时,高密度组件可以改善体验。
通过在屏幕上提供更多内容,增加列表、表格和长表单的密度,使信息更易于扫描、查看和比较。

何时不应该使用组件密度

任务和基于警报的组件不应增加密度。

重点任务

不要增加涉及重点任务的组件的密度,例如与下拉菜单或选择器交互。增加日期选择器等组件的密度会限制可点击空间,从而降低可用性。

警报和消息

不要增加Alert或消息组件的密度,例如snackbar或对话框。增加警报的密度会降低它们吸引用户注意力的效率。在对话框的例子中,当密度增加时,消息的可读性和突出性会受到影响。

布局

网格和组件密度

保持组件密度和网格布局之间的平衡。
要创建可扫描的内容组,请结合使用密度较低的网格布局和高密度组件。组件的密度越大,边距和边沟宽度就应该越大。将密集的布局网格与密集的组件相结合,可以让用户更难区分内容组。

将密度应用于组件

不应单独调整组件密度。相反,要始终如一地应用密度,以创建一个内聚组件集。当你调整一个组件的密度时,考虑一下这一变化将如何影响应用程序中的其他组件。
下面的工具演示了材质组件随三种密度设置(默认、舒适和紧凑)的变化。

密度标尺

密度比例允许您在需要时控制单个组件的密度。
“密度比例”已编号,从组件的默认密度0开始。随着空间的减少,比例会移到负数(-1,-2,-3),从而产生更高的密度。每个增量表示组件高度减少4dps。

不要从“密度比例”中选择破坏组件的数字。

间距法

当组件的密度增加时,填充和对齐保持一致,但尺寸会发生变化。增加时不要更改组件的填充.

  • padding
    增加密度时,不要改变组件的填充。组件填充会影响高度,减少填充会对用户交互产生负面影响。
  • Dimensions
    增加零部件密度时更改尺寸。构件尺寸会影响构件或图元的长度和高度。
  • Alignment

使用中心规格来对齐零部件容器中的图元。中心对齐元件允许在不需要额外对齐元件的情况下调整元件高度

分隔多个元素

当多个元素在一个组件内垂直堆叠时,使用4dp增量将它们分开。将已分组的元素置于组件容器的中心。

可达性

触摸目标适用于接收触摸和非触摸输入的任何设备。为了平衡信息密度和可用性,默认密度组件的触摸目标应至少为48 x 48 dp,每个目标之间至少有8 dp的空间。注意:在iOS上,44 x 44 dp是建议的触摸目标。

排版

线条高度

行高是文本行之间的间距。线条高度可以作为在排版布局中创建密度的一种方式。

Material Design 系列文章

最新更新以及更多Material Design相关文章请访问 鹏叔的技术博客空间-Material Design

相关推荐

Mac电脑强制删除任何软件方法-含自启动应用

对于打工者来说,进入企业上班使用的电脑大概率是会被监控起来,比如各种流行的数据防泄漏DLP,奇安信天擎,甚至360安全卫士,这些安全软件你想卸载是非常困难的,甚至卸载后它自己又安装回来了,并且还在你不...

Linux基础知识 | 文件与目录大全讲解

1.linux文件权限与目录配置1.文件属性Linux一般将文件可存取的身份分为三个类别,分别是owner/group/others,且三种身份各read/write/execute等权限文...

文件保护不妥协:2025 年 10 款顶级加密工具推荐

数据安全无小事,2025年这10款加密工具凭借独特功能脱颖而出,从个人到企业场景全覆盖,第一款为Ping32,其余为国外英文软件。1.Ping32企业级加密核心工具,支持200+文件格...

省心省力 一个软件搞定系统维护_省心安装在哪里能找到

◆系统类似于我们居住的房间,需要经常打理才能保持清洁、高效。虽然它本身也自带一些清理和优化的工具,但借助于好用的第三方工具来执行这方面的任务,会更让人省心省力。下面笔者就为大家介绍一款集多项功能于一身...

JAVA程序员常用的几个工具类_java程序员一般用什么软件写程序

好的工具做起事来常常事半功倍,下面介绍几个开发中常用到的工具类,收藏一下,也许后面真的会用到。字符串处理:org.apache.commons.lang.StringUtilsisBlank(Char...

手工解决Windows10的若干难题_windows10系统卡顿怎么解决

【电脑报在线】很多朋友已经开始使用Win10,估计还只是测试版本的原因,使用过程中难免会出现一些问题,这里介绍解决一些解决难题的技巧。技巧1:让ProjectSpartan“重归正途”从10074...

System32文件夹千万不能删除,看完这篇你就知道为什么了

C:\Windows\System32目录是Windows操作系统的关键部分,重要的系统文件存储在该目录中。网上的一些恶作剧者可能会告诉你删除它,但你不应该尝试去操作,如果你尝试的话,我们会告诉你会发...

Windows.old 文件夹:系统备份的解析与安全删除指南

Windows.old是Windows系统升级(如Win10升Win11)或重装时,系统自动在C盘创建的备份文件夹,其核心作用是保留旧系统的文件、程序与配置,为“回退旧系统”提供保...

遇到疑难杂症?Windows 10回收站问题巧解决

回收站是Windows10的一个重要组件。然而,我们在使用过程中,可能会遇到一些问题。例如,不论回收站里有没有文件,都显示同一个图标,让人无法判别回收站的空和满的真实情况;没有了像Windows7...

卸载软件怎么彻底删掉?简单几个步骤彻底卸载,电脑小白看过来

日常工作学习生活中,我们需要在安装一些软件程序,但随着软件的更新迭代速度,很多时候我们需要重新下载安装新的程序,这时就需要将旧的一些软件程序进行卸载。但是卸载软件虽然很简单,但是很多小伙伴们表示卸载不...

用不上就删!如何完全卸载OneDrive?

作为Windows10自带的云盘,OneDrive为资料的自动备份和同步提供了方便。然而,从隐私或其他方面考虑,有些人不愿意使用OneDrive。但Windows10本身不提供直接卸载OneDri...

【Linux知识】Linux下快速删除大量文件/文件夹方法

在Linux下,如果需要快速删除大量文件或文件夹,可以使用如下方法:使用rm命令删除文件:可以使用rm命令删除文件,例如:rm-rf/path/to/directory/*这个命令会递...

清理系统不用第三方工具_清理系统垃圾用什么软件

清理优化系统一定要借助于优化工具吗?其实,手动优化系统也没有那么神秘,掌握了方法和技巧,系统清理也是一件简单和随心的事。一方面要为每一个可能产生累赘的文件找到清理的方法,另一方面要寻找能够提高工作效率...

系统小技巧:软件卸载不了?这里办法多

在正常情况下,我们都是通过软件程序组中的卸载图标,或利用控制面板中的“程序和功能”模块来卸载软件的。但有时,我们也会发现利用卸载图标无法卸载软件或者卸载图标干脆丢失找不到了,甚至控制面板中卸载软件的功...

麒麟系统无法删除文件夹_麒麟系统删除文件权限不够

删除文件夹方法例:sudorm-rf文件夹名称。删除文件方法例:sudorm-r文件名包括扩展名。如果没有权限,给文件夹加一下权限再删。加最高权限chmod775文件名加可执行权限...

取消回复欢迎 发表评论: