Android Material Design之MaterialButton(一)

1. 按规矩先上效果图
   
2. 资源引入

implementation 'com.google.android.material:material:1.4.0'
1

3. 关键属性

• 注意事项

• 设置按钮背景 使用app:backgroundTint

• 细心的老哥肯定发现Button 普通按钮 与MaterialButton 效果一样,这是因为在AndroidManifest.xml中application标签设置了theme属性

<application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.MaterialDesignerDemo"
        tools:targetApi="31">


<style name="Theme.MaterialDesignerDemo" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        
        "colorPrimary">@color/purple_500
        "colorPrimaryVariant">@color/purple_700
        "colorOnPrimary">@color/white
        
        "colorSecondary">@color/teal_200
        "colorSecondaryVariant">@color/teal_700
        "colorOnSecondary">@color/black
        
        "android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant
        
    style>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

4. 为什么使用MaterialButton ?
   因为它可以帮助我们减少drawable文件

5. 上布局文件源代码

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <androidx.appcompat.widget.AppCompatButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="AppCompatButton 普通按钮" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="Button 普通按钮" />

    <com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="MaterialButton 扁平按钮" />

    <com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="MaterialButton 前置icon"
        app:icon="@drawable/ic_launcher_foreground"
        app:iconSize="20dp" />

    <com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="MaterialButton 前置icon"
        app:icon="@drawable/ic_launcher_foreground"
        app:iconGravity="textEnd"
        app:iconSize="20dp" />

    <com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="MaterialButton 描边扁平按钮"
        app:strokeColor="@color/black"
        app:strokeWidth="5dp"/>
LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52