前段时间因为新的约束布局就升级了2.2试了下新布局,所以现在都用2.2开发了。5.0新控件都出好久了,现在也补下!
写了挺多篇了。
现在决定布局设计下
0.效果图
1.目录
2.分块解析代码
3.全部代码
以后布局都这样设置吧!
全部代码部分都会用小标题设置
这次的效果gif
目录
1.TabLayout+ViewPager+TextInputLayout
2.FloatingActionButton+Snackbar
3.CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout+Toolbar
4.DrawerLayout+NavigationView
引用
compile 'com.android.support:design:24.2.1'
1.TabLayout+ViewPager+TextInputLayout
首先是用到的布局文件xml
<android.support.design.widget.TabLayout
android:id="@+id/tab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabSelectedTextColor="@android:color/holo_blue_bright"
app:tabTextColor="@android:color/black"
app:tabIndicatorColor="@android:color/holo_blue_bright"
android:layout_below="@+id/tb_main"
android:layout_alignParentStart="true" />
<view
android:layout_width="match_parent"
android:layout_height="match_parent"
class="android.support.v4.view.ViewPager"
android:id="@+id/vp_main"
android:layout_alignParentStart="true"
android:layout_below="@+id/tab" />
设置代码如下
private ViewPager vp_main;
private TabLayout tab;
tab = (TabLayout) findViewById(R.id.tab);
vp_main = (ViewPager) findViewById(R.id.vp_main);
List<String> list = new ArrayList<>();
list.add("列表");
list.add("内容");
list.add("详情");
//设置tab模式
tab.setTabMode(TabLayout.MODE_FIXED);
for (int i = 0; i < list.size(); i++) {
tab.addTab(tab.newTab().setText(list.get(i)));
}
List<Fragment> fragments = new ArrayList<>();
for (int i = 0; i < list.size(); i++) {
Fragment fragment = new NewPager();
Bundle bundle = new Bundle();
bundle.putString("1",list.get(i));
fragment.setArguments(bundle);
fragments.add(fragment);
}
NewPagerAdapter adapter = new NewPagerAdapter(getSupportFragmentManager(),fragments,list);
vp_main.setAdapter(adapter);
//TabLayout与Viewpager关联
tab.setupWithViewPager(vp_main);
很简单的一个设置。其中设置了每个tab的数据和绑定的Fragment以及适配器的设置
适配器代码
NewPagerAdapter.java
package com.gjn.designdemo.main;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import java.util.List;
/**
* NewPagerAdapter
* Author: gjn.
* Time: 2017/4/1.
*/
public class NewPagerAdapter extends FragmentStatePagerAdapter {
private List<Fragment> fragments;
private List<String> list;
public NewPagerAdapter(FragmentManager fm,List<Fragment> fragments,List<String> list) {
super(fm);
this.fragments = fragments;
this.list = list;
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public int getCount() {
return fragments.size();
}
@Override
public CharSequence getPageTitle(int position) {
return list.get(position);
}
}
除了默认生成的几个实现方法以外
还多了个getPageTitle方法
这个方法是用来设置每个tab的标题的。如果不设置,每个tab是不会显示标题的!
在之后是设置viewpager的布局
view_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TextInputLayout
android:id="@+id/til_input"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="38dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="" />
</android.support.design.widget.TextInputLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tv_pager" />
</LinearLayout>
其中使用了TextInputLayout
来看下TextInputLayout的使用
private TextInputLayout til_input;
private EditText til_et;
til_input = (TextInputLayout) view.findViewById(R.id.til_input);
til_et = til_input.getEditText();
til_input.setHint("请输入内容:");
til_et.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
if (s.length()>4){
til_input.setErrorEnabled(true);
til_input.setError("长度大于4");
}else{
til_input.setErrorEnabled(false);
}
}
@Override
public void afterTextChanged(Editable s) {
}
});
以下是整个NewPager代码
NewPager.java
package com.gjn.designdemo.main;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.design.widget.TextInputLayout;
import android.support.v4.app.Fragment;
import android.text.Editable;
import android.text.TextWatcher;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.EditText;
import android.widget.TextView;
import com.gjn.designdemo.R;
/**
* NewPager
* Author: gjn.
* Time: 2017/4/1.
*/
public class NewPager extends Fragment {
private View view;
private TextInputLayout til_input;
private EditText til_et;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
view = inflater.inflate(R.layout.view_item, container, false);
init();
return view;
}
private void init() {
String bar = getArguments().getString("1");
TextView textView = (TextView) view.findViewById(R.id.tv_pager);
textView.setText(bar);
til_input = (TextInputLayout) view.findViewById(R.id.til_input);
til_et = til_input.getEditText();
til_input.setHint("请输入内容:");
til_et.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
if (s.length()>4){
til_input.setErrorEnabled(true);
til_input.setError("长度大于4");
}else{
til_input.setErrorEnabled(false);
}
}
@Override
public void afterTextChanged(Editable s) {
}
});
}
}
这一栏,就几乎实现了。滑动切屏和两个新的控件TabLayout和TextInputLayout的使用
2.FloatingActionButton+Snackbar
还是先xml布局
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
app:srcCompat="@mipmap/btn_menu"
android:id="@+id/fab_menu"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="11dp"
android:layout_marginBottom="15dp"
app:fabSize="normal" />
private FloatingActionButton fab_menu;
fab_menu = (FloatingActionButton) findViewById(R.id.fab_menu);
fab_menu.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
snackbar.show();
}
});
其中是点击之后显示一个snackbar
那么下面来看下snackbar
代码设置
private Snackbar snackbar;
snackbar = Snackbar.make(fab_menu,"是否跳转页面",Snackbar.LENGTH_LONG);
snackbar.setAction("跳转", new View.OnClickListener() {
@Override
public void onClick(View v) {
snackbar.dismiss();
Intent intent = new Intent(MainActivity.this, AppBarActivity.class);
MainActivity.this.startActivity(intent);
}
});
我们看到使用和Toast的使用非常像,也是需要make
不过多了setAction
而setAction其实就是设置出现的可以点击的点击事件
3.CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout+Toolbar
上面snackbar进行跳转的新activity就是以下的界面了
布局文件如下
activity_app_bar.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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_height="200dp"
android:layout_width="match_parent">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/coll_toolbar"
android:layout_width="match_parent"
android:layout_height="180dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:statusBarScrim="?attr/colorPrimary"
app:expandedTitleMargin="20dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@mipmap/bg"
android:scaleType="fitXY"
app:layout_collapseMode="parallax"
android:id="@+id/iv_toolbar_bg" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
app:layout_collapseMode="pin"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent" >
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<TextView
android:text="我是一条固定存在的提示........"
android:layout_width="match_parent"
android:layout_height="20dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="@+id/nsv_ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="android.support.design.widget.AppBarLayout$ScrollingViewBehavior">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/btn_dd"
android:clickable="true"
app:fabSize="mini"
android:id="@+id/floatingActionButton"
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="right|bottom"
android:layout_margin="10dp" />
</android.support.design.widget.CoordinatorLayout>
布局文件中加入了NestedScrollView和FloatingActionButton,其实都只是一个装饰,并未有特别的实际作用!
顺便一提,因为使用了AppBarLayout,所以必须使用CoordinatorLayout作为最外层布局
CoordinatorLayout布局图如下
其中FAB按钮为何会存在在AppBarLayout中呢
是因为做了如下设置
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="right|bottom"
其中
layout_anchor属性是将fab按钮放置到AppBarLayout内
layout_anchorGravity属性是设置按钮的位置,位置为右下角
至此,其实我们都不需要任何其他代码就应经实现了上面gif的自动拉伸appbar了
这边还加入了一个固定的textview,这边在来讲解一下AppBarLayout的使用
使用代码如下
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_height="200dp"
android:layout_width="match_parent">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/coll_toolbar"
android:layout_width="match_parent"
android:layout_height="180dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:statusBarScrim="?attr/colorPrimary"
app:expandedTitleMargin="20dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@mipmap/bg"
android:scaleType="fitXY"
app:layout_collapseMode="parallax"
android:id="@+id/iv_toolbar_bg" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
app:layout_collapseMode="pin"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent" >
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<TextView
android:text="我是一条固定存在的提示........"
android:layout_width="match_parent"
android:layout_height="20dp" />
</android.support.design.widget.AppBarLayout>
嵌入格式如下
首先是CollapsingToolbarLayout里面的一个属性设置了之后才可以实现伸缩
那就是layout_scrollFlags="scroll|exitUntilCollapsed"
在然后在CollapsingToolbarLayout中加入了一个imageview和一个toolbar,他们都有一个共同的属性layout_collapseMode
layout_collapseMode有两个属性值
parallax 伸缩设置,随着布局伸缩而伸缩
pin 固定设置,不会随着布局伸缩
toolbar一直都是固定在那边的,而图片确实随着appbar伸缩而显示或者消失!
这边有一篇属性解析的文章,可以看看 关于CoordinatorLayout展开与折叠相关属性
4.DrawerLayout+NavigationView
首先加一个单独的toolbar使用
布局代码
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="?attr/actionBarTheme"
android:minHeight="?attr/actionBarSize"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:id="@+id/tb_main" />
private Toolbar tb_main;
tb_main = (Toolbar) findViewById(R.id.tb_main);
tb_main.setTitle("主标题");
tb_main.setSubtitle("副标题");
tb_main.setNavigationIcon(R.mipmap.btn_menu);
tb_main.setLogo(R.mipmap.ic_launcher);
tb_main.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dl_menu.openDrawer(GravityCompat.START);
}
});
tb_main.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
return false;
}
});
最后来说下侧边栏
首先是布局文件
app_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/dl_menu"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="@layout/activity_main"/>
<view
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:fitsSystemWindows="true"
app:headerLayout="@layout/header_layout"
app:menu="@layout/menu_layout"
class="android.support.design.widget.NavigationView"
android:id="@+id/nv_view" />
</android.support.v4.widget.DrawerLayout>
然后我将原来的整个activity_main都用include导入
这边的android:layout_gravity="left"是设置侧边栏在左边
其中主要设置是view上面的属性
app:headerLayout="@layout/header_layout"
app:menu="@layout/menu_layout"
其中
app:headerLayout设置的是侧边栏的布局文件
app:menu设置的是侧边栏下面的菜单布局文件
具体布局看下面的布局解析
之后来看下侧边栏上面的布局
header_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="@mipmap/bg"
android:id="@+id/imageView"
android:scaleType="fitXY" />
<TextView
android:text="头部标题"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tv_head"
android:textAlignment="center"
android:textAllCaps="false"
android:textSize="24sp" />
</LinearLayout>
布局设置上面就放了 一个imageview和textview
在来看menu菜单的布局
menu_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<group
android:checkableBehavior="single"
android:title="Home items">
<item
android:id="@+id/nav_blog"
android:icon="@mipmap/btn_menu"
android:title="博客地址" />
<item
android:id="@+id/nav_ver"
android:icon="@mipmap/btn_menu"
android:title="版本" />
</group>
</menu>
再来是代码设置
private NavigationView nv_view;
private DrawerLayout dl_menu;
nv_view = (NavigationView) findViewById(R.id.nv_view);
dl_menu = (DrawerLayout) findViewById(R.id.dl_menu);
nv_view.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch(item.getItemId()){
case R.id.nav_blog:
Toast.makeText(MainActivity.this, "我的博客", Toast.LENGTH_SHORT).show();
break;
case R.id.nav_ver:
Toast.makeText(MainActivity.this, "版本信息", Toast.LENGTH_SHORT).show();
break;
default:
break;
}
return true;
}
});
全部代码
除了上面出现的,其余的代码都会贴下来
首先是布局xml代码
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="?attr/actionBarTheme"
android:minHeight="?attr/actionBarSize"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:id="@+id/tb_main" />
<android.support.design.widget.TabLayout
android:id="@+id/tab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabSelectedTextColor="@android:color/holo_blue_bright"
app:tabTextColor="@android:color/black"
app:tabIndicatorColor="@android:color/holo_blue_bright"
android:layout_below="@+id/tb_main"
android:layout_alignParentStart="true" />
<view
android:layout_width="match_parent"
android:layout_height="match_parent"
class="android.support.v4.view.ViewPager"
android:id="@+id/vp_main"
android:layout_alignParentStart="true"
android:layout_below="@+id/tab" />
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
app:srcCompat="@mipmap/btn_menu"
android:id="@+id/fab_menu"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_marginEnd="11dp"
android:layout_marginBottom="15dp"
app:fabSize="normal" />
</RelativeLayout>
activity_app_bar.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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_height="200dp"
android:layout_width="match_parent">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/coll_toolbar"
android:layout_width="match_parent"
android:layout_height="180dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:statusBarScrim="?attr/colorPrimary"
app:expandedTitleMargin="20dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@mipmap/bg"
android:scaleType="fitXY"
app:layout_collapseMode="parallax"
android:id="@+id/iv_toolbar_bg" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
app:layout_collapseMode="pin"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent" >
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<TextView
android:text="我是一条固定存在的提示........"
android:layout_width="match_parent"
android:layout_height="20dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="@+id/nsv_ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="android.support.design.widget.AppBarLayout$ScrollingViewBehavior">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="100dp" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/btn_dd"
android:clickable="true"
app:fabSize="mini"
android:id="@+id/floatingActionButton"
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="right|bottom"
android:layout_margin="10dp" />
</android.support.design.widget.CoordinatorLayout>
app_menu2.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/dl_menu2"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="@layout/activity_app_bar"/>
<view
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:fitsSystemWindows="true"
app:headerLayout="@layout/header_layout"
app:menu="@layout/menu_layout"
class="android.support.design.widget.NavigationView"
android:id="@+id/nv_view2" />
</android.support.v4.widget.DrawerLayout>
代码java
AppBarActivity.java
package com.gjn.designdemo.appbar;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.NavigationView;
import android.support.v4.view.GravityCompat;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
import com.gjn.designdemo.R;
public class AppBarActivity extends AppCompatActivity {
private Toolbar toolbar;
private NavigationView nv_view2;
private DrawerLayout dl_menu2;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.app_menu2);
initview();
initclick();
initdata();
}
private void initdata() {
toolbar.setTitle("火影忍者");
toolbar.setNavigationIcon(R.mipmap.btn_menu);
}
private void initclick() {
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dl_menu2.openDrawer(GravityCompat.START);
}
});
nv_view2.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch(item.getItemId()){
case R.id.nav_blog:
show("我的博客_appbar");
break;
case R.id.nav_ver:
show("版本信息_appbar");
break;
default:
break;
}
return true;
}
});
}
private void initview() {
toolbar = (Toolbar) findViewById(R.id.toolbar);
nv_view2 = (NavigationView) findViewById(R.id.nv_view2);
dl_menu2 = (DrawerLayout) findViewById(R.id.dl_menu2);
}
private void show(String str) {
Toast.makeText(this, str, Toast.LENGTH_SHORT).show();
}
}
MainActivity.java
package com.gjn.designdemo.main;
import android.content.Intent;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.NavigationView;
import android.support.design.widget.Snackbar;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.view.GravityCompat;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
import com.gjn.designdemo.R;
import com.gjn.designdemo.appbar.AppBarActivity;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private Snackbar snackbar;
private FloatingActionButton fab_menu;
private ViewPager vp_main;
private TabLayout tab;
private Toolbar tb_main;
private NavigationView nv_view;
private DrawerLayout dl_menu;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.app_menu);
initview();
initclick();
initdata();
}
private void initdata() {
tb_main.setTitle("主标题");
tb_main.setSubtitle("副标题");
tb_main.setNavigationIcon(R.mipmap.btn_menu);
tb_main.setLogo(R.mipmap.ic_launcher);
List<String> list = new ArrayList<>();
list.add("列表");
list.add("内容");
list.add("详情");
//设置tab模式
tab.setTabMode(TabLayout.MODE_FIXED);
for (int i = 0; i < list.size(); i++) {
tab.addTab(tab.newTab().setText(list.get(i)));
}
List<Fragment> fragments = new ArrayList<>();
for (int i = 0; i < list.size(); i++) {
Fragment fragment = new NewPager();
Bundle bundle = new Bundle();
bundle.putString("1",list.get(i));
fragment.setArguments(bundle);
fragments.add(fragment);
}
NewPagerAdapter adapter = new NewPagerAdapter(getSupportFragmentManager(),fragments,list);
vp_main.setAdapter(adapter);
//TabLayout与Viewpager关联
tab.setupWithViewPager(vp_main);
}
private void initclick() {
snackbar = Snackbar.make(fab_menu,"是否跳转页面",Snackbar.LENGTH_LONG);
snackbar.setAction("跳转", new View.OnClickListener() {
@Override
public void onClick(View v) {
snackbar.dismiss();
Intent intent = new Intent(MainActivity.this, AppBarActivity.class);
MainActivity.this.startActivity(intent);
}
});
fab_menu.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
snackbar.show();
}
});
tb_main.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dl_menu.openDrawer(GravityCompat.START);
}
});
tb_main.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
return false;
}
});
nv_view.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch(item.getItemId()){
case R.id.nav_blog:
Toast.makeText(MainActivity.this, "我的博客", Toast.LENGTH_SHORT).show();
break;
case R.id.nav_ver:
Toast.makeText(MainActivity.this, "版本信息", Toast.LENGTH_SHORT).show();
break;
default:
break;
}
return true;
}
});
}
private void initview() {
vp_main = (ViewPager) findViewById(R.id.vp_main);
tab = (TabLayout) findViewById(R.id.tab);
tb_main = (Toolbar) findViewById(R.id.tb_main);
fab_menu = (FloatingActionButton) findViewById(R.id.fab_menu);
nv_view = (NavigationView) findViewById(R.id.nv_view);
dl_menu = (DrawerLayout) findViewById(R.id.dl_menu);
}
}