今天星期五,刚从体育场打完球回来,洗了洗脚。明天还要继续上班,也是非常艰难。近期我的小腰有点不舒服,就早点睡觉歇息。

所以今天就简单的翻译一篇Android官方站点上的文章,我会加一些补充。

原文地址:http://developer.android.com/intl/zh-cn/training/appbar/setting-up.html

兴许翻译的文章链接:http://blog.csdn.net/leilifengxingmw/article/details/51174113,有兴趣的能够接着看。

这节课程教你

1给一个Activity加入工具栏

2运用应用栏有用的方法

你还应该阅读

设置支持库

工具栏最主要的形式是在一端显示Activity的标题,在还有一端显示一个overflow菜单。

即使是这样的最简单的形式,工具栏依旧能够给用户提供有用的信息,使应用看起来更加协调。

图表1.一个有应用标题和overflow菜单的应用栏

从Android3.0(APIlevel 11)開始,全部的Activity使用默认主题的Action Bar(工具栏)作为app bar(应用栏)。可是,随着Android的公布,应用栏的特性被逐渐加入到了原生的工具栏上。因此,原生的工具栏在执行不同Android版本号的设备上表现有所不同。

相反,近期的特性被加入到了支持库的ToolBar(工具栏)上。不论什么能够使用支持库的设备都能够使用ToolBar.

因此。你应该使用这些支持库里的ToolBar类来实现你的Acitivity的应用栏(App Bar)。使用支持库的toolBar能够保证你在不同设备上有同样的特性。比如,toolBar会给执行Android2.1(API level 7)或更高版本号的设备提供材料设计(Material design)体验,可是原生的工具栏(action bar)仅仅有在执行Android5.0(API level 21)或更高版本号的设备上才提供材料设计体验。

给一个Activity加入ToolBar

Toolbar

1加入 v7 accompat支持库到你的project中,在 Support Library Setup章节中描写叙述的那样。

2保证Activity继承自 AppCompatActivity

public class MyActivity extends AppCompatActivity {
// ...
}

注意:更改你的app中的全部的Activity都继承自AppCompactActivity以使用ToolBar取代 app bar。

3 在app的mainfest.xml 文件里设置节点使用appcompat的一个没有NoActionBar(工具栏)的主题。

<application
android:theme="@style/Theme.AppCompat.Light.NoActionBar"
/>

4 在 Activity的不居中加入一个ToolBar。

比如以下的布局代码加入了一个Toolbar并且使它浮动在activity的上面。

<android.support.v7.widget.Toolbar
android:id="@+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

材料设计说明建议 app bars 有4dp的仰角(elevation)。由于你要使用toolBar作为app bar。所以要把toolbar放在activity布局的顶部

5 在Activity的onCreate()方法中调用Activity的setSupportActionBar()方法来传递这个activity的toolbar。

这种方法设置传递过来的toolbar作为这个activity的app app bar。

比如:

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_my);
Toolbar myToolbar = (Toolbar) findViewById(R.id.my_toolbar);
setSupportActionBar(myToolbar);
}

你的应用如今有了一个主要的 action bar。

默认情况下,这个action bar 仅仅包括app的标题和一个overflow 菜单。overflow菜单中的菜单选项在初始的时候仅仅包括一个settings项。亦能够向action bar和overflowmenu加入很多其它的 actions项,就像 Adding and Handling Actions.(我会在兴许的文章中接着翻译这篇文章)描写叙述的那样。

使用 App Bar有用的方法

一旦你设置了toolbar作为activity的app bar,你就能够使用v7 accompat支持库里ActionBar类中的非常多用用的方法了。

这些方法能够让你做非常多有用的事情,比如隐藏和显示 app bar。

使用ActionBar的方法,首先调用Activity的getSupportActionBar()方法。

这种方法会返回一个 appcompat ActionBar 的引用。一旦你得到了这些引用你就能够 ActionBar的任一方法来调整app bar。比如能够调用 ActionBar的hide()方法来隐藏app bar。

上面说的都是理论性的东西,如今在实际的project中实践一下。实践是检验真理的唯一标准。

