[Android] Android利用Coordinatorlayout+AppbarLayout实现折叠式布局
折叠式布局在App中相当常见,给人一种科技感,充满良好的用户体验。
本文就以两个简单的例子,来举例说明基本折叠式布局:
首先需要在app/build.gradle下添加如下依赖:
compile 'com.android.support:support-v4:23.4.0'
compile 'com.android.support:design:23.4.0'
一、实现Toolbar + menu 菜单
布局文件activity_toolbar.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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity.ToolbarActivity"> <android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="53dp"
android:background="#cccccc"> </android.support.v7.widget.Toolbar> </RelativeLayout>
Java代码文件:
package com.jack.mymdfull.activity; import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast; import com.jack.mymdfull.R; public class ToolbarActivity extends AppCompatActivity implements Toolbar.OnMenuItemClickListener{
private Toolbar toolbar; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_toolbar); initView();
} private void initView(){
toolbar = (Toolbar)findViewById(R.id.toolbar);
setSupportActionBar(toolbar); toolbar.setTitle("Title");
toolbar.setOnMenuItemClickListener(this);
} @Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.menu_1:
Toast.makeText(getApplicationContext(),"菜单1",Toast.LENGTH_SHORT).show();
break;
case R.id.menu_2:
Toast.makeText(getApplicationContext(),"菜单2",Toast.LENGTH_SHORT).show();
break;
}
return true;
} @Override
public boolean onCreateOptionsMenu(Menu menu) {
//引入options菜单
getMenuInflater().inflate(R.menu.menu,menu);
return true;
}
}
R.menu.menu.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/menu_1"
android:icon="@mipmap/***"
android:title="菜单1"
app:showAsAction="collapseActionView" /> <item
android:id="@+id/menu_2"
android:icon="@mipmap/**"
android:title="菜单2"
app:showAsAction="collapseActionView" />
</menu>
显示效果如下:
二、CoordinatorLayout + AppBarLayout + CollapsingToolbarLayout + NestedScrollView 实现单页面 滚动 + 顶部 实现方法:
布局文件 acvity_col1.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".activity.Col1Activity"> <android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"> <android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed"> <ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="@mipmap/bg"
app:layout_collapseMode="parallax" /> <android.support.v7.widget.Toolbar
android:id="@+id/col1_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#000"
android:minHeight="50dp"
app:layout_collapseMode="pin"> <TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="文本标题" />
</android.support.v7.widget.Toolbar> </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout> <android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior"> <TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="@string/col1_text"
android:textColor="#000"
android:textSize="20sp" />
</android.support.v4.widget.NestedScrollView> </android.support.design.widget.CoordinatorLayout>
java代码文件:
package com.jack.mymdfull.activity; import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar; import com.jack.mymdfull.R; public class Col1Activity extends AppCompatActivity {
private Toolbar col1_toolbar; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_col1); initView();
} protected void initView(){
col1_toolbar = (Toolbar)findViewById(R.id.col1_toolbar);
setSupportActionBar(col1_toolbar); col1_toolbar.setTitle("标题");
}
}
显示效果如下:
本博客地址: wukong1688
本文原文地址:https://www.cnblogs.com/wukong1688/p/10686758.html
转载请著名出处!谢谢~~
[Android] Android利用Coordinatorlayout+AppbarLayout实现折叠式布局的更多相关文章
- Android学习之CoordinatorLayout+AppBarLayout
•AppBarLayout 简介 AppbarLayout 是一种支持响应滚动手势的 app bar 布局: 基本使用 新建一个项目,命名为 TestAppBarLayout: 修改 activity ...
- Android CoordinatorLayout + AppBarLayout(向上滚动隐藏指定的View)
在新的Android Support Library里面,新增了CoordinatorLayout, AppBarLayout等. 实现的效果: 向下滚动RecylerView,Tab会被隐藏,向上滚 ...
- Android中利用ViewHolder优化自定义Adapter的典型写法
利用ViewHolder优化自定义Adapter的典型写法 最近写Adapter写得多了,慢慢就熟悉了. 用ViewHolder,主要是进行一些性能优化,减少一些不必要的重复操作.(WXD同学教我的. ...
- (转)android中利用 ViewPage 实现滑动屏
最近实现了这样的一个效果:滑动界面出现拖拽效果,可翻动3屏,也可点击按钮翻动页面. 主要利用android.support.v4.view.ViewPager控件来实现. 第一个界面: 滑动屏幕: 换 ...
- Android之利用HTTP网络通信实现与PHP的交互(三)
Android与PHP的交互是通过Http网络编程来实现的,利用php访问数据库,并且操作数据库中的数据,利用php作为接口,使Android连接数据库. 一般情况下,我们使用Json格式进行传输,利 ...
- android.support.design.widget.AppBarLayout 在android5.0+底部显示空白条问题
在最外层使用 RelativeLayout作为根节点,同时设置 android:fitsSystemWindows="true"问题解决. <?xml version=&qu ...
- android 下 利用webview实现浏览器功能
android 下 利用webview实现浏览器功能(一): 1.界面添加WEBVIEW控件. 2.在界面.JAVA代码页面(protected void onCreate(Bundle savedI ...
- 【Android】7.6 FrameLayout(帧布局)
分类:C#.Android.VS2015: 创建日期:2016-02-11 一.简介 帧布局是显示多个层次图的有效手段.比如第3章介绍的百度地图就是利用帧布局来实现的,它将图层分为22级分别缓存到指定 ...
- 【Android】7.3 GridLayout(网格布局)
分类:C#.Android.VS2015: 创建日期:2016-02-10 一.简介 Android 4.0(API 14)开始提供的GridLayout布局使用虚细线将布局划分为行.列和单元格,也支 ...
随机推荐
- python学习日记(迭代器、生成器)-乱七八糟
迭代器 迭代是Python最强大的功能之一,是访问集合元素的一种方式. 迭代器是一个可以记住遍历的位置的对象. 迭代器对象从集合的第一个元素开始访问,直到所有的元素被访问完结束.迭代器只能往前不会后退 ...
- sshfs && tailon
sshfs 安装yum install glib2-devel fuse-sshfs官方版本地址https://github.com/libfuse/sshfs/releases目前最新版本:wget ...
- 记OI退役
前言 (这篇本来在联赛前写了一点,但是一直没有发布.现在退役了,还是把它发出来留作纪念吧!) 其实,这篇随笔早该在停课时就写,可是我却迟迟没有动笔. 可能是我真的太懒了,或许也是我想要逃避自己内心的真 ...
- genymotion ddms查看data等文件目录
使用ADB shell 命令: 打开 Cmd ,输入 ADB shell 命令后,回车(前提是你已经配置好了adb 的环境变量,跟配置Java的环境变量一样); 输入su回车,获取超级管理员权限 ...
- visual studio 阅读 linux-kernel
@2018-12-13 [小记] 使用 visual studio 阅读 linux-kernel 方法 a. 文件 ---> 新建 --->从现有代码创建项目 b. 指定项目存储位置,命 ...
- hex文件格式
hex文件格式是可以烧写到单片机中,被单片机执行的一种文件格式,生成Hex文件的方式有很多种,可以通过不同的编译器将C程序或者汇编程序编译生成hex. Hex文件格式解析 Hex文件如果用特殊的程 ...
- Linux下使用pv监控进度
使用pv移动文件 pv example.mkv > /tmp/example.mkv 使用pv监控dd pv -cN source < example.iso | dd of=/dev/s ...
- JavaScript深入之从原型到原型链
构造函数创建对象 我们先使用构造函数创建一个对象: function Person(){} var person = new Person(); person.name = 'Kevin'; cons ...
- 【译】9. Java反射——泛型
原文地址:http://tutorials.jenkov.com/java-reflection/generics.html ===================================== ...
- redis的使用场景和基本数据类型
一:redis使用的场景 redis是一个高性能的NoSQL数据库,特点是高性能,持久存储,适应高并发的应用场景. 下面看看它的使用场景1.取最新N个数据的操作比如取网站的最新文章,通过下面方式,我们 ...