Material Design——Toolbar
来源:互联网 发布:mmd制作软件最新版 编辑:程序博客网 时间:2024/06/08 18:05
Material Design
Material Design里面许多控件都可以设计出非常美观的UI效果Toolbar就是其中之一并且在许多APP上面都广泛应用
Toolbar
Toolbar和Actionbar非常的类似也可以说Toolbar是Actionbar的升级版。
首先在布局里面:
既然说Toolbar是Actionbar的升级版并且作用的范围都是在头部,所以要想Toolbar显示我们需要设置一下ActionBar
在styles.xml里面设置APP主题字面也可以理解:.NoActionBar
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
然后在activity_main.xml里面实现布局
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.example.administrator.toolbar.MainActivity"> <FrameLayout 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="match_parent"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary"></android.support.v7.widget.Toolbar> </FrameLayout></RelativeLayout>
里面有好多我们不常用 的知识点:
xmlns:android=”http://schemas.android.com/apk/res/android”:其实这个属性我们可以简单理解为它会指定一个空间只有它我们才能调用类似android:layout_width,android:id这些属性。
android:layout_height=”?attr/actionBarSize”:我们把我们自己定义的Toobar高设置和Actionbar的高一样大小
android:background=”?attr/colorPrimary”:同理这个就是引用Actionbar的背景颜色
此时只要在MainActivity里面:
setContentView(R.layout.activity_main); toolbar= (Toolbar) findViewById(R.id.toolbar); //调用setSupportActionBar(toolbar)传入实例 setSupportActionBar(toolbar);
其实到这里Toolbar的空能基本上就实现了只是我们没有给它具体 的操作我们也可以随意更改主题了:只需要在AndroidManifest.xml
<activity android:name=".MainActivity" <!-- android:label便可以设置Toolbar显示的内容 --> android:label="GGG">
当然要想实现类似效果:
我们还需要在res——>New——>Directory 创建一个menu文件夹
具体代码如下:
<?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/one" android:icon="@mipmap/ic_launcher" android:title="one" app:showAsAction="always"/> <item android:id="@+id/two" android:icon="@mipmap/ic_launcher" android:title="two" app:showAsAction="always"/> <item android:id="@+id/three" android:icon="@mipmap/ic_launcher" android:title="three" app:showAsAction="never"/></menu>
对于 app:showAsAction:
如果是aways表示一定会在Toolbar上面显示
ifRoom表示如果有空间
never:省略成三个点点开才可以看见
到这里我们只要在MainActivity里面引入我们的Menu便可以做具体实用的操作了
package com.example.administrator.toolbar;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.support.v7.widget.Toolbar;import android.view.Menu;import android.view.MenuItem;import android.widget.Toast;public class MainActivity extends AppCompatActivity { private Toolbar toolbar; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); toolbar= (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); }//重写onCreateOptionsMenu方法来加载我们引入的menu布局 @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.toolbar,menu); return true; }//对点击上面每个标识进行具体的逻辑操作 @Override public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()){ case R.id.one: Toast.makeText(MainActivity.this,"你点击了按钮",Toast.LENGTH_SHORT).show(); break; case R.id. two: Toast.makeText(MainActivity.this,"你点击了按钮",Toast.LENGTH_SHORT).show(); break; case R.id.three: Toast.makeText(MainActivity.this,"你点击了按钮",Toast.LENGTH_SHORT).show(); break; } return true; }}
- Material Design——Toolbar
- UI——Material Design设计之Toolbar详解
- Material Design整理(三)——ToolBar
- Material Design——DrawerLayout+DrawerToggle+Toolbar实现炫酷侧拉动画
- Material Design 之 ToolBar
- 【Material Design】Toolbar使用
- Material Design之Toolbar
- Material Design控件-toolbar
- Material Design之Toolbar
- Android Material Design Toolbar
- Material Design之ToolBar
- Material Design之Toolbar
- Material Design之ToolBar
- Material Design以及ToolBar实战
- Material Design系列--Toolbar详细
- Material Design学习之Toolbar
- Material Design之使用Toolbar
- Android Material Design 之 Toolbar
- 05、react之 条件判断的四种写法
- 35. OP-TEE中基本算法接口调用实现
- 16. 高速收费站
- 网格离散曲率算法(利用Normal cycle 理论计算)
- 算法竞赛入门经典(第2版)-刘汝佳-第四章解题源码(C语言)(部分)
- Material Design——Toolbar
- 面试题9:斐波那契数列
- Node.js开发环境的构建及开发所需的一些工具的简单介绍(nvm、npm、supervisor)
- JVM学习笔记(二) 执行过程
- 17. 良乡食堂
- 用pandas处理MovieLens 1m 数据集
- 算法竞赛入门经典(第2版)-刘汝佳-解题源码说明
- 18. 吃货
- uget + aria2接管浏览器下载(附源中缺少uget-chrome-wrapper的解决办法).md