1 打开android studio 新建一个Phone&Tablet Module,点击next,选择 add no activity,点击finish。例如以下图所看到的。



2 在新建好的module的java/learntoolbar/文件夹下新建一个MainActivity.java继承自AccompatActivity。在res文件夹下新建一个layout文件夹在layout文件夹下新建一activity_main.xml文件作为MainActivity的布局。最后要在androidmanifest.xml文件里注冊MainActivity。文件夹结构例如以下所看到的。



3 androidmanifest.xml 文件

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.learntoolbar"> <application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme"> <activity android:name=".MainActivity"
android:theme="@style/AppTheme.NoActionBar">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity> </application> </manifest>

注意:上面application节点的android:theme=”@style/AppTheme”。这个AppTheme是系统自己主动生成的,而activity节点的android:theme=”@style/AppTheme.NoActionBar” 是自己加入的,如今打开values文件夹下的style。xml文件看一看。

style.xml

<resources>

    <!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style> </resources>

4接下来在activity_main.xml文件里加入一个toolbar控件

<android.support.v7.widget.Toolbar
android:id="@+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="? attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

5接下来在MainActivity中找到这个toolbar

  Toolbar my_toolbar;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
my_toolbar= (Toolbar) findViewById(R.id.my_toolbar);
setSupportActionBar(my_toolbar); }

这时我们执行一下先看看效果。

什么情况,说好的我的overflow 菜单怎么没显示,打脸是不是,不是,这时候不要着急。由于我创建project的时候,并没有加入一个默认的activity。所以还有很多自己主动生成的文件要自己去写。

6接下来在res文件夹下新建一个menu文件夹在menu文件夹下新建一个mymenu.xml文件

mymenu.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_settings"
app:showAsAction="never"
android:title="settings" />
</menu>

然后在MainActivity中重写两个方法

  @Override
public boolean onCreateOptionsMenu(Menu menu) {
//这句话的意思是把mymenu载入到menu中
getMenuInflater().inflate(R.menu.mymenu,menu); return super.onCreateOptionsMenu(menu);
} @Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
case R.id.action_settings:
Toast.makeText(this,"you click action_settings",Toast.LENGTH_SHORT).show();
return true;
}
return super.onOptionsItemSelected(item);
}

看看效果图

7 接下来简单的展示一下App Bar有用的方法 。

首先在activity_main.xml文件里加入两个button

  <Button
android:id="@+id/btnHideToolBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="隐藏toolBar"/>
<Button
android:id="@+id/btnShowToolBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="显示toolBar"/>

在MainActivity作对应操作

 Button btnHideToolBar, btnShowToolBar;
 btnHideToolBar = (Button) findViewById(R.id.btnHideToolBar);
btnHideToolBar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//隐藏ActionBar
getSupportActionBar().hide();
}
});
btnShowToolBar = (Button) findViewById(R.id.btnShowToolBar);
btnShowToolBar.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//显示ActionBar
getSupportActionBar().show();
}
});

看看效果吧。

这篇文章基本翻译的几乎相同了,还有相关的几篇我会接着翻译。

事实上这篇文章就强调了一件事:just 使用toolbar!

相关的演示效果已经给出了。有什么疑问和错误欢迎指出。感激不尽!

