记录material design组件的学习笔记
快速查找：WIN+F
style:主题样式：Widget.MaterialComponents.xxx
使用前
- 配置build.gradle
api 'com.google.android.material:material:1.1.0-alpha06'
目录
- Tablayout ：结合viewpager使用（常用，网上教程多，不做介绍）
- TextInputLayout+TextInputEditText:二者结合起来用，可代替EditText
- MaterialButton 可代替button
使用方法
TextInputLayout+TextInputEditText：
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="4dp"
android:hint="@string/shr_hint_username">
<com.google.android.material.textfield.TextInputEditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text"
android:maxLines="1" />
</com.google.android.material.textfield.TextInputLayout>
| TextInputLayout (xml属性) | 值 | 作用 |
|---|---|---|
| app:boxBackgroundColor: | color | 更改填充文本字段的背景颜色 |
| boxCornerRadiusTopStart | dp | 角半径 |
| boxCornerRadiusTopEnd | ||
| boxCornerRadiusBottomStart | ||
| boxCornerRadiusBottomEnd | ||
| app:endIconMode | 枚举 | 结束图标模式 |
| TextInputLayout (java方法) | 值 | 作用 |
|---|---|---|
| setError("") | String | 输出错误信息 |
- 选中状态颜色：由Theme的colorPrimary决定
- 文字颜色：由Theme的android:textColorPrimary决定
- 样式style：
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"，紧凑型，上
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"标准型，下
style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox",标准型上
style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.Dense"，紧凑型下
剩余的自己看文档
MeterialButton
<com.google.android.material.button.MaterialButton
android:id="@+id/next_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:text="@string/shr_button_next" />
默认按钮
style="@style/Widget.MaterialComponents.Button.OutlinedButton" 左边
style="@style/Widget.MaterialComponents.Button.TextButton"右边
| MeterialButton | 值 | 作用 |
|---|---|---|
| app:rippleColor | color | 水波纹颜色 |
| app:cornerRadius | dp | 按钮圆角半径 |
| app:icon | source | 按钮图标 |
| app:iconPadding | dp | 图标与文字的间距 |
| app:iconGravity | 枚举 | 设置图标的位置 |
- 不设置水波纹颜色默认使用colorPrimary颜色，透明度50%
- 图标颜色，大小可设置，自己去看文档
剩余自己看文档：看xml属性（小技巧：在页面上搜索Related XML Attributes，能看到所有xml属性）
