[AS2.2]Android 5.0新控件记录

前段时间因为新的约束布局就升级了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;
            }
        });


其中 dl_menu.openDrawer(GravityCompat.START); 是用来打开侧边栏的代码!


最后来说下侧边栏

首先是布局文件

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>


首先要吧最外层布局设置成DrawLayout

然后我将原来的整个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);

    }
}







评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值