1

I want to open a URL in a Chrome Custom Tab within my Android app (Kotlin). I’d like to have custom toolbar colors and potentially add an "open in browser" button. I’ve read that CustomTabsIntent can be used for this, but I’m unsure how to set it up correctly.

Here’s what I’ve tried so far:

  1. Set up a basic CustomTabsIntent to open a URL.
  2. Added a custom toolbar color.

However, I’m not sure if this approach will work for all users or if there are fallback methods if Chrome isn’t installed.

I want the URL to open in a Chrome Custom Tab with a custom toolbar color and a share button. If Chrome is not installed, the intent should gracefully fall back to a web browser.

3 Answers 3

3

Step 1: Add Custom Tabs Dependency First, add the Chrome Custom Tabs library to your build.gradle file:

dependencies {
    implementation 'androidx.browser:browser:1.5.0' // Check for the latest version
}

Add this in your activity or Fragment :

import android.content.ActivityNotFoundException
import android.content.Context
import android.content.Intent
import android.net.Uri
import androidx.browser.customtabs.CustomTabsIntent
import androidx.browser.customtabs.CustomTabsService
import androidx.browser.customtabs.CustomTabsServiceConnection
import androidx.browser.customtabs.CustomTabsSession

fun openCustomTab(context: Context, url: String) {
    val customTabsIntent = CustomTabsIntent.Builder().apply {
        setToolbarColor(context.getColor(R.color.your_toolbar_color)) // Set the custom toolbar color
        addDefaultShareMenuItem() // Adds a share button to the toolbar
        setShowTitle(true) // Show the page title in the toolbar
    }.build()

    // Check if Chrome is available and supports Custom Tabs
    val packageName = getChromePackageName(context)
    if (packageName != null) {
        customTabsIntent.intent.setPackage(packageName)
        customTabsIntent.launchUrl(context, Uri.parse(url))
    } else {
        // Fallback: Open in a browser if Chrome is not available
        openInBrowserFallback(context, url)
    }
}

private fun getChromePackageName(context: Context): String? {
    val packageManager = context.packageManager
    val customTabsPackages = packageManager.queryIntentServices(
        Intent(CustomTabsService.ACTION_CUSTOM_TABS_CONNECTION), 0
    )

    for (info in customTabsPackages) {
        if (info.serviceInfo.packageName.equals("com.android.chrome", true)) {
            return info.serviceInfo.packageName
        }
    }
    return null
}

private fun openInBrowserFallback(context: Context, url: String) {
    try {
        val browserIntent = Intent(Intent.ACTION_VIEW, Uri.parse(url))
        context.startActivity(browserIntent)
    } catch (e: ActivityNotFoundException) {
        // Handle the error (e.g., show a message to the user)
        e.printStackTrace()
    }
}

Customizations: Replace R.color.your_toolbar_color with the actual color resource you want to use for the toolbar.

You can add more UI customizations as needed by modifying the CustomTabsIntent.Builder.

2
  • 3
    I think it would be great if added in manifest, <queries> <intent> <action android:name="android.support.customtabs.action.CustomTabsService" /> </intent> </queries> Commented Nov 5, 2024 at 5:50
  • Yes, adding that in the manifest is a good approach. It ensures that your app can query for the availability of CustomTabsService without requiring users to have Chrome installed. Commented Nov 5, 2024 at 7:51
1

Try to include the Chrome Custom Tabs library in your build.gradle file.

implementation 'androidx.browser:browser:1.4.0'

After Use CustomTabsIntent to create and launch the Custom Tab.

import androidx.browser.customtabs.CustomTabsIntent
import androidx.browser.customtabs.CustomTabsServiceConnection
import androidx.browser.customtabs.CustomTabsClient

fun openCustomTab(url: String) {
    val customTabsIntent = CustomTabsIntent.Builder().build()
    customTabsIntent.launchUrl(this, Uri.parse(url))
}

and call the function for test.

0

Step 1 : Add Dependency First

implementation 'androidx.browser:browser:1.8.0'

And here is helper class to implement chrome tabs intent

import android.content.Context
import android.content.Intent
import android.content.pm.PackageManager
import android.net.Uri
import android.text.TextUtils
import androidx.browser.customtabs.CustomTabsIntent
import livewallpaper4k.livewallpaperhd.wallpaper3d.magicfluids4d.R
import livewallpaper4k.livewallpaperhd.wallpaper3d.magicfluids4d.sharedPref.Const

object ChromeHelper {

    fun openChrome(context: Context, url: String?) {
        val builder = CustomTabsIntent.Builder()

        builder.setToolbarColor(
            context.getColor(
                R.color.theme
            )
        )
        builder.addDefaultShareMenuItem()
        builder.setShowTitle(true)

        val customTabsIntent: CustomTabsIntent = builder.build()
        val intent: Intent = customTabsIntent.intent
        intent.setData(Uri.parse(url))

        val packageManager: PackageManager = context.packageManager
        val resolveInfoList =
            packageManager.queryIntentActivities(intent, PackageManager.MATCH_DEFAULT_ONLY)

        for (resolveInfo in resolveInfoList) {
            val packageName = resolveInfo.activityInfo.packageName
            if (TextUtils.equals(
                    packageName, Const.PACKAGE_NAME
                )
            ) intent.setPackage(Const.PACKAGE_NAME)
        }
        customTabsIntent.launchUrl(context, intent.data!!)
    }
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.