epoxy
epoxy copied to clipboard
EpoxyModel has another Epoxy Recyclerview
My requirements:
As you can see:
- Title
- Tabs
- Program Item (Image, Tags, Content Sections)
Below Layout is sperate layout which Tags and Content Section
Issue: Tags is scrollable and working when It's a single epoxy model not a carousel It's not working and scrollable when It's a carousel e-g
I am not sure what is missing..
//This is calling in epoxy controller.
private fun addCarouselProgramItemCardListToScreen(cellData: ProgramItemCardControl.CarouselCardList) {
if (cellData.isNotEmptyList) {
val items: MutableList<EpoxyModel<*>> = arrayListOf()
cellData.list.forEach { data ->
when (data) {
is ProgramItemCardControl.ProgramItem -> {
items.add(
ControlProgramItemEpoxyModel(data)
.id(data.id)
)
}
}
}
CarouselModel_()
.id("carousel_image_content_card_list")
.models(items)
.numViewsToShowOnScreen(1.5f)
.addTo(this)
}
}
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/card_program_item_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingHorizontal="16dp"
android:paddingVertical="12dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/card_program_item_content_image">
<com.ithra.revamp.ui.component.HorizontalCarousel
android:id="@+id/control_program_item_content_tags_rv"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="@+id/card_program_item_content_fav"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/card_program_item_content_fav"
android:layout_width="34dp"
android:layout_height="34dp"
android:background="@drawable/circle_stroke"
android:padding="10dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/icon_unfavorite" />
<TextView
android:id="@+id/control_program_item_content_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="9dp"
android:text="The New Exploration Of The Red Sea"
android:textAlignment="viewStart"
android:textAppearance="@style/IthraNormal"
android:textColor="@color/black"
android:textSize="20dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/control_program_item_content_tags_rv" />
<TextView
android:id="@+id/card_program_item_content_show_full"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/dp_8"
android:drawableStart="@drawable/ic_dropdown"
android:drawablePadding="@dimen/dp_8"
android:text="Show Full Coverage"
android:textAppearance="@style/IthraNormal"
android:textColor="@color/revamp_text_titles"
android:textSize="@dimen/textSize12"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/card_program_item_content_more_info_rv" />
<TextView
android:id="@+id/control_program_item_content_detail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="Details"
android:textAlignment="viewStart"
android:textAppearance="@style/IthraNormal"
android:textColor="@color/black"
android:textSize="12dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/card_program_item_content_show_full" />
<RatingBar
android:id="@+id/control_program_item_content_ratingbar"
style="@style/Widget.AppCompat.RatingBar.Small"
android:theme="@style/RatingBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:rating="3"
app:layout_constraintBottom_toBottomOf="@+id/control_program_item_content_detail"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@+id/control_program_item_content_detail" />
<androidx.constraintlayout.widget.Group
android:id="@+id/rating_group"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
app:constraint_referenced_ids="control_program_item_content_detail, control_program_item_content_ratingbar" />
</androidx.constraintlayout.widget.ConstraintLayout>
ControlProgramItemEpoxyModel
data class ControlProgramItemEpoxyModel(
val data: ProgramItemCardControl.ProgramItem
): ViewBindingKotlinModel<ControlProgramItemBinding>(R.layout.control_program_item) {
override fun ControlProgramItemBinding.bind() {
cardItemProgram.cardProgramItemContent.show()
cardItemProgramExpanded.cardProgramItemContent.hide()
cardProgramItemContentImage.load(data.image)
cardItemProgram.controlProgramItemContentTitle.setTextVisible(data.title)
cardItemProgram.controlProgramItemContentTagsRv.apply { onLoadTags(data.tags) }
cardProgramItemItem.setMargin(right = 16.dp)
cardItemProgram.controlProgramItemContentRatingbar.hide()
}
}
ControlProgramItemTagEpoxyModel
data class ControlProgramItemTagEpoxyModel(
val data: Tag,
val onItemClicked: (Tag) -> Unit
): ViewBindingKotlinModel<ItemProgramTagBinding>(R.layout.item_program_tag) {
override fun ItemProgramTagBinding.bind() {
tag.text = data.title
}
}
HorizontalCarousel.onLoadTags
private fun HorizontalCarousel.onLoadTags(tags: List<Tag>){
val models = tags.mapIndexed { index, tag ->
ControlProgramItemTagEpoxyModel(tag){
}.id("program_item_tag_$index")
}
setModels(models)
}
Issue is with tags in below picture which is not scrollable as It's carousel inside carousel