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

所以今天就简单的翻译一篇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. Problem F: 多少个最大值?

    Description 输入若干个int类型的整数,求它们的最大值及其个数. Input 输入 若干个int类型的整数,至文件尾为止. Output 输出只有一行:There are # maximu ...

  2. 整数中1出现的次数(从1到n的整数中1出现的次数)

    题目 求出1~13的整数中1出现的次数,并算出100~1300的整数中1出现的次数?为此他特别数了一下1~13中包含1的数字有1.10.11.12.13因此共出现6次,但是对于后面问题他就没辙了.AC ...

  3. TF30042: The database is full. Contact your Team Foundation Server administrator.

    TF30042: The database is full. Contact your Team Foundation Server administrator. 在一个阳光明媚的下午,迁入代码的时候 ...

  4. HTTPS 建立连接的详细过程

    HTTPS是在HTTP的基础上和ssl/tls证书结合起来的一种协议,保证了传输过程中的安全性,减少了被恶意劫持的可能.很好的解决了解决了http的三个缺点(被监听.被篡改.被伪装) 对称加密和非对称 ...

  5. .net表达式计算器(中缀表达式转后缀表达式,支持20多个数学函数,支持函数嵌套)

    最近在网上查了一下表达工计算器的类库,发现Java版本的有一个比较成熟的叫W3EVal,好像是一个IBM工程师写的,.net就很少了(可能是我了解不够多),但投机取巧的实现思路有很多,比如: (1)将 ...

  6. Java实现归并排序和快速排序

    参考http://blog.csdn.net/morewindows/article/details/6684558和http://developer.51cto.com/art/201206/344 ...

  7. mac 安装protobuf,并编译

    因公司接口协议是PB文件,需要将 PB 编译成JAVA文件,且MAC 电脑,故整理并分享MAC安装 google 下的protobuf 文件   MAC 安装protobuf 流程 1.下载 http ...

  8. Python 日志处理(一) 按Nginx log_format 分割日志记录

    要求:不使用正则 根据nginx 默认的日志记录格式,分割日志记录. log_format main '$remote_addr - $remote_user [$time_local] " ...

  9. day04 JS

    很伤心,就在前天下午,本人的电脑突然挂了,电脑售后告知需要10个工作日才可修好. 于是乎,昨天学的内容来不及整理,暂且跳过,改天再抽空补上,就当缓几天再复习吧. 今天继续学习了JS的内容. 1 js的 ...

  10. 报Cannot change version of project facet Dynamic web module to 2.5 错误

    maven项目老是报这个错误,上网找了很多方法,把Dynamic Web Module的Version改成了2.5,结果还是报错. 后来找到一个方法说在web.xml中,将version改为3.0,就 ...