Android中CoordinatorLayout(粘性菜单)的使用

CoordinatorLayout简介

CoordinatorLayout是在 Google IO/15 大会发布的,遵循Material 风格,包含在 support Library中,结合AppbarLayout, CollapsingToolbarLayout等 可 产生各种炫酷的效果

CoordinatorLayout简介通常用来 干什么

点击打开链接    Google官方地址

CoordinatorLayout is intended for two primary use cases:

As a top-level application decor or chrome layout

As a container for a specific interaction with one or more child views

简单来说:

  • 作为最上层的View
  • 作为一个 容器与一个或者多个子View进行交互

下面我来实现一个效果,就是头部是viewPager滚动轮播,中心是菜单栏,菜单栏是粘性的,底部是数据展示,当然了这将会使用到coordinatorLayout让中心菜单栏粘起来,具体看下面的代码吧。。。

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_width="match_parent"
        android:layout_height="wrap_content"
        >

        <android.support.v4.view.ViewPager
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="150dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="bottom"
            android:minHeight="15sp"
            android:text="菜单栏"
            android:textColor="#a4a"
            android:textSize="28sp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            />
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="我是哈哈哈"/>

    </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

java代码如下

package com.example.coordinatorlayoutdemo;

import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private ViewPager viewPager;//头布局
    private List<ImageView> list;//盛放ImageView的集合
    private int[] a = new int[]{R.drawable.andriod, R.drawable.andriod0, R.drawable.andriod2, R.mipmap.ic_launcher};
    private TextView tv;//数据列表

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager = findViewById(R.id.viewpager);
        tv = findViewById(R.id.tv);
        initList();//初始化数据源
        initVp();//初始化viewpager
        initEvent();//初始化点击事件
    }


    private void initList() {
        StringBuilder sb = new StringBuilder();
        for (int i = 0; i < 50; i++) {
            sb.append("今天是第" + (i + 1) + "天\n");

        }
        String s = sb.toString();
        tv.setText(s);

    }

    private void initVp() {
        list = new ArrayList<>();
        for (int i = 0; i < a.length; i++) {
            View v = View.inflate(this, R.layout.item, null);
            ImageView mimg = (ImageView) v.findViewById(R.id.img);
            mimg.setImageResource(a[i]);
            list.add(mimg);
        }
        MyAdapter adapter = new MyAdapter(list);
        viewPager.setAdapter(adapter);


    }

    private void initEvent() {
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {

            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }

}

viewPager滑动需要使用适配器代码如下

package com.example.coordinatorlayoutdemo;

import android.support.annotation.NonNull;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewParent;
import android.widget.ImageView;

import java.util.List;

/**
 * Created by 亮亮 on 2018/3/27.
 */

public class MyAdapter extends PagerAdapter {
    private List<ImageView> imgList;
    public MyAdapter(List<ImageView> imgList){
        this.imgList=imgList;

    }
    @Override
    public int getCount() {
        return imgList.size();
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view==object;
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        int p=position%imgList.size();
        ImageView img=imgList.get(p);
        ViewParent vp=img.getParent();
        if(vp!=null){
            ViewGroup parent=(ViewGroup) vp;
            parent.removeView(img);
        }
        container.addView(imgList.get(p));
        return imgList.get(p);
    }
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        int p=position%imgList.size();
        container.removeView(imgList.get(p));

    }
}

下面我们来看下效果吧

有一个item布局没贴上,好了效果就是你滑动的时候中间的菜单栏可以粘起来是不是很low呢,哈哈哈哈,就这样吧!!!



猜你喜欢

转载自blog.csdn.net/tdltdltdl886/article/details/79753025
今日推荐