Launch url using CustomTab for better ux experience

worker8 · worker8 · commit 38086b0c8f75 · 2023-10-22T16:00:07.000+09:00
diff --git a/app/build.gradle.kts b/app/build.gradle.kts
@@ -99,6 +99,9 @@ dependencies {
     /* exoplayer - for podcast */
     implementation(libs.bundles.exoplayer)
 
+    /* browser - for chrome custom tabs */
+    implementation(libs.androidx.browser)
+
     /* for notification compat */
     implementation(libs.androidx.media)
 //    implementation("com.google.android.exoplayer:extension-mediasession:${version("exoplayer")}")
diff --git a/app/src/main/java/com/worker8/androiddevnews/CustomTabUtil.kt b/app/src/main/java/com/worker8/androiddevnews/CustomTabUtil.kt
@@ -0,0 +1,31 @@
+package com.worker8.androiddevnews
+
+import android.content.Context
+import android.net.Uri
+import androidx.browser.customtabs.CustomTabColorSchemeParams
+import androidx.browser.customtabs.CustomTabsIntent
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.toArgb
+
+fun launchCustomTab(context: Context, url: String, backgroundColor: Color) {
+    CustomTabsIntent.Builder()
+//                        .setInitialActivityHeightPx(400, ACTIVITY_HEIGHT_FIXED)
+//                        .setInitialActivityHeightPx(500)
+//                        .setCloseButtonPosition(CustomTabsIntent.CLOSE_BUTTON_POSITION_END)
+//                        .setToolbarCornerRadiusDp(10)
+        // set the default color scheme
+        .setDefaultColorSchemeParams(
+            CustomTabColorSchemeParams.Builder()
+                .setToolbarColor(backgroundColor.toArgb())
+                .build()
+        )
+        // set the alternative dark color scheme
+        .setColorSchemeParams(
+            CustomTabsIntent.COLOR_SCHEME_DARK,
+            CustomTabColorSchemeParams.Builder()
+                .setToolbarColor(backgroundColor.toArgb())
+                .build()
+        )
+        .build()
+        .launchUrl(context, Uri.parse(url))
+}
diff --git a/app/src/main/java/com/worker8/androiddevnews/main/MainActivity.kt b/app/src/main/java/com/worker8/androiddevnews/main/MainActivity.kt
@@ -41,6 +41,7 @@ import com.kirkbushman.araw.models.Submission
 import com.worker8.androiddevnews.R
 import com.worker8.androiddevnews.common.compose.theme.AndroidDevNewsTheme
 import com.worker8.androiddevnews.common.compose.theme.BottomNavBg
+import com.worker8.androiddevnews.launchCustomTab
 import com.worker8.androiddevnews.newsletter.NewsletterScreen
 import com.worker8.androiddevnews.podcast.PodcastContract
 import com.worker8.androiddevnews.podcast.PodcastController
@@ -49,10 +50,7 @@ import com.worker8.androiddevnews.podcast.PodcastService
 import com.worker8.androiddevnews.podcast.PodcastServiceAction
 import com.worker8.androiddevnews.reddit.RedditController
 import com.worker8.androiddevnews.reddit.RedditScreen
-import com.worker8.androiddevnews.ui.WebViewActivity
 import dagger.hilt.android.AndroidEntryPoint
-import javax.inject.Inject
-import kotlin.time.ExperimentalTime
 import kotlinx.coroutines.CoroutineScope
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.Job
@@ -62,6 +60,8 @@ import kotlinx.coroutines.flow.flowOn
 import kotlinx.coroutines.flow.launchIn
 import kotlinx.coroutines.flow.onEach
 import kotlinx.coroutines.launch
+import javax.inject.Inject
+import kotlin.time.ExperimentalTime
 
 
 @ExperimentalTime
@@ -205,16 +205,18 @@ fun MainScreen(
             modifier = Modifier.weight(1f)
         ) {
             composable(BottomNavRoute.REDDIT.toString()) {
+                val backgroundColor = MaterialTheme.colors.background
                 RedditScreen(
                     navController,
                     redditController,
                     redditState,
                     redditListState
                 ) { url ->
-                    val intent = Intent(context, WebViewActivity::class.java).apply {
-                        putExtra(WebViewActivity.UrlKey, url)
-                    }
-                    context.startActivity(intent)
+                    launchCustomTab(
+                        context = context,
+                        url = url,
+                        backgroundColor = backgroundColor
+                    )
                 }
             }
 
diff --git a/app/src/main/java/com/worker8/androiddevnews/newsletter/AndroidWeeklyScreen.kt b/app/src/main/java/com/worker8/androiddevnews/newsletter/AndroidWeeklyScreen.kt
@@ -1,5 +1,6 @@
 package com.worker8.androiddevnews.newsletter
 
+import androidx.compose.material.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.viewinterop.AndroidView
 import com.worker8.androiddevnews.ui.createWebView
@@ -8,7 +9,12 @@ private const val LatestAndroidWeeklyUrl = "https://androidweekly.net/#latest-is
 
 @Composable
 fun AndroidWeeklyScreen() {
+    val backgroundColor = MaterialTheme.colors.background
     AndroidView(factory = { context ->
-        createWebView(context, LatestAndroidWeeklyUrl, false)
+        createWebView(
+            context = context,
+            linkUrl = LatestAndroidWeeklyUrl,
+            backgroundColor = backgroundColor
+        )
     })
 }
diff --git a/app/src/main/java/com/worker8/androiddevnews/newsletter/KotlinWeeklyScreen.kt b/app/src/main/java/com/worker8/androiddevnews/newsletter/KotlinWeeklyScreen.kt
@@ -1,18 +1,19 @@
 package com.worker8.androiddevnews.newsletter
 
-import android.util.Log
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.material.CircularProgressIndicator
-import androidx.compose.material.Text
-import androidx.compose.runtime.*
+import androidx.compose.material.MaterialTheme
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.viewinterop.AndroidView
-import com.prof.rssparser.Channel
 import com.prof.rssparser.Parser
 import com.worker8.androiddevnews.ui.createWebView
 import java.nio.charset.Charset
@@ -27,10 +28,14 @@ fun KotlinWeeklyScreen() {
         .cacheExpirationMillis(24L * 60L * 60L * 100L) // one day
         .build()
     val latestIssueLink = remember { mutableStateOf<String?>(null) }
-
     if (latestIssueLink.value != null) {
+        val backgroundColor = MaterialTheme.colors.background
         AndroidView(factory = { context ->
-            createWebView(context, latestIssueLink.value!!, false)
+            createWebView(
+                context = context,
+                linkUrl = latestIssueLink.value!!,
+                backgroundColor = backgroundColor
+            )
         })
     } else {
         Column(
diff --git a/app/src/main/java/com/worker8/androiddevnews/podcast/PodcastService.kt b/app/src/main/java/com/worker8/androiddevnews/podcast/PodcastService.kt
@@ -273,15 +273,15 @@ class PodcastService : Service() {
     }
 
     override fun onRebind(intent: Intent?) {
-        Log.d("ccw", "REBINDed-----")
+        Log.d("ccw", "onRebind(intent)")
         super.onRebind(intent)
         scope.launch {
             bindedFlow.emit(Unit)
         }
     }
 
     override fun onBind(intent: Intent?): IBinder? {
-        Log.d("ccw", "onBinded!!")
+        Log.d("ccw", "onBind(intent)")
         scope.launch {
             bindedFlow.emit(Unit)
         }
diff --git a/app/src/main/java/com/worker8/androiddevnews/ui/WebViewBuilder.kt b/app/src/main/java/com/worker8/androiddevnews/ui/WebViewBuilder.kt
@@ -2,7 +2,6 @@ package com.worker8.androiddevnews.ui
 
 import android.annotation.SuppressLint
 import android.content.Context
-import android.content.Intent
 import android.view.ViewGroup
 import android.webkit.WebSettings
 import android.webkit.WebView
@@ -26,20 +25,23 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.alpha
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.compose.ui.viewinterop.AndroidView
 import com.worker8.androiddevnews.common.util.getActivity
+import com.worker8.androiddevnews.launchCustomTab
 import java.net.URL
 
+
 @SuppressLint("SetJavaScriptEnabled")
 fun createWebView(
     context: Context,
     linkUrl: String,
-    shouldRedirectInSamePage: Boolean,
+    backgroundColor: Color,
     onPageFinished: ((String) -> Unit)? = null
 ) =
     WebView(context).apply {
@@ -68,20 +70,16 @@ fun createWebView(
                 view: WebView?,
                 url: String?
             ): Boolean {
-                if (shouldRedirectInSamePage) {
-                    url?.let {
-                        view?.loadUrl(it)
-                    }
+                return if (url.isNullOrBlank()) {
+                    false
                 } else {
-                    if (url.isNullOrBlank()) {
-                        return false
-                    }
-                    val intent = Intent(context, WebViewActivity::class.java).apply {
-                        putExtra(WebViewActivity.UrlKey, url)
-                    }
-                    context.startActivity(intent)
+                    launchCustomTab(
+                        context = context,
+                        url = url,
+                        backgroundColor = backgroundColor
+                    )
+                    true
                 }
-                return true
             }
         }
         loadUrl(linkUrl)
@@ -137,10 +135,15 @@ fun WebViewScreen(linkUrl: String) {
             }
         }
         Surface(color = MaterialTheme.colors.background) {
+            val backgroundColor = MaterialTheme.colors.background
             AndroidView(factory = { context ->
-                createWebView(context, linkUrl, true, onPageFinished = {
-                    pageTitle.value = it
-                })
+                createWebView(
+                    context = context,
+                    linkUrl = linkUrl,
+                    backgroundColor = backgroundColor,
+                    onPageFinished = {
+                        pageTitle.value = it
+                    })
             })
         }
     }
diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -12,6 +12,7 @@ araw = "f0171e78e4"
 rssProf18 = "4.0.2"
 rssPodcastFeed = "2.4.1"
 coil = "2.2.2"
+browser = "1.5.0"
 hiltDagger = "2.44"
 exoplayer = "2.18.1"
 media = "1.6.0"
@@ -38,6 +39,7 @@ androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref =
 androidx-appcompat = { group = "androidx.appcompat", name = "appcompat", version.ref = "appCompat" }
 androidx-media = { group = "androidx.media", name = "media", version.ref = "media" }
 android-material = { group = "com.google.android.material", name = "material", version.ref = "material" }
+androidx-browser = { group = "androidx.browser", name = "browser", version.ref = "browser" }
 araw = { group = "com.github.KirkBushman", name = "ARAW", version.ref = "araw" }
 rssProf18 = { group = "com.prof18.rssparser", name = "rssparser", version.ref = "rssProf18" }
 rssPodcastFeed = { group = "com.icosillion.podengine", name = "podengine", version.ref = "rssPodcastFeed" }

Original file line number	Diff line number	Diff line change
`@@ -273,15 +273,15 @@ class PodcastService : Service() {`
`273`	`273`	`}`
`274`	`274`
`275`	`275`	`override fun onRebind(intent: Intent?) {`
`276`		`- Log.d("ccw", "REBINDed-----")`
	`276`	`+ Log.d("ccw", "onRebind(intent)")`
`277`	`277`	`super.onRebind(intent)`
`278`	`278`	`scope.launch {`
`279`	`279`	`bindedFlow.emit(Unit)`
`280`	`280`	`}`
`281`	`281`	`}`
`282`	`282`
`283`	`283`	`override fun onBind(intent: Intent?): IBinder? {`
`284`		`- Log.d("ccw", "onBinded!!")`
	`284`	`+ Log.d("ccw", "onBind(intent)")`
`285`	`285`	`scope.launch {`
`286`	`286`	`bindedFlow.emit(Unit)`
`287`	`287`	`}`