推荐开发者使用 Material Design 组件

2022-03-09 15:20:26 浏览数 (1)

为了保证您的应用与用户设备中安装的其他应用在视觉和行为上保持一致,我们 推荐 您遵循 Material Design 规范,因为用户从一个应用中学习的操作模式可以无缝衔接地在另一个应用中使用。

Android 用户希望您的应用在视觉和行为上与系统保持一致。您在设计视觉和导航模式时应该遵循 Material Design 规范… —— d.android.com/design

您可以使用 Material Design Components (MDC) 组件库来 实现 这一目的。本文将列出使用 MDC 的优势,从而说明我们推荐使用它的原因。

组件

MDC 提供了系统标准组件的 Material 版本,例如 Buttons、Toolbars、CheckBox 等等,使用这些组件能轻松实现 Material 风格。如果您使用了 MaterialComponents 主题,当您 inflate 一个 layout (通过 MDC 的 View Inflater) 时,被实例化是 Material 组件而不是标准组件,因此您不需要对布局进行重大的更新就能轻松实现 Material 风格。

代码语言:javascript复制
<!-- Copyright 2019 Google LLC.
   SPDX-License-Identifier: Apache-2.0 -->

<!--  标准组件 Button 将会被替换为 MaterialButton -->
<Button ... />

<!-- 您甚至可以使用 MaterialButton 特定的属性 -->
<Button ...
  app:icon="@drawable/foo"/>

<!--如果您想用具有向后兼容能力的 AppCompatButton 而不是 MaterialButton,您可以这样做 -->
<androidx.appcompat.widget.AppCompatButton ... />

所有 Material 组件都继承自对应的 AppCompat 组件,因此它们享有相同的向后兼容能力和新版本的 bug 修复。

Material 组件在对应的系统标准组件和 AppCompat 组件的基础上拓展出更多样式和功能,例如 MaterialButton 拥有以下多种样式:

代码语言:javascript复制
<!-- Copyright 2019 Google LLC.  
   SPDX-License-Identifier: Apache-2.0 -->

<!-- Contained button -->
<Button ... 
  style="?attr/materialButtonStyle"/>

<!-- Text button -->
<Button ... 
  style="?attr/borderlessButtonStyle"/>

<!-- Outlined button -->
<Button ... 
  style="?attr/materialButtonOutlinedStyle"/>

我最喜欢的功能之一是使用 MaterialTextView 替换 TextView,它 新增的功能 可以很方便地在 TextAppearance 中设置行高。

除了拓展现有组件的功能外,MDC 还提供了一系列全新的组件。您可能知道 Bottom Navigation、Bottom Sheet 和 Floating Action Button,但未必听说过 Chips、Date Picker 和 Time Picker。

MDC 提供的全部组件列单,请查阅 —— 组件。

Material 主题

https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/20ecc840d10541fd8a49c5d358d7340c~tplv-k3u1fbpfcp-zoom-1.image

Material 主题 可以更系统地 自定义 Material Design 样式来体现您的产品品牌。Material 主题包括 颜色、字体样式 和 形状 属性。对其进行自定义将自动应用到您用于构建应用的组件上。

您可以将 Material 主题理解为创建设计系统的设计系统

0 人点赞