- MaterialButton
- MaterialButtonToggleGroup
- TextView
- ImageView
一.MaterialButton
materialButton是谷歌SDK28推出的新控件,可以很轻易的实现各种button的样式.
1.依赖引入
引入到app/build.gradle文件下
implementation: ‘com.google.android.material:material:1.3.0’
修改主题 app/src/main/AndroidManifest.xml
android:theme=“@style/Theme.MaterialComponents. Light.NoActionBar”
2.继承关系
MaterialButton继承自AppCompatButton,所以它拥有AppCompatButton所有特性,且在其基础上做了一些扩展,如圆角,描边,前置和后置icon,还支持按压水纹且自定义颜色.
| 属性 | 描述 | 参数 |
|---|---|---|
| app:backgrountTint | 背景着色 | |
| app:backgroundTintMode | 着色模式 | add,multiply,screen,src_atop,src_in,src_over |
| app:storkColor | 描边颜色 | |
| app:strokeWidth | 描边宽度 | |
| app:cornerRadius | 圆角大小 | |
| app:rippleColor | 按压水波纹颜色 | |
| app:icon | 图标icon | |
| app:iconSize | 图标大小 | |
| app:iconGravity | 图标重心 | start,end,textStart,textEnd |
| app:iconTint | 图标着色 | |
| app:iconTintMode | 图标着色模式 | add,multiply,screen,src_atop,src_in,src_over |
| app:iconPadding | 图标和文本之间的间距 |
二.MaterialButtonToggleGroup
可以用来单选tabbar分类样式.类似一个LinearLayout,但是只能添加MaterialButton,只有第一个子元素的最左边角和最后一个子元素的最右边角才能保留它们的形状外观圆角大小
| 属性 | 描述 | 参数 |
|---|---|---|
| app:checkedButton | 默认选中 | 按钮ID |
| app:singleSelection | 是否单项选择 | true/false |
| app:selectionRequired | 设置为true后,强制至少选中一个 | true/false |
三.TextView
| 常见属性 | 描述 | 参数 |
|---|---|---|
| id | @+id/tv | |
| layout_width | 组件宽 | |
| layout_height | 组件高 | |
| text | 文本内容 | |
| background | 背景颜色 | |
| textColor | 文字颜色 | |
| textStyle | 字体样式 | |
| textSize | 字体大小 | |
| gravity | center/center_horizontal/center_vertical | 内容的对齐方向 |
| drawableTop | @drawable/icon | |
| drawablePadding | ||
| drawableTint | 图片着色 | |
| ellipsize | end,middle,marquee,start | 文字超出时的截断方式 |
| singleLine | true/false | 单行显示 |
| padding各种 | 内间距 | |
| marging各种 | 外间距 |
示例:
四.ImageView
常见属性
| 常见属性 | 描述 | 参数 |
|---|---|---|
| android:src | @drawable/icon_home | 给ImageView设置要现实的图片 |
| android:alpha | 0.5 [0.0~1.0] | 设置透明度 |
| android:background | @drawable/background | 给ImageView设置背景色,背景图片 |
| android:scaleType | 用于设置图片如何缩放以适应ImageView的大小 |
ScaleType
- center:保持原图的大小,显示在ImageView的中心.当原图的长大于ImageView的长,超过部分裁剪处理.
- centerCrop:以填满整个ImageView为目的,将原图的中心对准ImageView的中心,等比例放大原图,直到填满ImageView为止,原图超过ImageView的部分作为裁剪处理.
- centerInside:以原图完全显示为目的,将图片的内容完整居中显示,通过按比例缩小原图的长/宽或小与ImageView的长/宽.如果原图的长宽小于ImageView的长宽,则原图不作任何处理,居中显示在ImageView的中心.
- fitCenter:把原图按照比例扩大或缩小到ImageView的高度,居中现实.
- fitEnd:把原图按比例扩大或缩小到ImageeView的高度,显示在ImageView的下部分位置.
- fitStart:把原图按照比例放大或缩小到ImageView的高度,显示在ImageView的上部分位置.
- fitXY:把原图按照指定的大小在view现实,拉伸显示图片,不保持原比例,填满ImageView.
- matrix:不改变原图的大小,从ImageVieew的左上角开始绘制原图,原图超过ImageView的部分作裁剪处理.
