Today I want to share with you an example of Expandable List using ListAdapter
+ Data Binding and multi-type in RecyclerView
.
You can refer to my source code here !
I’m using Gradle 6.5 and Android Studio 4.1 .
This example will display a list of Sections, when we tap on a Section it will expand and display its Items.
Dependencies
First we will need some dependencies in the module’s build.gradle
like so:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | dependencies <span class="token punctuation">{</span> implementation <span class="token string">'org.jetbrains.kotlin:kotlin-stdlib:1.4.10'</span> implementation <span class="token string">'androidx.core:core-ktx:1.3.2'</span> implementation <span class="token string">'androidx.appcompat:appcompat:1.2.0'</span> implementation <span class="token string">'com.google.android.material:material:1.2.1'</span> implementation <span class="token string">'androidx.constraintlayout:constraintlayout:2.0.2'</span> implementation <span class="token string">'androidx.activity:activity-ktx:1.1.0'</span> implementation <span class="token string">'androidx.lifecycle:lifecycle-viewmodel-ktx:2.2.0'</span> implementation <span class="token string">'androidx.recyclerview:recyclerview:1.1.0'</span> implementation <span class="token string">'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0'</span> <span class="token punctuation">}</span> |
Section Model
We will have a Section
model containing the following information:
1 2 3 4 5 6 7 8 9 10 11 12 | <span class="token keyword">data</span> <span class="token keyword">class</span> <span class="token function">Section</span> <span class="token punctuation">(</span> <span class="token keyword">val</span> id <span class="token operator">:</span> Int <span class="token punctuation">,</span> <span class="token keyword">val</span> name <span class="token operator">:</span> String <span class="token punctuation">,</span> <span class="token keyword">val</span> isExpandable <span class="token operator">:</span> Boolean <span class="token punctuation">,</span> <span class="token keyword">val</span> items <span class="token operator">:</span> List <span class="token operator"><</span> Item <span class="token operator">></span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">data</span> <span class="token keyword">class</span> <span class="token function">Item</span> <span class="token punctuation">(</span> <span class="token keyword">val</span> id <span class="token operator">:</span> Int <span class="token punctuation">,</span> <span class="token keyword">val</span> name <span class="token operator">:</span> String <span class="token punctuation">)</span> <span class="token punctuation">}</span> |
You pay attention to the following 2 properties:
isExpandable
: DefinesisExpandable
state.true
if minimizing,false
if expanding.items
: The list of items to display when the list expands.
Here I encourage to use data class
to facilitate compare in DiffUtil
later.
ViewHolder
Next, we will have 2 ViewHolder
to display for the Section
and its Item
:
SectionViewHolder
I will create a layout item_section.xml
containing a TextView
to display the name of the Section and an AppCompatImageView
to display the expand icon, which changes according to isExpandable
in the Section
model.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | <span class="token prolog"><?xml version="1.0" encoding="utf-8"?></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> layout</span> <span class="token attr-name"><span class="token namespace">xmlns:</span> android</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/apk/res/android <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">xmlns:</span> app</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/apk/res-auto <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">xmlns:</span> tools</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/tools <span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> data</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> variable</span> <span class="token attr-name">name</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> section <span class="token punctuation">"</span></span> <span class="token attr-name">type</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> com.example.expandable_list_adapter_example.Section <span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> data</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> LinearLayout</span> <span class="token attr-name"><span class="token namespace">android:</span> layout_width</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> match_parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_height</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> wrap_content <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> background</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> ?selectableItemBackground <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> gravity</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> center <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> orientation</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> horizontal <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> padding</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 16dp <span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> TextView</span> <span class="token attr-name"><span class="token namespace">android:</span> layout_width</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 0dp <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_height</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> wrap_content <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_weight</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 1 <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> text</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @{section.name} <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> textAppearance</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @style/TextAppearance.AppCompat.Medium <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> textStyle</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> bold <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">tools:</span> text</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> Section 0 <span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> androidx.appcompat.widget.AppCompatImageView</span> <span class="token attr-name"><span class="token namespace">android:</span> layout_width</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> wrap_content <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_height</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> wrap_content <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> sectionExpandable</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @{section.expandable} <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">tools:</span> srcCompat</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @drawable/ic_baseline_expand_more_24 <span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> LinearLayout</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> layout</span> <span class="token punctuation">></span></span> |
I have added a BindingAdapter
is sectionExpandable
to update icons expand when isExpandable
change.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | <span class="token keyword">class</span> <span class="token function">SectionViewHolder</span> <span class="token punctuation">(</span> <span class="token keyword">private</span> <span class="token keyword">val</span> binding <span class="token operator">:</span> ItemSectionBinding <span class="token punctuation">,</span> <span class="token keyword">private</span> <span class="token keyword">val</span> onSectionClickListener <span class="token operator">:</span> <span class="token punctuation">(</span> Section <span class="token punctuation">)</span> <span class="token operator">-></span> Unit <span class="token punctuation">)</span> <span class="token operator">:</span> RecyclerView <span class="token punctuation">.</span> <span class="token function">ViewHolder</span> <span class="token punctuation">(</span> binding <span class="token punctuation">.</span> root <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">init</span> <span class="token punctuation">{</span> binding <span class="token punctuation">.</span> root <span class="token punctuation">.</span> <span class="token function">setOnSingleClickListener</span> <span class="token punctuation">{</span> binding <span class="token punctuation">.</span> section <span class="token operator">?</span> <span class="token punctuation">.</span> <span class="token function">let</span> <span class="token punctuation">{</span> <span class="token function">onSectionClickListener</span> <span class="token punctuation">(</span> it <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">fun</span> <span class="token function">bind</span> <span class="token punctuation">(</span> section <span class="token operator">:</span> Section <span class="token punctuation">)</span> <span class="token punctuation">{</span> binding <span class="token punctuation">.</span> section <span class="token operator">=</span> section <span class="token punctuation">}</span> <span class="token keyword">object</span> Binding <span class="token punctuation">{</span> <span class="token annotation builtin">@JvmStatic</span> <span class="token annotation builtin">@BindingAdapter</span> <span class="token punctuation">(</span> <span class="token string">"sectionExpandable"</span> <span class="token punctuation">)</span> <span class="token keyword">fun</span> <span class="token function">setSectionExpandable</span> <span class="token punctuation">(</span> imageView <span class="token operator">:</span> AppCompatImageView <span class="token punctuation">,</span> isExpandable <span class="token operator">:</span> Boolean <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span> isExpandable <span class="token punctuation">)</span> <span class="token punctuation">{</span> imageView <span class="token punctuation">.</span> <span class="token function">setImageResource</span> <span class="token punctuation">(</span> R <span class="token punctuation">.</span> drawable <span class="token punctuation">.</span> ic_baseline_expand_more_24 <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> imageView <span class="token punctuation">.</span> <span class="token function">setImageResource</span> <span class="token punctuation">(</span> R <span class="token punctuation">.</span> drawable <span class="token punctuation">.</span> ic_baseline_expand_less_24 <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
To display Section
Item
, I will build another ViewHodder
:
SectionItemViewHolder
For Section Item, I only need a TextView
to display the name of that Item.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <span class="token prolog"><?xml version="1.0" encoding="utf-8"?></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> layout</span> <span class="token attr-name"><span class="token namespace">xmlns:</span> android</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/apk/res/android <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">xmlns:</span> tools</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/tools <span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> data</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> variable</span> <span class="token attr-name">name</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> sectionItem <span class="token punctuation">"</span></span> <span class="token attr-name">type</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> com.example.expandable_list_adapter_example.Section.Item <span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> data</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> TextView</span> <span class="token attr-name"><span class="token namespace">android:</span> layout_width</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> match_parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_height</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> wrap_content <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> paddingStart</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 32dp <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> paddingTop</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 16dp <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> paddingEnd</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 16dp <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> paddingBottom</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 16dp <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> text</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @{sectionItem.name} <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> textAppearance</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @style/TextAppearance.AppCompat.Small <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">tools:</span> text</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> Item 0 <span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> layout</span> <span class="token punctuation">></span></span> |
1 2 3 4 5 6 7 8 9 | <span class="token keyword">class</span> <span class="token function">SectionItemViewHolder</span> <span class="token punctuation">(</span> <span class="token keyword">private</span> <span class="token keyword">val</span> binding <span class="token operator">:</span> ItemSectionItemBinding <span class="token punctuation">)</span> <span class="token operator">:</span> RecyclerView <span class="token punctuation">.</span> <span class="token function">ViewHolder</span> <span class="token punctuation">(</span> binding <span class="token punctuation">.</span> root <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">fun</span> <span class="token function">bind</span> <span class="token punctuation">(</span> sectionItem <span class="token operator">:</span> Section <span class="token punctuation">.</span> Item <span class="token punctuation">)</span> <span class="token punctuation">{</span> binding <span class="token punctuation">.</span> sectionItem <span class="token operator">=</span> sectionItem <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
ListAdapter
Now, we will handle ListAdapter
to integrate with the above ViewHolder
.
The reason I use ListAdapter
is that it integrates DiffUtil to compare the differences of the submitted list. You can refer to here .
First, we will need to give it a DiffUtil.ItemCallback
like this:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 | <span class="token keyword">class</span> <span class="token function">MainListAdapter</span> <span class="token punctuation">(</span> <span class="token keyword">private</span> <span class="token keyword">val</span> onSectionClickListener <span class="token operator">:</span> <span class="token punctuation">(</span> Section <span class="token punctuation">)</span> <span class="token operator">-></span> Unit <span class="token punctuation">)</span> <span class="token operator">:</span> ListAdapter <span class="token operator"><</span> Any <span class="token punctuation">,</span> RecyclerView <span class="token punctuation">.</span> ViewHolder <span class="token operator">></span> <span class="token punctuation">(</span> DIFF_CALLBACK <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">companion</span> <span class="token keyword">object</span> <span class="token punctuation">{</span> <span class="token keyword">private</span> <span class="token keyword">val</span> DIFF_CALLBACK <span class="token operator">=</span> <span class="token keyword">object</span> <span class="token operator">:</span> DiffUtil <span class="token punctuation">.</span> ItemCallback <span class="token operator"><</span> Any <span class="token operator">></span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">areItemsTheSame</span> <span class="token punctuation">(</span> oldItem <span class="token operator">:</span> Any <span class="token punctuation">,</span> newItem <span class="token operator">:</span> Any <span class="token punctuation">)</span> <span class="token operator">:</span> Boolean <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token keyword">when</span> <span class="token punctuation">{</span> oldItem <span class="token keyword">is</span> Section <span class="token operator">&&</span> newItem <span class="token keyword">is</span> Section <span class="token operator">-></span> <span class="token punctuation">{</span> oldItem <span class="token punctuation">.</span> id <span class="token operator">==</span> newItem <span class="token punctuation">.</span> id <span class="token punctuation">}</span> oldItem <span class="token keyword">is</span> Section <span class="token punctuation">.</span> Item <span class="token operator">&&</span> newItem <span class="token keyword">is</span> Section <span class="token punctuation">.</span> Item <span class="token operator">-></span> <span class="token punctuation">{</span> oldItem <span class="token punctuation">.</span> id <span class="token operator">==</span> newItem <span class="token punctuation">.</span> id <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token operator">-></span> <span class="token boolean">false</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token annotation builtin">@SuppressLint</span> <span class="token punctuation">(</span> <span class="token string">"DiffUtilEquals"</span> <span class="token punctuation">)</span> <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">areContentsTheSame</span> <span class="token punctuation">(</span> oldItem <span class="token operator">:</span> Any <span class="token punctuation">,</span> newItem <span class="token operator">:</span> Any <span class="token punctuation">)</span> <span class="token operator">:</span> Boolean <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token keyword">when</span> <span class="token punctuation">{</span> oldItem <span class="token keyword">is</span> Section <span class="token operator">&&</span> newItem <span class="token keyword">is</span> Section <span class="token operator">-></span> <span class="token punctuation">{</span> oldItem <span class="token operator">==</span> newItem <span class="token punctuation">}</span> oldItem <span class="token keyword">is</span> Section <span class="token punctuation">.</span> Item <span class="token operator">&&</span> newItem <span class="token keyword">is</span> Section <span class="token punctuation">.</span> Item <span class="token operator">-></span> <span class="token punctuation">{</span> oldItem <span class="token operator">==</span> newItem <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token operator">-></span> <span class="token boolean">false</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
In the Adapter there will be 2 types, one for Section and one for Section Item.
To be able to display these 2 types in RecyclerView
, the Adapter needs to define them through override getItemViewType(_: Int) : Int
method.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <span class="token keyword">class</span> <span class="token function">MainListAdapter</span> <span class="token punctuation">(</span> <span class="token keyword">private</span> <span class="token keyword">val</span> onSectionClickListener <span class="token operator">:</span> <span class="token punctuation">(</span> Section <span class="token punctuation">)</span> <span class="token operator">-></span> Unit <span class="token punctuation">)</span> <span class="token operator">:</span> ListAdapter <span class="token operator"><</span> Any <span class="token punctuation">,</span> RecyclerView <span class="token punctuation">.</span> ViewHolder <span class="token operator">></span> <span class="token punctuation">(</span> DIFF_CALLBACK <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">getItemViewType</span> <span class="token punctuation">(</span> position <span class="token operator">:</span> Int <span class="token punctuation">)</span> <span class="token operator">:</span> Int <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token keyword">when</span> <span class="token punctuation">(</span> <span class="token function">getItem</span> <span class="token punctuation">(</span> position <span class="token punctuation">)</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">is</span> Section <span class="token operator">-></span> <span class="token punctuation">{</span> ViewType <span class="token punctuation">.</span> SECTION <span class="token punctuation">}</span> <span class="token keyword">is</span> Section <span class="token punctuation">.</span> Item <span class="token operator">-></span> <span class="token punctuation">{</span> ViewType <span class="token punctuation">.</span> SECTION_ITEM <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token operator">-></span> <span class="token keyword">super</span> <span class="token punctuation">.</span> <span class="token function">getItemViewType</span> <span class="token punctuation">(</span> position <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">object</span> ViewType <span class="token punctuation">{</span> <span class="token keyword">const</span> <span class="token keyword">val</span> SECTION <span class="token operator">=</span> <span class="token number">101</span> <span class="token keyword">const</span> <span class="token keyword">val</span> SECTION_ITEM <span class="token operator">=</span> <span class="token number">102</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
Next, we will create ViewHolder
generals corresponding to the defined ViewType and bind data for them.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | <span class="token keyword">class</span> <span class="token function">MainListAdapter</span> <span class="token punctuation">(</span> <span class="token keyword">private</span> <span class="token keyword">val</span> onSectionClickListener <span class="token operator">:</span> <span class="token punctuation">(</span> Section <span class="token punctuation">)</span> <span class="token operator">-></span> Unit <span class="token punctuation">)</span> <span class="token operator">:</span> ListAdapter <span class="token operator"><</span> Any <span class="token punctuation">,</span> RecyclerView <span class="token punctuation">.</span> ViewHolder <span class="token operator">></span> <span class="token punctuation">(</span> DIFF_CALLBACK <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">onCreateViewHolder</span> <span class="token punctuation">(</span> parent <span class="token operator">:</span> ViewGroup <span class="token punctuation">,</span> viewType <span class="token operator">:</span> Int <span class="token punctuation">)</span> <span class="token operator">:</span> RecyclerView <span class="token punctuation">.</span> <span class="token function">ViewHolder</span> <span class="token punctuation">{</span> <span class="token keyword">val</span> inflater <span class="token operator">=</span> LayoutInflater <span class="token punctuation">.</span> <span class="token function">from</span> <span class="token punctuation">(</span> parent <span class="token punctuation">.</span> context <span class="token punctuation">)</span> <span class="token keyword">return</span> <span class="token keyword">when</span> <span class="token punctuation">(</span> viewType <span class="token punctuation">)</span> <span class="token punctuation">{</span> ViewType <span class="token punctuation">.</span> SECTION <span class="token operator">-></span> <span class="token punctuation">{</span> <span class="token keyword">val</span> itemSectionBinding <span class="token operator">=</span> ItemSectionBinding <span class="token punctuation">.</span> <span class="token function">inflate</span> <span class="token punctuation">(</span> inflater <span class="token punctuation">,</span> parent <span class="token punctuation">,</span> <span class="token boolean">false</span> <span class="token punctuation">)</span> <span class="token function">SectionViewHolder</span> <span class="token punctuation">(</span> itemSectionBinding <span class="token punctuation">,</span> onSectionClickListener <span class="token punctuation">)</span> <span class="token punctuation">}</span> ViewType <span class="token punctuation">.</span> SECTION_ITEM <span class="token operator">-></span> <span class="token punctuation">{</span> <span class="token keyword">val</span> itemSectionItemBinding <span class="token operator">=</span> ItemSectionItemBinding <span class="token punctuation">.</span> <span class="token function">inflate</span> <span class="token punctuation">(</span> inflater <span class="token punctuation">,</span> parent <span class="token punctuation">,</span> <span class="token boolean">false</span> <span class="token punctuation">)</span> <span class="token function">SectionItemViewHolder</span> <span class="token punctuation">(</span> itemSectionItemBinding <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token operator">-></span> <span class="token keyword">throw</span> <span class="token punctuation">(</span> <span class="token function">Throwable</span> <span class="token punctuation">(</span> <span class="token string">"View type not matching"</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">onBindViewHolder</span> <span class="token punctuation">(</span> holder <span class="token operator">:</span> RecyclerView <span class="token punctuation">.</span> ViewHolder <span class="token punctuation">,</span> position <span class="token operator">:</span> Int <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">when</span> <span class="token punctuation">(</span> <span class="token keyword">val</span> item <span class="token operator">=</span> <span class="token function">getItem</span> <span class="token punctuation">(</span> position <span class="token punctuation">)</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">is</span> Section <span class="token operator">-></span> <span class="token punctuation">(</span> holder <span class="token keyword">as</span> <span class="token operator">?</span> SectionViewHolder <span class="token punctuation">)</span> <span class="token operator">?</span> <span class="token punctuation">.</span> <span class="token function">bind</span> <span class="token punctuation">(</span> item <span class="token punctuation">)</span> <span class="token keyword">is</span> Section <span class="token punctuation">.</span> Item <span class="token operator">-></span> <span class="token punctuation">(</span> holder <span class="token keyword">as</span> <span class="token operator">?</span> SectionItemViewHolder <span class="token punctuation">)</span> <span class="token operator">?</span> <span class="token punctuation">.</span> <span class="token function">bind</span> <span class="token punctuation">(</span> item <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
MainViewModel
Now, I will use the ViewModel to process the data for the Section as well as update the Section list as there is action expanding.
MainViewModel
class
will look like this:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | <span class="token keyword">class</span> MainViewModel <span class="token operator">:</span> <span class="token function">ViewModel</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">private</span> <span class="token keyword">var</span> sectionList <span class="token operator">:</span> List <span class="token operator"><</span> Section <span class="token operator">></span> <span class="token operator">=</span> <span class="token function">listOf</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token keyword">val</span> sectionListLiveData <span class="token operator">=</span> MutableLiveData <span class="token operator"><</span> List <span class="token operator"><</span> Section <span class="token operator">></span> <span class="token operator">></span> <span class="token punctuation">(</span> sectionList <span class="token punctuation">)</span> <span class="token keyword">val</span> isRefreshing <span class="token operator">=</span> MutableLiveData <span class="token operator"><</span> Boolean <span class="token operator">></span> <span class="token punctuation">(</span> <span class="token boolean">false</span> <span class="token punctuation">)</span> <span class="token keyword">fun</span> <span class="token function">refresh</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> isRefreshing <span class="token punctuation">.</span> value <span class="token operator">=</span> <span class="token boolean">true</span> <span class="token function">getSectionList</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">fun</span> <span class="token function">getSectionList</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> sectionList <span class="token operator">=</span> <span class="token function">fakeSectionList</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> sectionListLiveData <span class="token punctuation">.</span> value <span class="token operator">=</span> sectionList isRefreshing <span class="token punctuation">.</span> value <span class="token operator">=</span> <span class="token boolean">false</span> <span class="token punctuation">}</span> <span class="token keyword">fun</span> <span class="token function">expand</span> <span class="token punctuation">(</span> sectionId <span class="token operator">:</span> Int <span class="token punctuation">)</span> <span class="token punctuation">{</span> sectionList <span class="token operator">=</span> sectionList <span class="token punctuation">.</span> <span class="token function">map</span> <span class="token punctuation">{</span> section <span class="token operator">-></span> <span class="token keyword">if</span> <span class="token punctuation">(</span> section <span class="token punctuation">.</span> id <span class="token operator">==</span> sectionId <span class="token punctuation">)</span> <span class="token punctuation">{</span> section <span class="token punctuation">.</span> <span class="token function">copy</span> <span class="token punctuation">(</span> isExpandable <span class="token operator">=</span> <span class="token operator">!</span> section <span class="token punctuation">.</span> isExpandable <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">else</span> <span class="token punctuation">{</span> section <span class="token punctuation">.</span> <span class="token function">copy</span> <span class="token punctuation">(</span> isExpandable <span class="token operator">=</span> <span class="token boolean">true</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> sectionListLiveData <span class="token punctuation">.</span> value <span class="token operator">=</span> sectionList <span class="token punctuation">}</span> <span class="token keyword">private</span> <span class="token keyword">fun</span> <span class="token function">fakeSectionList</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token operator">:</span> List <span class="token operator"><</span> Section <span class="token operator">></span> <span class="token punctuation">{</span> <span class="token keyword">val</span> sectionList <span class="token operator">:</span> MutableList <span class="token operator"><</span> Section <span class="token operator">></span> <span class="token operator">=</span> <span class="token function">mutableListOf</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token function">repeat</span> <span class="token punctuation">(</span> Random <span class="token punctuation">.</span> <span class="token function">nextInt</span> <span class="token punctuation">(</span> <span class="token number">0</span> <span class="token punctuation">,</span> <span class="token number">100</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> index <span class="token operator">-></span> <span class="token keyword">val</span> section <span class="token operator">=</span> <span class="token function">Section</span> <span class="token punctuation">(</span> id <span class="token operator">=</span> index <span class="token punctuation">,</span> name <span class="token operator">=</span> <span class="token string">"Section <span class="token interpolation variable">$index</span> "</span> <span class="token punctuation">,</span> items <span class="token operator">=</span> <span class="token function">fakeSectionItemList</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">,</span> isExpandable <span class="token operator">=</span> <span class="token boolean">true</span> <span class="token punctuation">)</span> sectionList <span class="token punctuation">.</span> <span class="token function">add</span> <span class="token punctuation">(</span> section <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">return</span> sectionList <span class="token punctuation">}</span> <span class="token keyword">private</span> <span class="token keyword">fun</span> <span class="token function">fakeSectionItemList</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token operator">:</span> List <span class="token operator"><</span> Section <span class="token punctuation">.</span> Item <span class="token operator">></span> <span class="token punctuation">{</span> <span class="token keyword">val</span> sectionItemList <span class="token operator">:</span> MutableList <span class="token operator"><</span> Section <span class="token punctuation">.</span> Item <span class="token operator">></span> <span class="token operator">=</span> <span class="token function">mutableListOf</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token function">repeat</span> <span class="token punctuation">(</span> Random <span class="token punctuation">.</span> <span class="token function">nextInt</span> <span class="token punctuation">(</span> <span class="token number">0</span> <span class="token punctuation">,</span> <span class="token number">10</span> <span class="token punctuation">)</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> index <span class="token operator">-></span> <span class="token keyword">val</span> sectionItem <span class="token operator">=</span> Section <span class="token punctuation">.</span> <span class="token function">Item</span> <span class="token punctuation">(</span> id <span class="token operator">=</span> index <span class="token punctuation">,</span> name <span class="token operator">=</span> <span class="token string">"Item <span class="token interpolation variable">$index</span> "</span> <span class="token punctuation">)</span> sectionItemList <span class="token punctuation">.</span> <span class="token function">add</span> <span class="token punctuation">(</span> sectionItem <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">return</span> sectionItemList <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
getSectionList()
: Random a Section listexpand(_: Int)
: Updates the status when a section expading.refresh()
: Refresh the Section list.
Finally we will apply all of them to RecyclerView
in MainActivity
.
MainActivity
activity_main.xml
In activity_main.xml
layout, I only have a RecyclerView
and SwipeRefreshLayout
serving to refresh the Section list.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | <span class="token prolog"><?xml version="1.0" encoding="utf-8"?></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> layout</span> <span class="token attr-name"><span class="token namespace">xmlns:</span> android</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/apk/res/android <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">xmlns:</span> app</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/apk/res-auto <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">xmlns:</span> tools</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> http://schemas.android.com/tools <span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> data</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> variable</span> <span class="token attr-name">name</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> viewModel <span class="token punctuation">"</span></span> <span class="token attr-name">type</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> com.example.expandable_list_adapter_example.MainViewModel <span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> data</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> androidx.constraintlayout.widget.ConstraintLayout</span> <span class="token attr-name"><span class="token namespace">android:</span> layout_width</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> match_parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_height</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> match_parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">tools:</span> context</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> .MainActivity <span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> androidx.swiperefreshlayout.widget.SwipeRefreshLayout</span> <span class="token attr-name"><span class="token namespace">android:</span> id</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @+id/swipeRefreshLayout <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_width</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 0dp <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_height</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> 0dp <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> layout_constraintBottom_toBottomOf</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> layout_constraintLeft_toLeftOf</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> layout_constraintRight_toRightOf</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> layout_constraintTop_toTopOf</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> onRefreshListener</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @{() -> viewModel.refresh()} <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> refreshing</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @{viewModel.isRefreshing()} <span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span> androidx.recyclerview.widget.RecyclerView</span> <span class="token attr-name"><span class="token namespace">android:</span> id</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @+id/recyclerView <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_width</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> match_parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">android:</span> layout_height</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> match_parent <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> layoutManager</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> LinearLayoutManager <span class="token punctuation">"</span></span> <span class="token attr-name"><span class="token namespace">app:</span> sectionList</span> <span class="token attr-value"><span class="token punctuation">=</span> <span class="token punctuation">"</span> @{viewModel.sectionListLiveData} <span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> androidx.swiperefreshlayout.widget.SwipeRefreshLayout</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> androidx.constraintlayout.widget.ConstraintLayout</span> <span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span> layout</span> <span class="token punctuation">></span></span> |
app:onRefreshListener="@{() -> viewModel.refresh()}"
receives the refresh action from the user and calls therefresh()
method.app:refreshing="@{viewModel.isRefreshing()}"
shows loading icon underisRefreshing()
.app:sectionList="@{viewModel.sectionListLiveData}"
is aBindingAdapter
I defined inMainActivity.Binding
, to submit a new list whensectionListLiveData
changed.
MainActivity
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 | <span class="token keyword">class</span> MainActivity <span class="token operator">:</span> <span class="token function">AppCompatActivity</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">private</span> <span class="token keyword">lateinit</span> <span class="token keyword">var</span> binding <span class="token operator">:</span> ActivityMainBinding <span class="token keyword">private</span> <span class="token keyword">val</span> viewModel <span class="token operator">:</span> MainViewModel <span class="token keyword">by</span> <span class="token function">viewModels</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">onCreate</span> <span class="token punctuation">(</span> savedInstanceState <span class="token operator">:</span> Bundle <span class="token operator">?</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">super</span> <span class="token punctuation">.</span> <span class="token function">onCreate</span> <span class="token punctuation">(</span> savedInstanceState <span class="token punctuation">)</span> binding <span class="token operator">=</span> DataBindingUtil <span class="token punctuation">.</span> <span class="token function">setContentView</span> <span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">,</span> R <span class="token punctuation">.</span> layout <span class="token punctuation">.</span> activity_main <span class="token punctuation">)</span> binding <span class="token punctuation">.</span> viewModel <span class="token operator">=</span> viewModel binding <span class="token punctuation">.</span> lifecycleOwner <span class="token operator">=</span> <span class="token keyword">this</span> binding <span class="token punctuation">.</span> <span class="token function">executePendingBindings</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> binding <span class="token punctuation">.</span> recyclerView <span class="token punctuation">.</span> adapter <span class="token operator">=</span> <span class="token function">MainListAdapter</span> <span class="token punctuation">(</span> onSectionClickListener <span class="token operator">=</span> <span class="token punctuation">{</span> section <span class="token operator">-></span> viewModel <span class="token punctuation">.</span> <span class="token function">expand</span> <span class="token punctuation">(</span> section <span class="token punctuation">.</span> id <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> viewModel <span class="token punctuation">.</span> <span class="token function">getSectionList</span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token keyword">object</span> Binding <span class="token punctuation">{</span> <span class="token annotation builtin">@JvmStatic</span> <span class="token annotation builtin">@BindingAdapter</span> <span class="token punctuation">(</span> <span class="token string">"sectionList"</span> <span class="token punctuation">)</span> <span class="token keyword">fun</span> <span class="token function">setSectionList</span> <span class="token punctuation">(</span> recyclerView <span class="token operator">:</span> RecyclerView <span class="token punctuation">,</span> sectionList <span class="token operator">:</span> List <span class="token operator"><</span> Section <span class="token operator">></span> <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">val</span> list <span class="token operator">=</span> mutableListOf <span class="token operator"><</span> Any <span class="token operator">></span> <span class="token punctuation">(</span> <span class="token punctuation">)</span> <span class="token keyword">val</span> mainListAdapter <span class="token operator">=</span> recyclerView <span class="token punctuation">.</span> adapter <span class="token keyword">as</span> <span class="token operator">?</span> MainListAdapter sectionList <span class="token punctuation">.</span> <span class="token function">forEach</span> <span class="token punctuation">{</span> section <span class="token operator">-></span> list <span class="token punctuation">.</span> <span class="token function">add</span> <span class="token punctuation">(</span> section <span class="token punctuation">)</span> <span class="token keyword">if</span> <span class="token punctuation">(</span> <span class="token operator">!</span> section <span class="token punctuation">.</span> isExpandable <span class="token punctuation">)</span> <span class="token punctuation">{</span> list <span class="token punctuation">.</span> <span class="token function">addAll</span> <span class="token punctuation">(</span> section <span class="token punctuation">.</span> items <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> mainListAdapter <span class="token operator">?</span> <span class="token punctuation">.</span> <span class="token function">submitList</span> <span class="token punctuation">(</span> list <span class="token punctuation">)</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> |
In the BindingAdapter
sectionList
, I will check isExpandable
to either add or not add the section item.
When isExpandable
is false
, which means expanding, we will add Section Items. And vice versa, we only add Sections.
Apprehend
I have finished introducing an example of Expandable List. Maybe this is not the best way to handle this problem. But hope it helps a little bit for you.
If there are any problems or suggestions for the article, please comment below …
Thank you for reading here.
Thank you and Happy coding !!!