设置应用栏(Setting Up the App Bar)的更多相关文章

  1. IOS 设置导航栏全局样式

    // 1.设置导航栏背景 UINavigationBar *bar = [UINavigationBar appearance]; [bar setBackgroundImage:[UIImage r ...

  2. 美团HD(2)-设置导航栏内容

    DJHomeViewController.m #import "DJHomeViewController.h" #import "DJConstantValue.h&qu ...

  3. 设置导航栏nav全透明

    设置导航栏nav全透明 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 14.0px Menlo; color: #ffffff } span.s1 { } ...

  4. IOS 设置导航栏

    //设置导航栏的标题 self.navigationItem setTitle:@"我的标题"; //设置导航条标题属性:字体大小/字体颜色…… /*设置头的属性:setTitle ...

  5. iOS不得姐项目--appearance的妙用,再一次设置导航栏返回按钮,导航栏左右按钮的封装(巧用分类)

    一.UI_APPEARANCE_SELECTOR 彩票项目中appearance的用法一直没有搞明白,这次通过第二个项目中老师的讲解,更深一层次的了解到了很多关于appearance的作用以及使用方法 ...

  6. iOS 设置导航栏之二(设置导航栏的颜色、文字的颜色、左边按钮的文字及颜色)

                      #import <UIKit/UIKit.h> @interface AppDelegate : UIResponder <UIApplicati ...

  7. iOS 设置导航栏的颜色和导航栏上文字的颜色

    #import <UIKit/UIKit.h> @interface AppDelegate : UIResponder <UIApplicationDelegate> @pr ...

  8. wordpress设置导航栏

    设置导航栏,首先你要设置你的导航分类.登陆后台---文章---分类目录,首先在这里输入你要写入导航的标题. 设置好后点击---外观---菜单这个地方就可以具体的设置导航的排序和下拉等二级

  9. iOS设置导航栏样式(UINavigationController)

    //设置导航栏baritem和返回baiitem样式 UIBarButtonItem *barItem = [UIBarButtonItem appearance]; //去掉返回按钮上的字 [bar ...

随机推荐

  1. Flex 基础语法(一)

    任何一个容器都可以指定为Flex布局. .box{ display: flex; } 行内元素也可以使用Flex布局. .box{ display: inline-flex; } Webkit内核的浏 ...

  2. bzoj1001(对偶图最短路)

    显然是个最大流问题. 边数达到了10^6级别,显然用dinic算法会TLE 对于一个平面图来说,当然用对偶图的最短路来求最小割(最大流) SPFA转移的时候注意判断边界情况 应该要开longlong才 ...

  3. Python概述与安装

    Python 一门面向对象的解释性语言. Python优点 开发效率高(有丰富的各种类库,不需要重复造轮子):可移植性:解释性:免费开源:交互式(IDLE,代码写一行执行一行) Python缺点 相对 ...

  4. 【原创】使用workstation安装Xenserver 6.5+cloudstack 4.10----本地存储模式

    1. 背景: 近期由于项目和个人学习得需求,开始接触到Cloudstack,虽然云计算概念在大学刚毕业的时候就已经略有耳闻,但是由于工作原因,也一直没有了解,下班后想自己折腾下cloudstack,便 ...

  5. mysql主从同步+mycat读写分离+.NET程序连接mycat代理

    背景 最近新项目需要用到mysql数据库,并且由于数据量大的原因,故打算采用1主1从(主数据库负责增.删.改操作:从数据库负责查操作)的数据库架构,在实现主从之后还要实现读写分离的代理,在网上搜寻了很 ...

  6. install plugin group_replication ERROR 1126 (HY000)

    在给MySQL安装插件的时候,你可能会遇到如题所示的报错. 更详细的错误输出如下: mysql> INSTALL PLUGIN group_replication SONAME 'group_r ...

  7. socket.io 入门篇(三)

    本文原文地址:https://www.limitcode.com/detail/5926e3a056fba70278bf2044.html 前言 上篇我们介绍了 socket.io 中room的概念和 ...

  8. javascript常用的Math对象的方法

    简介 Math对象是在程序编程中用于执行一些数学任务的.Math 对象并不像 Date 和 String 那样是对象的类,因此没有构造函数 Math(),像 Math.sin() 这样的函数只是函数, ...

  9. OPENGLES 绘制纹理带黑圈pre-multiplying

    1. 问题 在进行 OpenGL 纹理混合的过程中,遇到一个诡异的现象,两个纹理混合的效果出人所料: 将一个ALPHA渐变的[胡须]加在另一张图片上,这个 [胡须]是由外向里逐渐增加透明度的,也就是最 ...

  10. SurfaceView 使用demo 飞机游戏小样

    本demo 主要使用了surfaceview 画图. 1.在线程中对canvas操作. 2.实现画图 3.surfaceView 继承了view 可以重写ontouchevent方法来操作输入. 代码 ...