Android之Material Design之可刷新的滑动列表(RecyclerView)

Material Design控件的简单介绍:

  • Toolbar加强版ActionBar,用setSupportActionBar()方法将Toolbar实例传入 app:showAsAction-用来指定按钮的显示位置)。
  • DrawerLayout用于滑动菜单。
  • FloatingActionButton悬浮按钮。
  • Snackbar可交互式提示。
  • CoordinatorLayout加强版FramLayout,可监听其所有子控件的事件,然后自动帮我们做出合理的响应,用于Toolbar。
  • AppBarLayout一个垂直方向的LinearLayout,内部做了滚动事件的封装。必须是CoordinatorLayout的子布局。
  • CollapsingToolbarLayout用于可折叠式标题栏,只能作为AppBarLayout的直接子布局来使用。
  • NestedScrollView — ScrollView加强版-允许使用滚动方式查看屏幕以外的数据,NestedScrollView增加了嵌套响应滚动事件功能。
  • CardView可和RecyclerView配合实现卡片式布局。
  • SwipeRefreshLayout — 用于下拉刷新。

~其中有一个名为Demo的bean类就不贴出来了,都是set/get函数~


主布局文件activity_list.xml(xmlns:app可用于兼容5.0以下系统):

<?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:fitsSystemWindows="true"
    tools:context="com.cuanbo.cb_iot.View.Presentation.MeetingListActivity"
    android:id="@+id/parentLayout">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="@dimen/app_bar_height"
        android:background="@drawable/background_toolbar"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay"
        >

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:contentScrim="@drawable/background_toolbar"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:toolbarId="@+id/toolbar"
            >

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"
                android:fitsSystemWindows="true"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@drawable/background_toolbar"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay" />



        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_list" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/fab_margin"
        app:backgroundTint="@color/colorAccent"
        app:layout_anchor="@id/app_bar"
        app:layout_anchorGravity="bottom|end"
        app:srcCompat="@mipmap/ic_add_white_18dp"
        android:elevation="8dp"/>

   

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


Toolbar下内容布局文件content_list.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout
    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:id="@+id/swiperefresh"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.cuanbo.cb_iot.View.Presentation.MeetingListActivity"
    tools:showIn="@layout/activity_meeting_list">

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

        <android.support.v7.widget.RecyclerView
            android:id="@+id/recycler"
            android:layout_width="match_parent"
            android:layout_height="match_parent">


        </android.support.v7.widget.RecyclerView>

</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.SwipeRefreshLayout>


用于RecyclerView的CardView布局文件item_list.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_marginTop="20dp"
    android:layout_marginRight="30dp"
    android:layout_marginLeft="30dp"
    app:cardCornerRadius="6dp"
    app:cardElevation="8dp">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <TextView
            android:id="@+id/text_bookName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:gravity="center"
            android:text="书名"
            android:textSize="20sp"
            android:textStyle="bold" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/text_author"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:layout_weight="1"
                android:text="作者"
                android:textSize="16sp" />

            <TextView
                android:id="@+id/text_press"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="8dp"
                android:layout_marginTop="8dp"
                android:layout_weight="1"
                android:text="出版社"
                android:textSize="16sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/text_type"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:layout_weight="1"
                android:text="题材"
                android:textSize="16sp" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal">

            <Button
                android:id="@+id/btn_buy"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@color/FullTransparent"
                android:text="购买"
                android:textColor="@color/mainColor"
                android:textSize="17sp" />

            <Button
                android:id="@+id/btn_collect"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@color/FullTransparent"
                android:text="添加收藏"
                android:textColor="@color/mainColor"
                android:textSize="17sp" />

            <Button
                android:id="@+id/btn_try"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@color/FullTransparent"
                android:text="试读"
                android:textColor="@color/mainColor"
                android:textSize="17sp" />
        </LinearLayout>

    </LinearLayout>
</android.support.v7.widget.CardView>

代码文件MainActivity:

public class MainActivity extends AppCompatActivity {

