首页 > 编程知识 正文

android toolbar,android 四大组件

时间:2023-05-05 07:35:07 阅读:119667 作者:49

Toobar和ActionBar

从Android3.0(APIlevel11 )开始,所有使用默认主题的activity都附带一个ActionBar,但Android版本的重复会增加ActionBar的特性,导致不同的Android版本

从Android5.0(APIlevel21 )开始引入了Toolbar。 Toolbar包含ActionBar最近添加的大多数功能,也添加到支持库中,因此低版本的设备也可以使用Toolbar。

Toolbar和ActionBar的区别:

ToolBar是视图,与其他视图一样包含在布局中。

与常规视图一样,Toolbar可以轻松地放置、实现和控制动画。

一个活动可以包含多个Toolbar。

工具栏很容易使用

将v7 appcompat支持库添加到APP应用程序的build.gradle中。

com.Android.support : app compat-v 7:24.1.1

从AppCompatActivity继承活动。

publicclassmyactivityextendsappcompatactivity {

//.

}

在AndroidManifest.xml文件中,将元素配置为使用appcompat的NoActionBar主题,而不使用ActionBar来提供操作栏。

安卓: theme=' @ style/theme.app compat.light.noactionbar ' /

将工具栏添加到活动布局中。

android:id='@ id/my_toolbar '

Android : layout _ width=' match _ parent '

android:layout_height='? attr/actionBarSize '

安卓:后台='? attr/colorPrimary '

android:elevation='4dp '

Android : theme=' @ style/theme overlay.app compat.actionbar '

app : popup theme=' @ style/theme overlay.app compat.light ' /

调用activity的onCreate (在方法中,setSupportActionBar )方法传递给toolbar,并将toolbar设置为activity的操作栏。

@Override

protectedvoidoncreate (边界维护实例state )。

super.oncreate (savedinstancestate;

setcontentview (r.layout.activity _ my;

toolbartoolbar=(toolbar ) findviewbyid ) r.id.my_toolbar;

setsupportactionbar (工具栏;

}

运行后,效果图如下所示。

Toolbar很容易使用. png

现在,activity有基本的操作栏。 使用检索到的对toolbar的引用,可以通过调用相关的API来执行更多操作,例如隐藏和显示操作栏。

Toolbar元素

在上效果图中,只列出了APP的名称,但Toolbar可以包含以下元素:

导航按钮

应用徽标

标题和副标题

几个自定义视图

动作菜单

是的,接下来让它们全部显示出来。

显示导航按钮、应用的徽标、标题和副标题。

//显示APP徽标

getSupportActionBar ().setdisplayshowhomeenabled(true );

getSupportActionBar ().setdisplayuselogoenabled (true );

getSupportActionBar ().setlogo ).mipmap.IC_launcher );

//显示标题和副标题

getSupportActionBar ().setdisplayshowtitleenabled (true );

toolbar.settitle(toolbardemo );

toolbar.set subtitle (thedetailoftoolbar );

//显示导航按钮

toolbar.setNavigat

ionIcon(R.drawable.icon_back);

显示动作菜单。

首先在res/menu目录下的xml文件中定义的,要添加几个动作,则在

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto">

android:id="@+id/toolbar_action1"

android:icon="@drawable/icon_weibo_timeline_mine"

android:title="Action"

app:showAsAction="always"/>

android:id="@+id/toolbar_action1"

android:icon="@drawable/icon_weibo_timeline_mine"

android:title="Action"

app:showAsAction="never"/>

item的icon和title属性顾名思义,而app:showAsAction属性则是用来指定这个动作是放置在操作栏上,还是溢出菜单中。当它的值设置为”ifRomom”时,如果操作栏有空间放置,则放置在操作栏上,否则放置到溢出菜单中。当它的值设置为”always”,这个动作将总是放置在操作栏上。当它的值设置为”never”,这个动作将总是放置在溢出菜单中。

之后重写activity的onCreateOptionsMenu()方法,设置显示的menu资源:

@Override

public boolean onCreateOptionsMenu(Menu menu) {

getMenuInflater().inflate(R.menu.menu_toolbar_demo, menu);

return true;

}

当点击了按钮,可以通过重写activity的onOptionsItemSelected()方法来进行处理:

@Override

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case R.id.toolbar_action1:

// do something

return true;

default:

// If we got here, the user's action was not recognized.

// Invoke the superclass to handle it.

return super.onOptionsItemSelected(item);

}

}

显示自定义View

因为Toolbar是ViewGroup的子类,因此可以向其内部添加View进行显示。这里我们简单的添加一个TextView显示一个文本。

android:id="@+id/toolbar"

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

