Android学习|组件 —— ToolBar工具栏

正常下，显示界面上方会有一个标题界面（Frist Demo那部分）。

在values-themes.xml中将style name=“Theme,FirstDemo"的parent设置为为"Theme.MaterialComponents.DayNight.NoActionBar”。

（默认为DarkActionBar）

设置后，上方框不见，可进行自定义设置

常见属性

1、android:layout_width=“match_parent” ：宽度

2、android:layout_height="?attr/actionBarSize" ：设置成跟actionBar一样高度

3、android:background="#ffffoo"

4、app:navigationlcon="@drawable/ic_baseline_arrow_back_24" ：添加返回箭头

5、app:title=“主标题”

6、app:titleTextColor="#ff0O00" ：标题颜色

7、app:titleMarginStart=“90dp” ： 标题距离左边间距


8、app:subtitle=“子标题”
9、app:subtitleTextColor="#00ffff"


10、app:logo="@mipmap/ic_launcher" 设置logo

一、简单Demo–XML中进行相关属性设置

<?xml version="1.0" encoding="utf-8"?>

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

<!--xml中进行相关属性设置-->
    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="#BA56B48A"

        app:navigationIcon="@drawable/ic_baseline_keyboard_backspace_24"

        app:title="主标题"
        app:titleTextColor="#ff001188"
        app:titleMarginStart="80dp"

        app:subtitle="副标题"
        app:subtitleTextColor="#ff665500"

        app:logo="@drawable/ic_baseline_backup_24" >
    </androidx.appcompat.widget.Toolbar>


</LinearLayout>

java中设置返回图标点击事件

        Toolbar toolBar = findViewById(R.id.toolbar);
        toolBar.setNavigationOnClickListener(new View.OnClickListener() {  //click action
           @Override
            public void onClick(View view) {
               Log.e("leo","Click ToolBar ");
            }
        });        

效果如下：点击进行log打印

二、Java中进行属性设置

以下为定义的Toolbar控件

<?xml version="1.0" encoding="utf-8"?>

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

<!--java中进行相关属性设置-->
    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar2"
        android:layout_marginTop="15dp"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="#80ADDA"
        >
    </androidx.appcompat.widget.Toolbar>

</LinearLayout>

java中进行toolbar的属性设置

//java设置相关toolar的属性
        Toolbar toolBar2 = findViewById(R.id.toolbar2);

        toolBar2.setNavigationIcon(R.drawable.ic_baseline_backup_24);
        toolBar2.setTitle("java 主标题 ");
        toolBar2.setSubtitle("java  副标题");
        toolBar2.setNavigationIcon(R.drawable.ic_baseline_keyboard_backspace_24);  //返回箭头

        toolBar2.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Log.e("leo"," java 设置的ToolBar的click事件 ");
            }
        });

三、设置文字居中

思想是不设置toolbar的title，而是内嵌一个TextView，TextView设置为居中实现

<!--设置文字居中-->
    <androidx.appcompat.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:layout_marginTop="15dp"
        android:background="#B6CADF"
        app:navigationIcon="@drawable/ic_baseline_keyboard_backspace_24">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="标题"
            android:textSize="35dp" />

    </androidx.appcompat.widget.Toolbar>