    private MyAdapter adapter;
    private SwipeRefreshLayout swipeRefreshLayout;
    private List<Demo> demoList = new ArrayList<>();
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_list);
        
        //获取Toolbar布局
        Toolbar toolbar = findViewById(R.id.toolbar);
        //方法将Toolbar实例传入
        setSupportActionBar(toolbar);
        //添加系统返回按钮在toolbar
        ActionBar actionBar = getSupportActionBar();
        if (actionBar != null) {
            actionBar.setDisplayHomeAsUpEnabled(true);
        }

        initFloatBtn();
        
        initData();
        initRecyclerView();
        initSwipeRefreshLayout();
        
    }
private void initFloatBtn() {
        //悬浮按钮
        FloatingActionButton fab = findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
//                悬浮按钮点击事件

            }
        }); 

    }
private void initData() {
    demoList.clear();
    //读取本地数据库litePal数据库
    List<Demo> demos = DataSupport.findAll(Demo.class);
    demoList.addAll(demos);
    
}
private void initRecyclerView(){
    RecyclerView recyclerView = findViewById(R.id.recycler);
    GridLayoutManager layoutManager = new GridLayoutManager(this,1);
    recyclerView.setLayoutManager(layoutManager);
    adapter = new MeetingAdapter(demoList);
    recyclerView.setAdapter(adapter);
    recyclerView.setNestedScrollingEnabled(false);//解决滑动列表卡顿问题
}
private void initSwipeRefreshLayout(){
    swipeRefreshLayout = findViewById(R.id.swiperefresh);
    swipeRefreshLayout.setSize(SwipeRefreshLayout.LARGE);
    //设置下拉刷新进度条的颜色
    swipeRefreshLayout.setColorSchemeResources(R.color.colorPrimary);
    swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
        @Override
        public void onRefresh() {
            //进行刷新数据操作
            initData();
            adapter.notifyDataSetChanged();
            swipeRefreshLayout.setRefreshing(false);
        }
    });
}


代码文件MyAdapter:

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {

    private Context context;
    private List<Demo> demoList;
        //利用结构函数传入数据
    public MyAdapter(List<Demo> demoList) {
        
        this.demoList = demoList;
    }


    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        //获取context
        if (context == null) {
            context = parent.getContext();
        }
        //绑定RecyclerView的子布局即item_list.xml
        View view = LayoutInflater.from(context).inflate(R.layout.item_list,parent,false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, final int position) {
        //根据position获取相应的数据
        final Demo demo = demoList.get(position);
        //给RecyclerView子布局中的控件设定相应的数据
        holder.textBookName.setText(demo.getBookName());
        holder.textAuthor.setText(demo.getAuthor());
        holder.textPress.setText(demo.getPress());
        holder.textType.setText(demo.getType());
       
        //购买按钮点击事件
        holder.btnBuy.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                
              

            }
        });
        //收藏按钮点击事件
        holder.btnCollect.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                
            }
        });

        //试读按钮点击事件
        holder.btnTry.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                

            }
        });

        
    }

    @Override
    public int getItemCount() {
        return meetingList.size();
    }


    static class ViewHolder extends RecyclerView.ViewHolder {
        CardView cardView;
        TextView textBookName;
        TextView textAuthor;
        TextView textPress;
        TextView textType;
        
        Button btnBuy;
        Button btnCollect;
        Button btnTry;

        ViewHolder(View itemView) {
            super(itemView);
            cardView = (CardView) itemView;
            textBookName = itemView.findViewById(R.id.text_bookName);
            textAuthor = itemView.findViewById(R.id.text_author);
            textPress = itemView.findViewById(R.id.text_press);
            textType = itemView.findViewById(R.id.text_type);
            
            btnBuy = itemView.findViewById(R.id.btn_buy);
            btnCollect = itemView.findViewById(R.id.btn_collect);
            btnTry = itemView.findViewById(R.id.btn_try);

        }

    }

    

}



猜你喜欢

转载自blog.csdn.net/amberoot/article/details/80541100