Android RecyclerView с использованием котлиновских sealed классов

RecyclerView — это один из самых лучших инструментов для отображения больших списков на Android. Как разработчики, вы, скорее всего понимаете о чем я говорю. У нас есть много дополнительных фич, таких как шаблоны вью холдеров, сложная анимация, Diff-Utils колбек для повышения производительности и т. д. Такие приложения, как WhatsApp и Gmail, используют RecyclerView для отображения бесконечного количества сообщений.

Одна из важнейших фич RecyclerView, которые я использую, — это типы представлений (view types). В RecyclerView мы можем отобразить несколько типов представлений. Раньше разработчики делали это с помощью флага типа представления в модели списка, который возвращали в функции getViewType адаптера RecyclerView.

Почему sealed классы Kotlin?

После появления Kotlin для разработки приложений под Android наши подходы к реализации кода кардинально изменились. То есть такие фичи, как расширения, почти заменили потребность в поддержании базовых классов для компонентов Android. Делегаты Kotlin внесли изменения в нашу работу с сеттерами и геттерами.

Теперь пришло время обновлений в работе адаптера RecyclerView. Sealed классы из Kotlin оказывают значительное влияние на управление состояниями. Подробнее прочитать об этом вы можете в этой статье. 

Вдохновившись этой статьей, я хочу показать вам реализацию типов представлений в RecyclerView с использованием sealed классов. Мы постараемся развить сравнение случайных чисел или лейаутов до типов классов. Если вы фанат Kotlin, я уверен, что вам понравится эта реализация.

Создание sealed классов в Kotlin

Первое, что нам нужно сделать при этом подходе — это создать все классы данных, которые мы намерены использовать в адаптере, а затем необходимо связать их в sealed классе. Давайте создадим группу классов данных:

data class FeedItem(val title: String,                     val desp : String,                     val businessName : String,                     ...)  data class PromotionItem(val title: String,                          val desp : String,                          val image : String) data class RatingCardItem(val title: String,                          val desp : String,                          val link : String,                          val button_tittle : String) data class LoadingStateItem(val isLoading: Boolean,                           val isRetry : Boolean,                           val error_message : String)

Это несколько классов данных, которые я хотел отобразить в списке, основываясь на данных с серверов. Вы можете создать столько классов данных, сколько захотите. Этот подход хорошо масштабируется.

То, что мы можем работать с состояниями загрузки, хедерами, футерами и многим другим без написания дополнительных классов — это одно из крутых преимуществ данного метода. Вы скоро узнаете, как это сделать. Следующим шагом является создание sealed классов, содержащих все необходимые классы данных:

sealed class UIModel{ class FeedyModel(val feedItem: FeedItem) : UIModel()  class PromotionModel(val promotionItem: PromotionItem) : UIModel()  class RatingCardModel(val ratingCardItem : RatingCardItem) : UIModel()  class LoadingModel(val loadingStateItem : LoadingStateItem) : UIModel()  }

Sealed класс с пользовательскими моделями 

Как я упоминал ранее, мы можем без дополнительных сложностей добавлять хидеры и футеры из RecyclerView, используя объект Kotlin:

sealed class UIModel{ object Header : UIModel()  object Footer : UIModel()  class FeedyModel(val feedItem: FeedItem) : UIModel()  class PromotionModel(val promotionItem: PromotionItem) : UIModel()  class RatingCardModel(val ratingCardItem : RatingCardItem) : UIModel()  class LoadingModel(val loadingStateItem : LoadingStateItem) : UIModel()  }

Sealed класс с хидером и футером

На этом этапе заканчивается реализация нашего sealed класса.

Создание адаптера RecyclerView

После того, как мы разобрались с sealed классом, пришло время создать адаптер RecyclerView с UIModel списком. Это простой RecyclerView, но с sealed классом arraylist:

