update...

app/build.gradle

@@ -2,6 +2,7 @@ apply plugin: 'com.android.application'
 apply plugin: 'kotlin-android'
 apply plugin: 'kotlin-android-extensions'
 apply plugin: 'kotlin-kapt'
+apply plugin: 'kotlinx-serialization'
 
 android {
     compileSdkVersion 28
@@ -23,7 +24,7 @@ android {
 
 dependencies {
     implementation fileTree(dir: 'libs', include: ['*.jar'])
-    implementation"org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
+    implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
 
     implementation 'androidx.appcompat:appcompat:1.1.0-alpha03'
     implementation 'androidx.core:core-ktx:1.1.0-alpha05'
@@ -37,4 +38,10 @@ dependencies {
     testImplementation 'junit:junit:4.12'
     androidTestImplementation 'androidx.test:runner:1.1.0-alpha4'
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.1.0-alpha4'
+
+    def fuelVersion = '2.0.1'
+    implementation "com.github.kittinunf.fuel:fuel:$fuelVersion"
+    implementation "com.github.kittinunf.fuel:fuel-coroutines:$fuelVersion"
+    implementation "com.github.kittinunf.fuel:fuel-kotlinx-serialization:$fuelVersion"
+    implementation 'org.jetbrains.kotlinx:kotlinx-coroutines-android:1.1.1'
 }

app/src/main/java/com/hoc/viewpager2/Api.kt

@@ -0,0 +1,21 @@
+package com.hoc.viewpager2
+
+import com.github.kittinunf.fuel.core.FuelError
+import com.github.kittinunf.fuel.coroutines.awaitObjectResult
+import com.github.kittinunf.fuel.httpGet
+import com.github.kittinunf.fuel.serialization.kotlinxDeserializerOf
+import com.github.kittinunf.result.Result
+import kotlinx.coroutines.delay
+import kotlinx.serialization.ImplicitReflectionSerializer
+import kotlinx.serialization.internal.ArrayListSerializer
+
+private const val URL = "https://hoc081098.github.io/hoc081098.github.io/data.json"
+
+@ImplicitReflectionSerializer
+suspend fun getViewPagerItems(): Result<List<ViewPagerItem>, FuelError> {
+    delay(2_000)
+
+    return URL
+        .httpGet()
+        .awaitObjectResult(kotlinxDeserializerOf(ArrayListSerializer(ViewPagerItem.serializer())))
+}

app/src/main/java/com/hoc/viewpager2/FlipTransformer.kt

@@ -0,0 +1,19 @@
+package com.hoc.viewpager2
+
+import android.view.View
+import androidx.viewpager2.widget.ViewPager2
+
+class FlipTransformer(private val viewPager: ViewPager2) : ViewPager2.PageTransformer {
+    override fun transformPage(page: View, position: Float) {
+        val rotation = -180f * position
+
+        page.visibility = if (rotation > 90f || rotation < -90f) View.INVISIBLE else View.VISIBLE
+        page.pivotX = page.width * 0.5f
+        page.pivotY = page.height * 0.5f
+
+        when (viewPager.orientation) {
+            ViewPager2.ORIENTATION_VERTICAL -> page.rotationX = rotation
+            ViewPager2.ORIENTATION_HORIZONTAL -> page.rotationY = rotation
+        }
+    }
+}

app/src/main/java/com/hoc/viewpager2/MainActivity.kt

@@ -1,43 +1,89 @@
 package com.hoc.viewpager2
 
-import android.graphics.Color
-import androidx.appcompat.app.AppCompatActivity
 import android.os.Bundle
+import android.view.Menu
+import android.view.MenuItem
+import android.view.View
+import android.widget.Toast
+import androidx.appcompat.app.AppCompatActivity
+import androidx.viewpager2.widget.ViewPager2
+import androidx.viewpager2.widget.ViewPager2.ORIENTATION_HORIZONTAL
+import androidx.viewpager2.widget.ViewPager2.ORIENTATION_VERTICAL
 import kotlinx.android.synthetic.main.activity_main.*
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.MainScope
+import kotlinx.coroutines.cancel
+import kotlinx.coroutines.launch
+import kotlinx.serialization.ImplicitReflectionSerializer
 import kotlin.LazyThreadSafetyMode.NONE
 
+@ExperimentalCoroutinesApi
+@ImplicitReflectionSerializer
 class MainActivity : AppCompatActivity() {
+    private val scope = MainScope()
     private val adapter by lazy(NONE) { ViewPagerAdapter(GlideApp.with(this)) }
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContentView(R.layout.activity_main)
 
-        view_pager.adapter = adapter
-
-        adapter.submitList(
-            listOf(
-                ViewPagerItem(
-                    id = "0",
-                    imageUrl = "https://cdn-images-1.medium.com/max/600/1*OFJKA8dRYZSb-Kprx-VReg.png",
-                    name = "Android Jetpack"
-                ),
-                ViewPagerItem(
-                    id = "1",
-                    imageUrl = "https://avatars3.githubusercontent.com/u/36917223?s=400&v=4",
-                    name = "hoc081098"
-                ),
-                ViewPagerItem(
-                    id = "2",
-                    imageUrl = "https://cms-assets.tutsplus.com/uploads/users/369/posts/31577/preview_image/Building-reactive-Android-apps-with-RxJava-Kotlin.png",
-                    name = "RxKotlin"
-                ),
-                ViewPagerItem(
-                    id = "3",
-                    imageUrl = "https://res.infoq.com/presentations/netflix-functional-rx/en/slides/sl74.jpg",
-                    name = "Functional Reactive Programming"
+        view_pager.run {
+            adapter = this@MainActivity.adapter
+            orientation = ViewPager2.ORIENTATION_HORIZONTAL
+            registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {
+                override fun onPageSelected(position: Int) {
+                    Toast.makeText(this@MainActivity, "Selected $position", Toast.LENGTH_SHORT).show()
+                }
+            })
+            setPageTransformer(FlipTransformer(this))
+        }
+
+        GlideApp
+            .with(this)
+            .asGif()
+            .load(R.drawable.loading_indicator)
+            .into(image_loading)
+
+        getItems()
+    }
+
+    private fun getItems() {
+        scope.launch {
+            image_loading.visibility = View.VISIBLE
+            getViewPagerItems()
+                .fold(
+                    {
+                        adapter.submitList(it)
+                    },
+                    {
+                        Toast
+                            .makeText(
+                                this@MainActivity,
+                                it.message ?: "An unexpected error occurred",
+                                Toast.LENGTH_SHORT
+                            )
+                            .show()
+                    }
                 )
-            )
-        )
+            image_loading.visibility = View.GONE
+        }
+    }
+
+    override fun onCreateOptionsMenu(menu: Menu?) = menuInflater.inflate(R.menu.menu_main, menu).let { false } //TODO
+
+    override fun onOptionsItemSelected(item: MenuItem?): Boolean {
+        if (item?.itemId == R.id.action_change_orientation) {
+            view_pager.orientation = when (view_pager.orientation) {
+                ORIENTATION_HORIZONTAL -> ORIENTATION_VERTICAL
+                ORIENTATION_VERTICAL -> ORIENTATION_HORIZONTAL
+                else -> error(":(")
+            }
+        }
+        return super.onOptionsItemSelected(item)
+    }
+
+    override fun onDestroy() {
+        super.onDestroy()
+        scope.cancel()
     }
 }

app/src/main/java/com/hoc/viewpager2/MyAppGlideModule.kt

@@ -1,5 +1,9 @@
 package com.hoc.viewpager2
 
+import android.content.Context
+import android.graphics.Bitmap
+import com.bumptech.glide.Glide
+import com.bumptech.glide.Registry
 import com.bumptech.glide.annotation.GlideModule
 import com.bumptech.glide.module.AppGlideModule
 

app/src/main/java/com/hoc/viewpager2/ViewPagerAdapter.kt

@@ -1,12 +1,21 @@
 package com.hoc.viewpager2
 
+import android.graphics.Bitmap
+import android.graphics.Color
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import androidx.core.content.ContextCompat
+import androidx.palette.graphics.Palette
 import androidx.recyclerview.widget.DiffUtil
 import androidx.recyclerview.widget.ListAdapter
 import androidx.recyclerview.widget.RecyclerView
-import com.bumptech.glide.load.resource.drawable.DrawableTransitionOptions
+import androidx.swiperefreshlayout.widget.CircularProgressDrawable
+import com.bumptech.glide.load.DataSource
+import com.bumptech.glide.load.engine.GlideException
+import com.bumptech.glide.load.resource.bitmap.BitmapTransitionOptions
+import com.bumptech.glide.request.RequestListener
+import com.bumptech.glide.request.target.Target
 import com.bumptech.glide.request.transition.DrawableCrossFadeFactory
 import kotlinx.android.synthetic.main.item_layout.view.*
 
@@ -17,7 +26,6 @@ class ViewPagerAdapter(private val glide: GlideRequests) :
             override fun areContentsTheSame(oldItem: ViewPagerItem, newItem: ViewPagerItem) = oldItem == newItem
         }
     ) {
-    private val factory = DrawableCrossFadeFactory.Builder().setCrossFadeEnabled(true).build()!!
 
     override fun onCreateViewHolder(parent: ViewGroup, viewType: Int) = LayoutInflater.from(parent.context)
         .inflate(R.layout.item_layout, parent, false)
@@ -28,14 +36,70 @@ class ViewPagerAdapter(private val glide: GlideRequests) :
     inner class VH(itemView: View) : RecyclerView.ViewHolder(itemView) {
         private val imageView = itemView.image_view!!
         private val textName = itemView.text_name!!
+
         fun bind(item: ViewPagerItem) {
             textName.text = item.name
 
-            glide.load(item.imageUrl)
-                .transition(DrawableTransitionOptions.withCrossFade(factory))
-                .placeholder(R.mipmap.ic_launcher_round)
-                .error(R.mipmap.ic_launcher_round)
+            val circularProgressDrawable = CircularProgressDrawable(itemView.context)
+                .apply {
+                    strokeWidth = 5f
+                    centerRadius = 30f
+                    setColorSchemeColors(
+                        ContextCompat.getColor(
+                            itemView.context,
+                            R.color.colorAccent
+                        ),
+                        Color.BLACK
+                    )
+                    start()
+                }
+
+            glide
+                .asBitmap()
+                .load(item.imageUrl)
+                .transition(BitmapTransitionOptions.withCrossFade(factory))
+                .placeholder(circularProgressDrawable)
+                .error(R.drawable.ic_image_accent_24dp)
+                .listener(object : RequestListener<Bitmap?> {
+                    override fun onLoadFailed(
+                        e: GlideException?,
+                        model: Any?,
+                        target: Target<Bitmap?>?,
+                        isFirstResource: Boolean
+                    ): Boolean = false
+
+                    override fun onResourceReady(
+                        resource: Bitmap?,
+                        model: Any?,
+                        target: Target<Bitmap?>?,
+                        dataSource: DataSource?,
+                        isFirstResource: Boolean
+                    ): Boolean {
+                        resource ?: return false
+
+                        Palette
+                            .from(resource)
+                            .generate {
+                                when (val darkVibrantSwatch = it?.darkVibrantSwatch) {
+                                    null -> {
+                                        itemView.setBackgroundColor(Color.parseColor("#FEFEFE"))
+                                        textName.setTextColor(Color.parseColor("#212121"))
+                                    }
+                                    else -> {
+                                        itemView.setBackgroundColor(darkVibrantSwatch.rgb)
+                                        textName.setTextColor(darkVibrantSwatch.titleTextColor)
+                                    }
+                                }
+                            }
+
+                        return false
+                    }
+                })
                 .into(imageView)
         }
     }
+
+    companion object {
+        private val factory = DrawableCrossFadeFactory.Builder().setCrossFadeEnabled(true).build()!!
+    }
 }

app/src/main/java/com/hoc/viewpager2/ViewPagerItem.kt

@@ -1,7 +1,11 @@
 package com.hoc.viewpager2
 
+import kotlinx.serialization.SerialName
+import kotlinx.serialization.Serializable
+
+@Serializable
 data class ViewPagerItem(
-    val imageUrl: String,
+    @SerialName("image_url") val imageUrl: String,
     val name: String,
     val id: String
 )

app/src/main/res/drawable/ic_image_accent_24dp.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:tint="#D81B60"
+    android:viewportWidth="24.0"
+    android:viewportHeight="24.0">
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M21,19V5c0,-1.1 -0.9,-2 -2,-2H5c-1.1,0 -2,0.9 -2,2v14c0,1.1 0.9,2 2,2h14c1.1,0 2,-0.9 2,-2zM8.5,13.5l2.5,3.01L14.5,12l4.5,6H5l3.5,-4.5z" />
+</vector>