Android Toolbar的使用详解
修改主题当我们新建一个工程时,我们发现默认是有导航栏的, 如图:那是因为默认app主题自带了导航栏我们发现,系统自带的是一个xxxActionBar,那么我们应该禁用掉 ActionBar方法一注意 要选择 xxxNoActionBar 也就是无导航栏的样式以上主题任意选择一个即可。方法二你也可以在 res/style.xml 中配置 NoActionBar 主题样式 (全局可用)<?xml
文章目录
修改主题
当我们新建一个工程时,我们发现默认是有导航栏的, 如图:
那是因为默认app主题自带了导航栏
我们发现,系统自带的是一个xxxActionBar,那么我们应该禁用掉 ActionBar
方法一
注意 要选择 xxxNoActionBar 也就是无导航栏的样式
以上主题任意选择一个即可。
方法二
你也可以在 res/style.xml 中配置 NoActionBar 主题样式 (全局可用)
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/purple_500</item>
<item name="colorPrimaryDark">@color/black</item>
<item name="colorAccent">@color/teal_700</item>
</style>
</resources>
使用这种方式需要在 AndroidManifest.xml 中的对应的 activity 节点中设置 theme 属性
或者 在
现在开始添加一个ToolBar
布局中添加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">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
添加Toolbar具体内容
// 设置Logo
toolbar.setLogo(R.mipmap.ic_launcher);
// 主标题
toolbar.setTitle("主标题");
// 副标题
toolbar.setSubtitle("副标题");
// 设置导航图标
toolbar.setNavigationIcon(R.drawable.ab_android);
....
Toolbar常用属性
添加菜单
请先在项目的 res/menu/ 目录中创建新的 XML 文件。
接下来是菜单的初始化
方法一
通过inflateMenu可以添加toolbar的菜单
//设置菜单
toolbar.inflateMenu(R.menu.menu_main);
注意: 要想让Toolbar本身的inflateMenu生效,则必须删去这两句代码!!!
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
方法二
调用Activity本身创建menu的接口
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return super.onCreateOptionsMenu(menu);
}
监听菜单项
使用 inflateMenu 方法的
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem menuItem) {
String msg = "";
switch (menuItem.getItemId()) {
case R.id.action_edit:
msg += "点击标签";
break;
case R.id.action_share:
msg += "点击分享";
break;
case R.id.action_new:
msg += "点击新建";
break;
case R.id.action_settings:
msg += "点击退出";
break;
}
if (!msg.equals("")) {
Toast.makeText(MainActivity.this, msg, Toast.LENGTH_SHORT).show();
}
return true;
}
});
调用Activity本身创建menu的接口
@Override
public boolean onOptionsItemSelected(@NonNull MenuItem item) {
int id = item.getItemId();
switch (id) {
case R.id.menu_app:
Toast.makeText(MainActivity.this, "单击了应用程序菜单", Toast.LENGTH_SHORT).show();
break;
case R.id.calendar:
Toast.makeText(MainActivity.this, "单击了日历", Toast.LENGTH_SHORT).show();
break;
case R.id.paint:
Toast.makeText(MainActivity.this, "单击了画图", Toast.LENGTH_SHORT).show();
break;
case R.id.pictures:
Toast.makeText(MainActivity.this, "单击了图片", Toast.LENGTH_SHORT).show();
break;
}
return super.onOptionsItemSelected(item);
}
完整代码
activity_main.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">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
menu_main.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_edit"
android:icon="@drawable/ab_edit"
android:orderInCategory="80"
android:title="@string/action_edit"
app:showAsAction="ifRoom|withText" />
<item
android:id="@+id/action_share"
android:icon="@drawable/regular_share"
android:orderInCategory="80"
android:title="@string/action_share"
app:showAsAction="ifRoom|withText" />
<item
android:id="@+id/action_new"
android:icon="@drawable/ab_new"
android:orderInCategory="80"
android:title="@string/action_new"
app:showAsAction="ifRoom|withText" />
<item
android:id="@+id/action_settings"
android:icon="@drawable/setting"
android:orderInCategory="80"
android:title="@string/action_setting"
app:showAsAction="ifRoom|withText" />
</menu>
上面代码中组件的添加和Menu绘制的方法类似,唯一的区别就是app:showAsAction值的不同,而该属性正是 Toolbar关键所在。 app:showAsAction 属性共有 4个值,分别如下。
1)always:这个值会使菜单项一直显示在 ToolBar上。
2)ifRoom:如果有足够的空间,这个值会使菜单项显示在 Tool Bar上。
3)never:这个值会使菜单项永远都不出现在 ToolBar上。
4)withText:这个值会使菜单项和它的图标、菜单文本一起显示。一般和ifRoom一起通过“|”使用
app:showAsAction 属性值为 ifRoom|withText,表示如果有空间,那么就连同文字一起显示在标题栏中,否则就显示在菜单栏中。
而当app:showAsAction 属性值为 never时,该项作用为Menu不显示在菜单组件中。
MainActivity
package com.example.toolbar;
import android.os.Bundle;
import android.view.MenuItem;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.Toolbar;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = findViewById(R.id.toolbar);
//设置Logo
toolbar.setLogo(R.mipmap.ic_launcher);
//主标题
toolbar.setTitle("主标题");
//副标题
toolbar.setSubtitle("副标题");
//设置导航图标
toolbar.setNavigationIcon(R.drawable.ab_android);
//添加菜单
toolbar.inflateMenu(R.menu.menu_main);
//监听菜单项
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem menuItem) {
String msg = "";
switch (menuItem.getItemId()) {
case R.id.action_edit:
msg += "点击标签";
break;
case R.id.action_share:
msg += "点击分享";
break;
case R.id.action_new:
msg += "点击新建";
break;
case R.id.action_settings:
msg += "点击退出";
break;
}
if (!msg.equals("")) {
Toast.makeText(MainActivity.this, msg, Toast.LENGTH_SHORT).show();
}
return true;
}
});
}
}
开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!
更多推荐
所有评论(0)