virtusize · mikhail-yevstratiev · Jun 30, 2025 · Jun 27, 2025 · Jun 27, 2025 · Jun 27, 2025
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,6 +4,7 @@
 - Fix: Replace LifecycleOwner with ViewTreeLifecycleOwner in VirtusizeInPageStandart to prevent an infinite loading in fragments
 - Fix: Add prefix 'virtusize_' to all drawables' names to prevent conflicts with client's resources
 - Fix: Fix user auth data storing
+= Fix: Add loading animation for VirtusizeInPageViews
 
 ### 2.12.0
 - Feature: Update Flutter SDK implementation to be compatible with latest changes

diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -4,6 +4,8 @@ agp = "8.6.0"
 androidxComposeBom = "2024.06.00"
 androidxTestCore = "1.6.1"
 appcompat = "1.7.0"
+coil = "2.6.0"
+coilGif = "2.6.0"
 coreKtx = "1.13.1"
 fragment = "1.8.2"
 json = "20230227"
@@ -47,6 +49,8 @@ truth = { group = "com.google.truth", name = "truth", version.ref = "truth" }
 virtusize = { group = "com.virtusize.android", name = "virtusize", version.ref = "virtusize" }
 virtusize-auth = { module = "com.virtusize.android:virtusize-auth", version.ref = "virtusizeAuth" }
 androidx-browser = { group = "androidx.browser", name = "browser", version.ref = "browser" }
+coil = { group = "io.coil-kt", name = "coil", version = "2.6.0" }
+coil-gif = { group = "io.coil-kt", name = "coil-gif", version = "2.6.0" }
 
 [plugins]
 android-application = { id = "com.android.application", version.ref = "agp" }

diff --git a/virtusize/build.gradle.kts b/virtusize/build.gradle.kts
@@ -87,6 +87,9 @@ dependencies {
     implementation(libs.kotlinx.coroutines.android)
     implementation(libs.androidx.lifecycle.runtime)
 
+    implementation(libs.coil)
+    implementation(libs.coil.gif)
+
     debugImplementation(libs.androidx.compose.ui.tooling)
 
     testImplementation(libs.androidx.test.core)

diff --git a/virtusize/src/main/java/com/virtusize/android/ui/VirtusizeInPageMini.kt b/virtusize/src/main/java/com/virtusize/android/ui/VirtusizeInPageMini.kt
@@ -9,6 +9,9 @@ import android.view.View
 import androidx.annotation.ColorInt
 import androidx.core.content.ContextCompat
 import androidx.core.graphics.drawable.DrawableCompat
+import coil.ImageLoader
+import coil.decode.GifDecoder
+import coil.request.ImageRequest
 import com.virtusize.android.R
 import com.virtusize.android.data.local.VirtusizeLanguage
 import com.virtusize.android.data.local.VirtusizeMessageHandler
@@ -69,7 +72,7 @@ class VirtusizeInPageMini
                 if (visibility == View.GONE) {
                     View.GONE
                 } else {
-                    View.INVISIBLE
+                    View.VISIBLE
                 }
             val attrsArray =
                 context.obtainStyledAttributes(attrs, R.styleable.VirtusizeInPageMini, 0, 0)
@@ -94,6 +97,19 @@ class VirtusizeInPageMini
                 )
             attrsArray.recycle()
             setStyle()
