【0108】【项目实战】-【Android通用框架设计与完整电商APP开发】-【8】【主界面-首页UI与数据解析器开发（RecyclerView）】

回到顶部

1.创建首页UI

【说明】

【1】需要包含沉浸式效果，逐渐透明变为显示；

【2】主页内容的滑动显示；

【3】使用新的布局：coordinatorLayout；

【4】包含下拉刷新，上拉加载更多；

回到顶部

1.1 检查依赖是否存在

回到顶部

1.2 布局

【布局源码】layout/delegate_index.xml

【0108】【项目实战】-【Android通用框架设计与完整电商APP开发】-【8】【主界面-首页UI与数据解析器开发（RecyclerView）】

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     xmlns:app="http://schemas.android.com/apk/res-auto"
 4     android:layout_width="match_parent"
 5     android:layout_height="match_parent"
 6     android:orientation="vertical">
 7 
 8     <!--下拉刷新-->
 9     <android.support.v4.widget.SwipeRefreshLayout
10         android:id="@+id/srl_index"
11         android:layout_width="match_parent"
12         android:layout_height="match_parent">
13 
14         <android.support.v7.widget.RecyclerView
15             android:id="@+id/rv_index"
16             android:layout_width="match_parent"
17             android:layout_height="match_parent" />
18     </android.support.v4.widget.SwipeRefreshLayout>
19 
20     <!--toolBar最好写在下面，否则新的内容显示的时候会将其遮住-->
21     <!--写为透明色，才会逐渐显示android:background="@android:color/transparent"-->
22     <android.support.v7.widget.Toolbar
23         android:id="@+id/tb_index"
24         android:layout_width="match_parent"
25         android:layout_height="80dp"
26         android:background="@android:color/transparent"
27         app:layout_behavior="com.flj.latte.ec.main.index.TranslucentBehavior">
28 
29         <android.support.v7.widget.LinearLayoutCompat
30             android:layout_width="match_parent"
31             android:layout_height="match_parent"
32             android:orientation="horizontal">
33             <!--文字-->
34             <com.joanzapata.iconify.widget.IconTextView
35                 android:id="@+id/icon_index_scan"
36                 android:layout_width="0dp"
37                 android:layout_height="match_parent"
38                 android:layout_gravity="left"
39                 android:layout_weight="1"
40                 android:gravity="center"
41                 android:paddingRight="10dp"
42                 android:text="{icon-scan}"
43                 android:textColor="@android:color/white"
44                 android:textSize="25sp" />
45             <!--搜索框-->
46             <!--android:layout_weight="4"：占据2/3-->
47             <android.support.v7.widget.AppCompatEditText
48                 android:id="@+id/et_search_view"
49                 android:layout_width="0dp"
50                 android:layout_height="40dp"
51                 android:layout_gravity="center"
52                 android:layout_weight="4"
53                 android:background="@android:color/white"
54                 android:gravity="center_vertical"
55                 android:hint="搜索"
56                 android:paddingLeft="20dp" />
57 
58             <com.joanzapata.iconify.widget.IconTextView
59                 android:id="@+id/icon_index_message"
60                 android:layout_width="0dp"
61                 android:layout_height="match_parent"
62                 android:layout_gravity="right"
63                 android:layout_weight="1"
64                 android:gravity="center"
65                 android:paddingLeft="10dp"
66                 android:text="{fa-bullhorn}"
67                 android:textColor="@android:color/white"
68                 android:textSize="25sp" />
69 
70         </android.support.v7.widget.LinearLayoutCompat>
71 
72     </android.support.v7.widget.Toolbar>
73 
74 </android.support.design.widget.CoordinatorLayout>