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

所以今天就简单的翻译一篇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. Java:求字符串中邻接的数字为一个整体

    public static void main(String[] args) { String strNumbers = "0123456789";//用来进行判断数字的 Syst ...

  2. BootStrap Table使用小结

    1.在当前表格的最后新增数据 $("#data_module_table").bootstrapTable('append', data.data);//data.data---- ...

  3. SVG绘制loading效果

    <div class="loading"> <svg width='40px' height='40px' xmlns="http://www.w3.o ...

  4. SQL Server 2008 R2 企业版 MSDN原版

    经网友建议,提供常用试验用资源.以下软件或系统仅为完成本博客内的各种实验而提供下载. 所有软件.系统均为该软件发布方提供的原版文件,未经任何修改.破解等操作.使用目的仅限于学习.测试及实验,符合国家相 ...

  5. linux 安装wordpress 无故往外发送大量垃圾邮件

    linux 安装wordpress 无故往外发送大量垃圾邮件 始末 表现出来的现象就是, 网站运行没多久,mysql服务就挂了,重启也无法启动起来,提示 No such file or dicrion ...

  6. [Bayes] Why we prefer Gaussian Distribution

    最后还是选取一个朴素直接的名字,在此通过手算体会高斯的便捷和神奇. Ref: The Matrix Cookbook 注意,这里的所有变量默认都为多元变量,不是向量就是矩阵.多元高斯密度函数如下: 高 ...

  7. spring AOP 和自定义注解进行身份验证

    一个SSH的项目(springmvc+hibernate),需要提供接口给app使用.首先考虑的就是权限问题,app要遵循极简模式,部分内容无需验证,用过滤器不能解决某些无需验证的方法 所以最终选择用 ...

  8. 三、VueJs 填坑日记之项目文件认识

    上一篇博文,我们搭建了一套基础的vuejs的环境,首先安装node.js,然后利用npm包管理器,安装vue-cli,设置淘宝镜像,初始化项目,安装依赖,运行.在这一篇,我们将认识vuejs项目里的各 ...

  9. C#实现倒油算法

    原题如下:12(a桶 满的 有12斤油)斤桶里 取出6斤油 有 另外有8斤(b桶)和5斤(c桶)两个空桶  让程序输出取出这6斤油的步骤 现在实现的算法可以配参数(定义有几个桶,初始有多少油,要得到多 ...

  10. [转载] 基于Dubbo的Hessian协议实现远程调用

    转载自http://shiyanjun.cn/archives/349.html Dubbo基于Hessian实现了自己Hessian协议,可以直接通过配置的Dubbo内置的其他协议,在服务消费方进行 ...