再不迁移到Material Design Components 就out啦 (2)

从 Design 库到 MDC ,样式变成 Theme.MaterialComponents.* 后有了一些变化。拿 Button 来举例,Button失去了自定义背景。现在 Button 有了一个绿色的强调色并且字体间的间距变大了。

再不迁移到Material Design Components 就out啦

那么为什么会这样呢?我们先来看一下布局

<Button android:id="@+id/containedButton" // 这是自定义的某种颜色的背景 android:background="@drawable/bg_button_gradient" android:textColor="@android:color/white" ... /> <Button android:id="@+id/textButton" style=”?attr/borderlessButtonStyle” ... />

之所以出现这种情况是因为,在填充布局的时候,会自动将我们布局中的普通控件替换成 MDC 控件。

和 AppCompat 一样,MDC 会在填充的时候用 MDC 等效的控件来替换某些原始控件。这样就可以发布新功能和错误修正了,而不必将所有声明都换成新的类型。这是通过 MaterialComponentsViewInflater 来完成的,它属于 AppCompatViewInflater 的子类。

映射关系:

Framework widget AppCompat widget (replaced by AppCompatViewInflater) MDC-Android widget (replaced by MaterialComponentsViewInflater)
Button   AppCompatButton   MaterialButton  
CheckBox   AppCompatCheckBox   MaterialCheckBox  
RadioButton   AppCompatRadioButton   MaterialRadioButton  
TextView   AppCompatTextView   MaterialTextView  
AutoCompleteTextView   AppCompatAutoCompleteTextView   MaterialAutoCompleteTextView  

注意: 在 MDC 1.0.0 中只有 Button 控件被替换了。

我们例子中如果是 Theme.AppCompat.* 的主题,那么就会把 Button 用 AppCompatButton 来替换。现在把主题修改成 Theme.MaterialComponents.* ,那么就会把 Button 替换成 MaterialButton ,会有默认的 style

和 AppCompatButton 不同的是 MaterialButton 不支持自定义背景。到 1.2.0-alpha06 版本开始支持。使用 Shape 可以进行变通。下面章节会详细介绍。

更新到 MDC 1.1.0

从 1.0.0 到 1.1.0 有了很多新变化:

完整的 Material Theming

Dark Theme 支持

Android 10 手势导航支持

新组件:扩展 FAB、date picker、badges、toggle buttons

无障碍功能提升、bug 修复等等

implementation ‘com.google.android.material:material:1.1.0’

一些出乎意料的改变和普通问题

MDC 1.1.0更改了一些默认的小部件样式,以更好地符合“材料设计”准则。但是,升级后,您可能会注意到某些控件颜色和其他属性的某些意外更改。

再不迁移到Material Design Components 就out啦

在上面的示例中,按钮发生了变化、文本和图标的颜色发生了变化。FAB 现在变成了蓝绿色,并且文本字段看起来完全不同。不用担心。我们的当前主题中可能是丢失了一些重要的 MDC 属性,同时有一些重要的 AppCompat 或者原有属性(android:xxx)不再需要。下面我们通过一些常见的迁移方案来了解一下这些问题

文字栏位改变

在 MDC 中,文字字段默认样式发生了改变。改进版本是经过用户调查研究的。

再不迁移到Material Design Components 就out啦

我们建议您使用这个版本,来提高可用性和可配置项性。但是我们意识到这可能并不适合您的品牌和设计系统。

要恢复为旧的文本字段可以在布局中添加样式

<com.google.android.material.textfield.TextInputLayout ... +> ... </com.google.android.material.textfield.TextInputLayout>

或者你也可以在主题中给所有的文本设置默认样式

<style parent="Theme.MaterialComponents.*"> ... + <item name=”textInputStyle”>@style/Widget.App.TextInputLayout</item> </style> +<style name=”Widget.App.TextInputLayout” parent=”Widget.Design.TextInputLayout”> + <!-- Custom attrs --> +</style>

再不迁移到Material Design Components 就out啦


再不迁移到Material Design Components 就out啦

更喜爱 MDC 样式和控件

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zypxxp.html