+            // Coil GIF loading
+            val imageLoader =
+                ImageLoader.Builder(context)
+                    .components {
+                        add(GifDecoder.Factory())
+                    }
+                    .build()
+            val request =
+                ImageRequest.Builder(context)
+                    .data(R.drawable.virtusize_loading)
+                    .target(binding.gifImageView)
+                    .build()
+            imageLoader.enqueue(request)
         }
 
         /**
@@ -105,6 +121,8 @@ class VirtusizeInPageMini
             if (clientProduct!!.externalId == productWithPDC.externalId) {
                 clientProduct!!.productCheckData = productWithPDC.productCheckData
                 visibility = View.VISIBLE
+                binding.gifImageLayout.visibility = View.GONE
+                binding.inpageMiniLayout.visibility = View.VISIBLE
                 setupConfiguredLocalization()
                 setLoadingScreen(true)
                 setOnClickListener {
@@ -137,6 +155,8 @@ class VirtusizeInPageMini
             if (clientProduct!!.externalId != externalProductId) {
                 return
             }
+            binding.gifImageLayout.visibility = View.GONE
+            binding.inpageMiniLayout.visibility = View.VISIBLE
             binding.inpageMiniLoadingText.visibility = View.GONE
             binding.inpageMiniText.visibility = View.VISIBLE
             binding.inpageMiniText.text =

diff --git a/virtusize/src/main/java/com/virtusize/android/ui/VirtusizeInPageStandard.kt b/virtusize/src/main/java/com/virtusize/android/ui/VirtusizeInPageStandard.kt
@@ -20,6 +20,9 @@ import androidx.core.view.ViewCompat
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.ViewModelProvider
 import androidx.lifecycle.findViewTreeLifecycleOwner
+import coil.ImageLoader
+import coil.decode.GifDecoder
+import coil.request.ImageRequest
 import com.virtusize.android.R
 import com.virtusize.android.Virtusize
 import com.virtusize.android.data.local.VirtusizeErrorType
@@ -110,7 +113,7 @@ class VirtusizeInPageStandard
                 if (visibility == View.GONE) {
                     View.GONE
                 } else {
-                    View.INVISIBLE
+                    View.VISIBLE
                 }
 
             val attrsArray =
@@ -157,6 +160,19 @@ class VirtusizeInPageStandard
             }
 
             setStyle()
+            // Coil GIF loading
+            val imageLoader =
+                ImageLoader.Builder(context)
+                    .components {
+                        add(GifDecoder.Factory())
+                    }
+                    .build()
+            val request =
+                ImageRequest.Builder(context)
+                    .data(R.drawable.virtusize_loading)
+                    .target(binding.gifImageView)
+                    .build()
+            imageLoader.enqueue(request)
         }
 
         /**
@@ -211,6 +227,9 @@ class VirtusizeInPageStandard
             if (clientProduct!!.externalId == productWithPDC.externalId) {
                 clientProduct!!.productCheckData = productWithPDC.productCheckData
                 visibility = View.VISIBLE
+                binding.gifImageLayout.visibility = View.GONE
+                binding.inpageCardView.visibility = View.VISIBLE
+                binding.inpageFooter.visibility = View.VISIBLE
                 setupConfiguredLocalization()
                 setLoadingScreen(true)
                 binding.inpageCardView.setOnClickListener {
@@ -291,6 +310,11 @@ class VirtusizeInPageStandard
             if (clientProduct!!.externalId != externalProductId) {
                 return
             }
+
+            binding.gifImageLayout.visibility = View.GONE
+            binding.inpageCardView.visibility = View.VISIBLE
+            binding.inpageFooter.visibility = View.VISIBLE
+
             binding.inpageErrorScreenLayout.visibility = View.VISIBLE
             binding.inpageLayout.visibility = View.GONE
             binding.inpageCardView.cardElevation = 0f

diff --git a/virtusize/src/main/res/drawable/virtusize_loading.gif b/virtusize/src/main/res/drawable/virtusize_loading.gif
diff --git a/virtusize/src/main/res/layout/view_inpage_mini.xml b/virtusize/src/main/res/layout/view_inpage_mini.xml
@@ -1,66 +1,87 @@
 <?xml version="1.0" encoding="utf-8"?>
-<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<LinearLayout 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/inpageMiniLayout"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    android:background="@color/color_gray_900"
-    android:orientation="vertical"
-    android:paddingStart="@dimen/virtusizeDp8"
-    android:paddingLeft="@dimen/virtusizeDp8"
-    android:paddingTop="@dimen/virtusize_inpage_mini_padding_vertical"
-    android:paddingEnd="@dimen/virtusizeDp8"
-    android:paddingRight="@dimen/virtusizeDp8"
-    android:paddingBottom="@dimen/virtusize_inpage_mini_padding_vertical">
+    android:orientation="vertical">
 
-    <ImageView
-        android:id="@+id/inpageMiniImageView"
-        android:layout_width="wrap_content"
-        android:layout_height="@dimen/virtusize_inpage_mini_image_height"
-        android:layout_centerVertical="true"
-        android:layout_marginEnd="@dimen/virtusize_inpage_mini_image_marginEnd"
-        android:layout_marginRight="@dimen/virtusize_inpage_mini_image_marginEnd"
-        android:src="@drawable/ic_vs_icon_black"
-        android:visibility="gone" />
+    <LinearLayout
+        android:id="@+id/gifImageLayout"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        android:gravity="center_horizontal">
+
+        <ImageView
+            android:id="@+id/gifImageView"
+            android:layout_width="wrap_content"
+            android:layout_height="40dp"
+            android:src="@drawable/virtusize_loading" /> 
+    </LinearLayout>
 
-    <TextView
-        android:id="@+id/inpageMiniText"
-        style="@style/VirtusizeInPageMiniTextStyle"
-        android:layout_toStartOf="@+id/inpageMiniButton"
-        android:layout_toLeftOf="@+id/inpageMiniButton"
-        android:layout_toEndOf="@+id/inpageMiniImageView"
-        android:layout_toRightOf="@+id/inpageMiniImageView"
-        android:textColor="@color/virtusizeWhite"
-        tools:text="@string/inpage_body_data_empty_text" />
+    <RelativeLayout
+        android:id="@+id/inpageMiniLayout"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="@color/color_gray_900"
+        android:orientation="vertical"
+        android:paddingStart="@dimen/virtusizeDp8"
+        android:paddingLeft="@dimen/virtusizeDp8"
+        android:paddingTop="@dimen/virtusize_inpage_mini_padding_vertical"
+        android:paddingEnd="@dimen/virtusizeDp8"
+        android:paddingRight="@dimen/virtusizeDp8"
+        android:paddingBottom="@dimen/virtusize_inpage_mini_padding_vertical"
+        android:visibility="gone">
 
-    <com.virtusize.android.ui.DotsLoadingTextView
-        android:id="@+id/inpageMiniLoadingText"
-        style="@style/VirtusizeInPageMiniTextStyle"
-        android:layout_toStartOf="@+id/inpageMiniButton"
-        android:layout_toLeftOf="@+id/inpageMiniButton"
-        android:layout_toEndOf="@+id/inpageMiniImageView"
-        android:layout_toRightOf="@+id/inpageMiniImageView"
-        android:textColor="@color/color_gray_900"
-        android:visibility="gone"
-        tools:text="@string/inpage_loading_text" />
+        <ImageView
+            android:id="@+id/inpageMiniImageView"
+            android:layout_width="wrap_content"
+            android:layout_height="@dimen/virtusize_inpage_mini_image_height"
+            android:layout_centerVertical="true"
+            android:layout_marginEnd="@dimen/virtusize_inpage_mini_image_marginEnd"
+            android:layout_marginRight="@dimen/virtusize_inpage_mini_image_marginEnd"
+            android:src="@drawable/ic_vs_icon_black"
+            android:visibility="gone" />
 
-    <Button
-        android:id="@+id/inpageMiniButton"
-        style="@style/VirtusizeInPageButtonStyle"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_alignParentEnd="true"
-        android:layout_alignParentRight="true"
-        android:layout_centerVertical="true"
-        android:layout_marginStart="@dimen/virtusize_inpage_mini_margin_between_message_button"
-        android:layout_marginLeft="@dimen/virtusize_inpage_mini_margin_between_message_button"
-        android:background="@drawable/virtusize_button_background_white"
-        android:drawableEnd="@drawable/ic_virtusize_arrow_right_black"
-        android:includeFontPadding="false"
-        android:minWidth="0dp"
-        android:minHeight="0dp"
-        android:textAllCaps="false"
-        android:textSize="@dimen/virtusize_inpage_default_textSize"
-        app:backgroundTint="@color/virtusizeWhite" />
-</RelativeLayout>
+        <TextView
+            android:id="@+id/inpageMiniText"
+            style="@style/VirtusizeInPageMiniTextStyle"
+            android:layout_toStartOf="@+id/inpageMiniButton"
+            android:layout_toLeftOf="@+id/inpageMiniButton"
+            android:layout_toEndOf="@+id/inpageMiniImageView"
+            android:layout_toRightOf="@+id/inpageMiniImageView"
+            android:textColor="@color/virtusizeWhite"
+            tools:text="@string/inpage_body_data_empty_text" />
+
+        <com.virtusize.android.ui.DotsLoadingTextView
+            android:id="@+id/inpageMiniLoadingText"
+            style="@style/VirtusizeInPageMiniTextStyle"
+            android:layout_toStartOf="@+id/inpageMiniButton"
+            android:layout_toLeftOf="@+id/inpageMiniButton"
+            android:layout_toEndOf="@+id/inpageMiniImageView"
+            android:layout_toRightOf="@+id/inpageMiniImageView"
+            android:textColor="@color/color_gray_900"
+            android:visibility="gone"
+            tools:text="@string/inpage_loading_text" />
+
+        <Button
+            android:id="@+id/inpageMiniButton"
+            style="@style/VirtusizeInPageButtonStyle"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_alignParentEnd="true"
+            android:layout_alignParentRight="true"
+            android:layout_centerVertical="true"
+            android:layout_marginStart="@dimen/virtusize_inpage_mini_margin_between_message_button"
+            android:layout_marginLeft="@dimen/virtusize_inpage_mini_margin_between_message_button"
+            android:background="@drawable/virtusize_button_background_white"
+            android:drawableEnd="@drawable/ic_virtusize_arrow_right_black"
+            android:includeFontPadding="false"
+            android:minWidth="0dp"
+            android:minHeight="0dp"
+            android:textAllCaps="false"
+            android:textSize="@dimen/virtusize_inpage_default_textSize"
+            app:backgroundTint="@color/virtusizeWhite" />
+    </RelativeLayout>
+</LinearLayout>
diff --git a/virtusize/src/main/res/layout/view_inpage_standard.xml b/virtusize/src/main/res/layout/view_inpage_standard.xml
@@ -6,14 +6,30 @@
     android:layout_height="wrap_content"
     android:orientation="vertical">
 
+    <LinearLayout
+        android:id="@+id/gifImageLayout"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        android:gravity="center_horizontal">
+
+        <ImageView
+            android:id="@+id/gifImageView"
+            android:layout_width="wrap_content"
+            android:layout_height="40dp"
+            android:src="@drawable/virtusize_loading" /> 
+
+    </LinearLayout>
+
     <androidx.cardview.widget.CardView
         android:id="@+id/inpageCardView"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_margin="@dimen/virtusize_inpage_standard_layout_margin"
         android:background="@color/virtusizeWhite"
         app:cardCornerRadius="0dp"
-        app:cardElevation="@dimen/virtusize_inpage_standard_layout_card_elevation">
+        app:cardElevation="@dimen/virtusize_inpage_standard_layout_card_elevation"
+        android:visibility="gone">
 
         <LinearLayout
             android:id="@+id/inpageErrorScreenLayout"
@@ -175,7 +191,8 @@
         android:layout_marginLeft="@dimen/virtusize_inpage_standard_footer_horizontal_margin"
         android:layout_marginTop="@dimen/virtusize_inpage_standard_footer_marginTop"
         android:layout_marginEnd="@dimen/virtusize_inpage_standard_footer_horizontal_margin"
-        android:layout_marginRight="@dimen/virtusize_inpage_standard_footer_horizontal_margin">
+        android:layout_marginRight="@dimen/virtusize_inpage_standard_footer_horizontal_margin"
+        android:visibility="gone">
 
         <ImageView
             android:id="@+id/vsSignatureImageView"