【Android Studio】 ToolBar

其无知

已于 2024-07-29 09:24:50 修改

阅读量2.6k

点赞数

分类专栏： Android Studio 文章标签： android studio android android-studio

于 2022-01-28 09:35:51 首次发布

本文链接：https://blog.csdn.net/weixin_53724285/article/details/122720714

版权

Android Studio 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

这篇博客详细介绍了如何在Android Studio中添加和配置ToolBar，包括设置导航图标、标题、颜色、距离以及子标题，并提供了XML和JAVA代码示例，展示了不同状态下的ToolBar效果。

摘要由CSDN通过智能技术生成

一种新的导航栏

方法：

app:navigationIcon="@drawable/icon" 左边返回图标

app:title="Title" 标题

app:titleTextColor="@color/black" 标题颜色

app:titleMarginStart="90dp" 标题离左边的距离

app:subtitle="子标题" 子标题

app:subtitleTextColor="@color/white" 子标题颜色

app:logo="@mipmap/ic_launcher" logo，位于标题左，返回图标右

一、加入图片

在drawable目录中加入图片

二、添加第一个ToolBar

XML:

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/tb"
        android:background="@color/teal_700"
        app:navigationIcon="@drawable/icon101"
        app:title="Title"
        app:titleTextColor="@color/purple_200"
        app:titleMarginStart="90dp"
        app:subtitle="子标题"
        app:subtitleTextColor="@color/white"
        app:logo="@mipmap/ic_launcher"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"/>

<!-- layout_height是根据图片的大小调整导航栏的高度，使图片位置居中
     navigationIcon是左边的时钟，可以设置为“<”作为返回上一页 -->

JAVA:

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        //返回按钮监听事件
        Toolbar toolbar = findViewById(R.id.tb);
        toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Log.e("Kyo", "onClick: toolbar被点击了" );
            }
        });

}

效果图：

被点击时：

点击时钟才有此提醒

三、添加第二个ToolBar

XML:

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/tb2"
        android:layout_marginTop="5dp"
        android:background="#ffff00"
        app:navigationIcon="@drawable/apple"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"/>

JAVA:

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Toolbar toolbar2 = findViewById(R.id.tb2);
        toolbar2.setNavigationIcon(R.drawable.apple);
        toolbar2.setTitle("标题");
        toolbar2.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Log.e("Kyo", "onClick: toolbar2被点击了" );
            }
        });

   }
}

效果图：

被点击时：

同理点击苹果才有反应

四、添加第三个ToolBar

    <androidx.appcompat.widget.Toolbar
        android:layout_marginTop="5dp"
        app:navigationIcon="@drawable/apple"
        android:background="#ffff00"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize">

        <TextView
            android:text="标题"
            android:gravity="center"
            android:layout_gravity="center"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
    </androidx.appcompat.widget.Toolbar>

效果图：