【0109】【項目實戰】-【Android通用框架設計與完整電商APP開發】-【9】【 主界面-商品分類開發(多布局Section RecyclerView)】


1. 分類頁面結構解析和開發

【說明】底部的是一個大的容器fragment,左邊的是一個fragment,右邊是一個fragment;

【說明】分類的界面的內容分為兩類,左邊的是list,右邊是與list對應的詳情頁面;因此,在文件夾分類的時候也是:content詳情頁面;list:分類頁面;

1.1 布局的創建

 

【源碼】layout/delegate_sort.xml

 

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <android.support.v7.widget.LinearLayoutCompat xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical">
 6 
 7     <android.support.v7.widget.Toolbar
 8         android:layout_width="match_parent"
 9         android:layout_height="60dp"
10         android:background="@android:color/holo_orange_dark"
11         android:gravity="center">
12 
13         <android.support.v7.widget.AppCompatTextView
14             android:layout_width="match_parent"
15             android:layout_height="match_parent"
16             android:gravity="center"
17             android:paddingTop="6dp"
18             android:text="分類"
19             android:textColor="@android:color/white"
20             android:textSize="20sp" />
21 
22     </android.support.v7.widget.Toolbar>
23 
24     <android.support.v7.widget.LinearLayoutCompat
25         android:layout_width="match_parent"
26         android:layout_height="match_parent"
27         android:background="@color/app_background"
28         android:baselineAligned="true"
29         android:orientation="horizontal">
30 
31         <android.support.v7.widget.ContentFrameLayout
32             android:id="@+id/vertical_list_container"
33             android:layout_width="0dp"
34             android:layout_height="match_parent"
35             android:layout_weight="1" />
36 
37         <android.support.v7.widget.ContentFrameLayout
38             android:id="@+id/sort_content_container"
39             android:layout_width="0dp"
40             android:layout_height="match_parent"
41             android:layout_marginLeft="8dp"
42             android:layout_marginRight="8dp"
43             android:layout_weight="2.5" />
44 
45     </android.support.v7.widget.LinearLayoutCompat>
46 
47 </android.support.v7.widget.LinearLayoutCompat>

 

1.2 布局的邏輯組合

【說明】將邏輯寫在onLazyInitView中,加載的時機是在點擊分類按鈕之后才會加載;

 如果寫在onCreateView中,則會打開APP的時候就會加載;

 

【左側列表】

 

【內容詳情頁】

 

2. 分類左側列表數據解析與UI呈現

【說明】將整個data取出,然后分門別類的將其解析成為一個個的bean數據;

 

2.1 數據的轉換

 

【增加分類的類別】

 

2.2【完善list列表邏輯】

 

【數據適配器】

 

【list的布局】

 

【點擊事件的添加】

 

3.多布局Section列表實現與分類列表點擊事件

【contentfragment】

【初始化數據的框架】

【bean的書寫】一個id下的內容組成了一個bean;

[單個item的bean]

[id對應的一個contentSection詳情數據]

【數據請求】

【適配器的設置】

 

【完善adapter】

 

【適配器的使用】

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM