使用 Kotlin 在 Android 中使用 Chrome 自定义标签

作为开发人员，我们可以选择在用户的浏览器中或通过 WebView 向用户显示 Web 内容，但两者都有其自身的局限性：启动浏览器是用户不可自定义的大型上下文转换，而 WebView 并不支持所有网络平台的各个方面。为了解决这个问题，谷歌推出了 chrome 自定义标签。它是一种浏览器功能，可为应用程序提供对其 Web 体验的更多控制，并在不使用 WebView 的情况下实现本机和 Web 内容之间更无缝的转换。它们允许开发人员改变浏览器的外观和感觉。它提供了许多优势和自定义：

• 能够更改工具栏颜色
• 添加进入和退出动画
• 启用内容共享
• 向浏览器工具栏和溢出菜单添加自定义操作
• 优化性能

我们将在本文中构建什么？

在本文中，我们将使用 Chrome 自定义选项卡通过多种自定义向用户显示 Web 内容。为了让您了解我们将在本文中做什么，这里有一个示例视频。

分步实施

第 1 步：创建一个新项目

要在 Android Studio 中创建新项目，请参阅如何在 Android Studio 中创建/启动新项目。请注意，选择Kotlin作为编程语言。

第二步：添加库依赖

导航到Gradle Scripts > build.gradle(Module: app) ，在依赖项部分添加库，并同步项目。

dependencies {
      implementation 'androidx.browser:browser:1.3.0'
}

步骤 3：使用 activity_main.xml 文件

导航到app > res > layout > activity_main.xml并将以下代码添加到该文件中。下面是activity_main.xml文件的代码。

步骤 4：使用 MainActivity.kt 文件

转到MainActivity.kt文件并参考以下代码。下面是MainActivity.kt文件的代码。添加了注释以更详细地理解代码。

科特林

import android.content.Context
import android.content.pm.PackageManager
import android.net.Uri
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.browser.customtabs.*
import androidx.core.content.ContextCompat
import kotlinx.android.synthetic.main.activity_main.*
  
class MainActivity : AppCompatActivity() {
  
    private var GFG_URI = "https://www.geeksforgeeks.org"
    private var package_name = "com.android.chrome";
  
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
  
        button.setOnClickListener {
  
            val builder = CustomTabsIntent.Builder()
  
            // to set the toolbar color use CustomTabColorSchemeParams
            // since CustomTabsIntent.Builder().setToolBarColor() is deprecated
  
            val params = CustomTabColorSchemeParams.Builder()
            params.setToolbarColor(ContextCompat.getColor(this@MainActivity, R.color.colorPrimary))
            builder.setDefaultColorSchemeParams(params.build())
  
            // shows the title of web-page in toolbar
            builder.setShowTitle(true)
  
            // setShareState(CustomTabsIntent.SHARE_STATE_ON) will add a menu to share the web-page
            builder.setShareState(CustomTabsIntent.SHARE_STATE_ON)
  
            // To modify the close button, use
            // builder.setCloseButtonIcon(bitmap)
  
            // to set weather instant apps is enabled for the custom tab or not, use
            builder.setInstantAppsEnabled(true)
  
            //  To use animations use -
            //  builder.setStartAnimations(this, android.R.anim.start_in_anim, android.R.anim.start_out_anim)
            //  builder.setExitAnimations(this, android.R.anim.exit_in_anim, android.R.anim.exit_out_anim)
            val customBuilder = builder.build()
  
            if (this.isPackageInstalled(package_name)) {
                // if chrome is available use chrome custom tabs
                customBuilder.intent.setPackage(package_name)
                customBuilder.launchUrl(this, Uri.parse(GFG_URI))
            } else {
                // if not available use WebView to launch the url
            }
        }
    }
}
  
fun Context.isPackageInstalled(packageName: String): Boolean {
    // check if chrome is installed or not
    return try {
        packageManager.getPackageInfo(packageName, 0)
        true
    } catch (e: PackageManager.NameNotFoundException) {
        false
    }
}

输出：

项目链接：点我

想要一个更快节奏和更具竞争力的环境来学习 Android 的基础知识吗？

单击此处前往由我们的专家精心策划的指南，旨在让您立即做好行业准备！