android:background="?attr/colorPrimary"

android:elevation="4dp"

android:theme="@style/ToolbarTheme"

app:popupTheme="@style/ThemeOverlay.AppCompat.Light"

app:titleTextAppearance="@style/Toolbar.TitleText">

android:id="@+id/toolbar_title"

style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center"

android:text="自定义"

android:textSize="21sp"/>

好了,所有的元素都添加到了Toolbar上,运行效果图如下:

Toolbar元素

Toolber复用

应用中有很多界面,每个Activity一般都需要操作栏,且大多数activity的操作栏的元素是一致的,那每个布局文件里面都写这么多资源文件是累赘的。因此可以对Toolbar进行复用,使得布局文件看起来更精炼,更改Toolbar整体效果,如背景之类的可以更方便。

首先,在布局文件toolbar.xml中定义Toolbar。

android:id="@+id/toolbar"

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

android:background="?attr/colorPrimary"

android:contentInsetLeft="0dp"

android:contentInsetStart="0dp"

android:elevation="4dp"

android:theme="@style/ToolbarTheme"

app:navigationIcon="@drawable/icon_back"

app:popupTheme="@style/ThemeOverlay.AppCompat.Light"

app:titleTextAppearance="@style/Toolbar.TitleText">

之后,在需要添加Toolbar的地方引入这个布局资源。

layout="@layout/toolbar"/>

最后,在BaseActivity(一般app都会有)中的onCreate()方法设置Toolbar。注意,这个时候Activity不再继承AppCompatActivity,而是继承BaseActivity,而BaseActivity继承AppCompatActivity。BaseActivity部分代码如下:

@Override

protected void onCreate(@Nullable Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

if (toolbar != null) {

setSupportActionBar(toolbar);

mToolbarHelper = new ToolbarHelper(toolbar);

hanldeToolbar(mToolbarHelper);

}

}

protected void hanldeToolbar(ToolbarHelper toolbarHelper) {}

public static class ToolbarHelper {

private Toolbar mToolbar;

public ToolbarHelper(Toolbar toolbar) {

this.mToolbar = toolbar;

}

public Toolbar getToolbar() {

return mToolbar;

}

public void setTitle(String title) {

TextView titleTV = (TextView) mToolbar.findViewById(R.id.toolbar_title);

titleTV.setText(title);

}

}

代码中首先获取到Toolbar将其设置为操作栏,之后创建了一个ToolbarHelper对象,ToobarHelper主要是封装了下Toolbar,并提供操作自定义View的方法。然后调用hanldeToolbar()方法,子Activity通过重写这个方法,可以对Toolbar进行定制操作。

在真实项目中应用Toolbar

在上面我们看到了显示所有Toolbar元素的效果图,肯定会说,这跟我们产品设计的不一样,跟应用中所需要的不一样。一般我们应用中大多是这样的:

常用Toolbar.png

观察下,首先左边是一个返回按钮,中间是标题,有可能右边是文本或者按钮来提供分享、编辑之类的操作。接下来,我们来看看如何实现。

实现返回按钮,在之前我们设置过显示导航按钮、logo、标题及子标题。现在将导航按钮作为返回按钮,设置为UI提供的图标,而logo和标题类的设置不显示就可以了。

接下来就是设置事件监听了,还记得添加按钮时的事件处理么?一样的都是在onOptionsItemSelected()进行处理,它的id是android.R.id.home:

@Override

public boolean onOptionsItemSelected(MenuItem item) {

switch (item.getItemId()) {

case android.R.id.home:

FragmentManager fm = getSupportFragmentManager();

if (fm != null && fm.getBackStackEntryCount() > 0) {

fm.popBackStack(null, FragmentManager.POP_BACK_STACK_INCLUSIVE);

} else {

finish();

}

return true;

default:

return super.onOptionsItemSelected(item);

}

}

实现中间标题的显示。在上一步我们禁用了Toolbar原本显示在左边的标题,中间的标题我们可以通过向Toolbar中添加TextView实现,与之前显示Toolbar上所有元素中的自定义View是一样的。对于更改标题,则通过上面Toolbar复用所提到的ToolbarHelper进行操作。

右边的文本及图标显示。这个可以使用Toolbar本身的menu(前面已经介绍过),也可以将其作为自定义View。

总之,这三部分(左边+中间+右边)实现方式大致如此,根据你的项目,合理地进行安排。

关于源码:

不只是本文涉及的代码,会包含很多知识点的代码,应该都会在我的简书中进行介绍。

有可能代码与本文中所贴出来的有差异,但应该都是我觉得更好的方式吧。

欢迎大家对我进行批评教育。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。