（待解决）项目实践-CardView卡片集布局-CSDN博客

csdn地址：blog.csdn.net/Wby_Nju/art…

@[toc]

前言

在使用CardView之前，我们需要理解什么时候需要使用CardView。使用不确定应不应该用的时候，先来看看官方文档个人总结下来就是，对比列表式：

想要直接在上面做一些操作比如想要展开，想要做按钮等。
和上面一脉相承，如果不想要做操作，想要快速浏览，用列表。比如想要看新闻list，浏览相册。这种快速浏览，没什么想要做操作的，就别用卡片式

总结一下就是：CardView卡片，那就说明我们的关注点在于具体的某一张Card。就好像一张名片，你会需要点击这张名片上的电话信息，查看它的头像信息。但是对于报纸list，你只是想要快速浏览。

另外，本文之前先学习了项目实践-RecyclerView（一）。不过对本文的实践没有任何影响

初步认识CardView

CardView是什么？

参考资料

Google用一句话介绍了CardView：一个带圆角和阴影背景的FrameLayout。

直接完成一个CardView

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android">
    
	<android.support.v7.widget.CardView
	    android:layout_width="match_parent" android:layout_height="wrap_content">
	
	    <RelativeLayout
	        android:layout_width="match_parent"
	        android:layout_height="wrap_content">
	        <ImageView
	            android:id="@+id/card_item_folder_img"/>
	        <TextView 
	            android:layout_alignBottom="@+id/card_item_folder_img"/>
	        <LinearLayout
	            android:layout_below="@id/card_item_folder_text"
	            android:orientation="horizontal"
	            android:layout_width="match_parent"
	            android:layout_height="50dp">
	            <TextView .../>
	            继续布局
	        </LinearLayout>
	    </RelativeLayout>
	</android.support.v7.widget.CardView>
</FrameLayout>
复制代码

预览图

实践反馈（未解决）

没有控件高度参考资料StackOverflow 上面的这个并么有解决我的问题。 很疑惑，实在是没有弄清楚，elevation属性到底怎么用啊。关于CardView的解决方案

    <android.support.v7.widget.CardView
        android:outlineProvider="bounds"
        android:layout_margin="20dp"
        app:cardElevation="8dp"
        app:cardMaxElevation="8dp"
        android:id="@+id/card_item_folder_card"
        android:layout_width="match_parent" android:layout_height="wrap_content">
复制代码

想用注入的方式完成布局加载关于inflate的使用，参考资料

        View view = inflater.inflate(R.layout.fragment_folder_list, container, false);
        //父布局
        FrameLayout frameLayout = view.findViewById(R.id.FolderListFragment_frameLayout);
        //R.layout.xxx 就是你想要加入到父布局的layout
        LayoutInflater.from(getContext()).inflate(R.layout.card_item_folder, frameLayout, true);
复制代码

卡片集的布局

卡片结合RecyclerView

难点在于间隔。参考资料间隔设置不难，就是继承一个RecyclerView.ItemDecoration但是需要理解这个类具体做了什么。等到自定义分割线的时候再学习吧，现在直接拿来用即可

其他地方就是普通的RecyclerView

展开效果（未完成）

本来想实现卡片的展开功能的，找了不少资料。暂时还是不会 medium.com/@akshay.shi… stackoverflow.com/questions/2… 感觉比较好的参考资料。以后学

实践反馈

CardView中的RecyclerView item数量变多

在不做Fragment切换的情况下，RecyclerView的Item变多了？？本来应该只有4个的，上面的gif可以看到变成了5个。（变成5个而是因为我设置了卡片里最多显示五行item）实践了之后，发现这两个item的数量是共通的！傻子操作，RecyclerView里面，item的东西不要，不要，不要放置为成员变量！

使用Fragment之后，切换Fragment之后 item的数量变多

设置log输出如下：

public class FolderListFragment extends Fragment{
    private static final String TAG = "FolderListFragment";
    
    RecyclerView recyclerView;
    ArrayList<Folder_Recycler_item> items = new ArrayList<>();
    Folder_RecyclerList_Adapter adapter;

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        Log.d(TAG, "onCreate: ");
        initItems();
        adapter = new Folder_RecyclerList_Adapter(items, getActivity());
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        Log.d(TAG, "onCreateView: ");
        Log.d(TAG, "" + items.size());
        //配置recyclerView
        recyclerView = view.findViewById(R.id.FolderListFragment_RecyclerView);
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(getActivity(), LinearLayoutManager.VERTICAL, false);
        recyclerView.setLayoutManager(linearLayoutManager);
        recyclerView.setAdapter(adapter);
        Log.d(TAG, "onCreateView完毕" + items.size());
        return view;
    }
}

复制代码

05-16 10:00:21.512 3166-3166/? D/FolderListFragment: onCreate: 
05-16 10:00:21.522 3166-3166/? D/FolderListFragment: onCreateView: 
05-16 10:00:21.522 3166-3166/? D/FolderListFragment: 2
05-16 10:00:21.571 3166-3166/? D/FolderListFragment: onCreateView完毕2
05-16 10:00:25.509 3166-3166/com.example.project_practice D/FolderListFragment: onCreate: 
05-16 10:00:25.509 3166-3166/com.example.project_practice D/FolderListFragment: onCreateView: 
05-16 10:00:25.509 3166-3166/com.example.project_practice D/FolderListFragment: 4
05-16 10:00:25.510 3166-3166/com.example.project_practice D/FolderListFragment: onCreateView完毕4
复制代码

吃了一惊，居然调用了onCreate()方法？？？之前学习Fragment的休眠什么的时候不是说不会调用onCreate()方法吗？而且调用onCreate()方法的时候明显是在它自己的数据没有丢弃的时候！不然不会从2加到4？我的知识出现了问题啊！要重新学习关于重新激活的调用顺序。

解决办法很简单，但是这就是正确的解决办法吗？去学习一下生命周期吧！

        if (items.size() == 0) {
            initItems();
        }
复制代码

设置底部菜单栏的不透明

这个很简单，设置个background

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/BottomNavigation"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:layout_gravity="bottom"
        app:menu="@menu/navigation_bottom"
        android:background="@color/grey_300"
        ></android.support.design.widget.BottomNavigationView>
复制代码

结果就导致遮住了底部？这是因为咱们的布局是 CoordinatorLayout是个 FrameLayout布局。去搜了一下如何解决 FrameLayout的布局遮挡问题，解决方法是设置 margin属性

<?xml version="1.0" encoding="utf-8"?>
<!--底部导航、卡片集布局、悬浮Button-->
<android.support.design.widget.CoordinatorLayout

    <FrameLayout
        android:layout_marginBottom="56dp"
        />

    <android.support.design.widget.BottomNavigationView
        android:layout_height="56dp"
        />

</android.support.design.widget.CoordinatorLayout>
复制代码