class FeedAdapter(context: Context) :     RecyclerView.Adapter<RecyclerView.ViewHolder>() { private var arrayList : ArrayList&lt;UIModel&gt; = ArrayList()  fun submitData(list : ArrayList&lt;UIModel&gt;){     arrayList.clear()     arrayList.addAll(list) }  override fun getItemCount(): Int = arrayList.size  override fun getItemViewType(position: Int): Int {     return super.getItemViewType(position) }  override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {     TODO("not implemented") //To change body of created functions use File | Settings | File Templates. }  override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {     TODO("not implemented") //To change body of created functions use File | Settings | File Templates. }  }

В приведенном выше коде показана базовая реализация адаптера  RecyclerView без какой-либо логики sealed классов. Как можно заметить, мы объявили sealed классы arraylist (UIModel). Следующим шагом является возврат соответствующего типа представления на основе позиции:

override fun getItemViewType(position: Int) = when (arrayList[position]) {     is UIModel.FeedyModel -> R.layout.adapter_feed     is UIModel.PromotionModel -> R.layout.adapter_promotion     is UIModel.RatingCardModel -> R.layout.adapter_rating     is UIModel.LoadingModel -> R.layout.adapter_loading     is UIModel.Header -> R.layout.adapter_header     is UIModel.Footer -> R.layout.adapter_footor     null -> throw IllegalStateException("Unknown view") }

Сравнение модели sealed класса для получения типа представления

Теперь, когда мы успешно вернули правильный лейаут на основе модели sealed класса, нам нужно создать соответствующий ViewHolder в функции onCreateViewHolder на основе viewtype:

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {     val layoutInflater = LayoutInflater.from(parent.context)     val v = layoutInflater.inflate(viewType, parent, false)     return when (viewType) {         R.layout.adapter_feed -> FeedViewHolder(v)         R.layout.adapter_promotion -> PromotionalCardViweHolder(v)         R.layout.adapter_rating -> RatingCardViweHolder(v)         R.layout.adapter_header -> HeaderViweHolder(v)         R.layout.adapter_footor -> FootorViweHolder(v)         else -> LoadingViewholder(v)     } }

Создание вью холдера с учетом типа представления из sealed классов

Последний шаг — обновить вью холдер на основе текущих данных элемента, чтобы адаптер мог отображать данные в пользовательском интерфейсе. Поскольку у адаптера есть несколько представлений, мы должны классифицировать тип, а затем вызвать соответствующий ViewHolder:

override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {     val item = arrayList[position]     when (holder) {         is FeedViewHolder -> holder.onBindView(item as UIModel.FeedyModel)         is PromotionalCardViweHolder -> holder.onBindView(item as UIModel.PromotionModel         is RatingCardViweHolder -> holder.onBindView(item as UIModel.RatingCardModel)         is HeaderViweHolder -> holder.onBindView(item as UIModel.Header)         is FootorViweHolder -> holder.onBindView(item as UIModel.Footer)         is LoadingViewholder -> holder.onBindView(item as UIModel.LoadingModel)     } }

После объединения всех частей кода, он выглядит так:

class FeedAdapter(context: Context) :     RecyclerView.Adapter<RecyclerView.ViewHolder>() { private var arrayList : ArrayList&lt;UIModel&gt; = ArrayList()  fun submitData(list : ArrayList&lt;UIModel&gt;){     arrayList.clear()     arrayList.addAll(list) }  override fun getItemCount(): Int = arrayList.size  override fun getItemViewType(position: Int) = when (arrayList[position]) {     is UIModel.FeedyModel -&gt; R.layout.adapter_feed     is UIModel.PromotionModel -&gt; R.layout.adapter_promotion     is UIModel.RatingCardModel -&gt; R.layout.adapter_rating     is UIModel.LoadingModel -&gt; R.layout.adapter_loading     is UIModel.Header -&gt; R.layout.adapter_header     is UIModel.Footer -&gt; R.layout.adapter_footor     null -&gt; throw IllegalStateException("Unknown view") }  override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {     val layoutInflater = LayoutInflater.from(parent.context)     val v = layoutInflater.inflate(viewType, parent, false)     return when (viewType) {         R.layout.adapter_feed -&gt; FeedViewHolder(v)         R.layout.adapter_promotion -&gt; PromotionalCardViweHolder(v)         R.layout.adapter_rating -&gt; RatingCardViweHolder(v)         R.layout.adapter_header -&gt; HeaderViweHolder(v)         R.layout.adapter_footor -&gt; FootorViweHolder(v)         else -&gt; LoadingViewholder(v)     } }  override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {      val item = arrayList[position]     when (holder) {         is FeedViewHolder -&gt; holder.onBindView(item as UIModel.FeedyModel)         is PromotionalCardViweHolder -&gt; holder.onBindView(item as UIModel.PromotionModel)         is RatingCardViweHolder -&gt; holder.onBindView(item as UIModel.RatingCardModel)         is HeaderViweHolder -&gt; holder.onBindView(item as UIModel.Header)         is FootorViweHolder -&gt; holder.onBindView(item as UIModel.Footer)         is LoadingViewholder -&gt; holder.onBindView(item as UIModel.LoadingModel)     }  }  }

Финальная версия адаптера

На этом этапе мы закончили. Мы реализовали все необходимое. Вы можете создать инстанс адаптера в Activity/Fragment и присвоить его RecyclerView. Как только вы получите данные, вам нужно вызвать функцию submitData с ArrayList <UIModel>:

lateinit var adapter: FeedAdapter fun assignAdapter(){   adapter = FeedAdapter(this)   categories_recyclerView?.adapter = adapter   feedViewModel.scope.launch {       feedViewModel.getFeed().collectLatest {           adapter.submitData(it)       }   } }

Публикация данных в адаптер RecyclerView

DiffCallback

«DiffUtil — это вспомогательный класс, который может вычислять разницу между двумя списками и выводить список операций обновления, который преобразует первый список во второй». — Android Developer

Реализация diffcallback не является обязательной, но она повысит производительность, если вы работаете с большими наборами данных. Итак, чтобы реализовать difCallback в нашем адаптере, нам нужно различать модели и сравнивать нужные переменные:

companion object {     object diffCallback : DiffUtil.ItemCallback<UIModel>() {     override fun areItemsTheSame(oldItem: UIModel, newItem: UIModel): Boolean {                val isSameRepoItem = oldItem is UIModel.FeedyModel                 &amp;&amp; newItem is UIModel.FeedyModel                 &amp;&amp; oldItem.feedItem.businessName == newItem.feedItem.businessName                val isSameSeparatorItem = oldItem is UIModel.PromotionModel                 &amp;&amp; newItem is UIModel.PromotionModel                 &amp;&amp; oldItem.promotionItem.title == newItem.promotionItem.title                return isSameRepoItem || isSameSeparatorItem     }        override fun areContentsTheSame(oldItem: UIModel, newItem: UIModel) = oldItem == newItem    }  }

Реализация diffCallback

Она похожа на стандартную реализацию diffCallback, но нам необходимо разделять типы. Создав ее, свяжите ее с адаптером в конструкторе.

Это все. Надеюсь, эта статья была для вас полезной. Спасибо за внимание!

Материал подготовлен в рамках специализации «Android Developer».

Всех желающих приглашаем на двухдневный онлайн-интенсив «Делаем мобильную мини-игру за 2 дня». За 2 дня вы сделаете мобильную версию PopIt на языке Kotlin. В приложении будет простая анимация, звук хлопка, вибрация, таймер как соревновательный элемент. Интенсив подойдет для тех, кто хочет попробовать себя в роли Android-разработчика.
>> РЕГИСТРАЦИЯ