RecyclerView dummy items

[eypibee]

Is it possible to show skeleton with initial items above RecyclerView without the need to create dummy items?

[Faltenreich]

Yes, you can show placeholder items for upcoming RecyclerView items by using either SkeletonLayoutUtils.applySkeleton(recyclerView, layoutResId, itemCount) in Java or the extension recyclerView.applySkeleton(layoutResId, itemCount) in Kotlin which will both return a Skeleton. To toggle the placeholder items, simply call showSkeleton() or showOriginal() on the Skeleton.

[eypibee]

Hi @Faltenreich ,

I tried to apply it to the activity's recyclerview but it gives me this.

I am using the latest version and currently in Kotlin. This is how I use the extension function.

  `  private var mSkeleton: Skeleton? = null

 private fun initSkeleton() {
        mSkeleton = rvVideos.applySkeleton(R.layout.adapter_videos, 10, cornerRadius = 0.0f, shimmerDurationInMillis = 2000L)
    }

mSkeleton?.showSkeleton()`

What am I missing here?

[Faltenreich]

I do not fully understand the problem yet. Could you please share more information:

• What should the skeleton look like / what is wrong?
• Which version of the library are you using?
• A code snippet of the XML would be helpful

[eypibee]

• What should the skeleton look like / what is wrong?

Should be set as a skeleton of this:

As shown in the previous image, it only displays square skeletons.

• Which version of the library are you using?

I'm using the latest, v2.0.0 .

• A code snippet of the XML would be helpful

`<?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:layout_width="match_parent"
    android:layout_height="match_parent">

    
    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rvVideos"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@color/red"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:listitem="@layout/adapter_videos" />

</androidx.constraintlayout.widget.ConstraintLayout>`

Adapter

`<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    style="@style/itemBackgroundSelector"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    app:cardElevation="3dp"
    app:cardPreventCornerOverlap="true"
    app:cardUseCompatPadding="true">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:id="@+id/ivVideo"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/img_videos_placeholder"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
        

    </androidx.constraintlayout.widget.ConstraintLayout>


</androidx.cardview.widget.CardView>

[Faltenreich]

SkeletonLayout masks every View (except ViewGroups) independently from its content. So the disappearing play icon is as intended as the whole ImageView gets masked. At this moment the library does not support excluding specific Views from the masking process (there is an open issue for that feature: #6).

The square dimensions of the masked View may be caused by setting adjustViewBounds to true. The Drawable of your ImageView seems square, so the dimensions of the ImageView are adjusted to be square as well. Since SkeletonLayout masks only Views (and not ViewGroups), only the square ImageViews are being masked. Try adjusting the properties of the ImageView or adding another non-square View to the ViewGroup.

[eypibee]

SkeletonLayout masks every View (except ViewGroups) independently from its content. So the disappearing play icon is as intended as the whole ImageView gets masked. At this moment the library does not support excluding specific Views from the masking process (there is an open issue for that feature: #6).

The square dimensions of the masked View may be caused by setting adjustViewBounds to true. The Drawable of your ImageView seems square, so the dimensions of the ImageView are adjusted to be square as well. Since SkeletonLayout masks only Views (and not ViewGroups), only the square ImageViews are being masked. Try adjusting the properties of the ImageView or adding another non-square View to the ViewGroup.

Yes. It's what I really need to do. I tested it by setting a fixed size to the ImageView and it worked. Thanks!