Android 打开网页之CustomTabs

1,877 阅读2分钟

一般打开url有以下几种方式:

  • 调用默认浏览器
  • 用WebView
  • 用CustomTabsIntent

默认浏览器的话,是跳转到别的app,我方app就切换到后台了,至于什么时候返回回来就不确定了,且在后台有被回收的风险,不利于业务开展,如果是打开浏览器之后就完成任务的情况,可以使用。

WebView是我们比较常用的,如果页面可控,且需要交互的,还是建议使用webview的。

CustomTabs在用户的默认浏览器中显示网页,相当于在自己的app中用默认浏览器打开网页,效果类似WebView,但使用起来比WebView轻量,也更安全,性能更好。

今天主要说说CustomTabs。

效果:

在这里插入图片描述

这是打开应用宝的一个App下载链接。可以看到加载速度还是很快的,就像打开activity一样。

引入

customtabs其实是browser包下的,browser是jetpack下的,现在统一纳入到androidx。

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

使用

简单使用的话,只要一行代码

CustomTabsIntent.Builder().build().launchUrl(context, uri)

就这么简单。

上面提到效果图中打开网页像打开activity一样,如果更像呢,主题一直是不是更像了。

定制ui

CustomTabsIntent也支持定制ui

//设置颜色方案
val schemeParams = CustomTabColorSchemeParams.Builder()
                .setToolbarColor(ContextCompat.getColor(context, R.color.colorPrimary))
                .setSecondaryToolbarColor(ContextCompat.getColor(context, R.color.colorPrimaryDark))
                .build()
                
CustomTabsIntent.Builder()
                .setDefaultColorSchemeParams(schemeParams)
                .build().launchUrl(context, uri)

CustomTabColorSchemeParams支持

  • toolbarColor
  • secondaryToolbarColor
  • navigationBarColor
  • navigationBarDividerColor

看看效果

在这里插入图片描述

菜单

比如setActionButton

val bitmap = BitmapFactory.decodeResource(this.resources, R.mipmap.ic_setting)
val intent = Intent(context, LoginActivity::class.java)
val activity = PendingIntent.getActivity(context, 0, intent, 0)
//内置启动
CustomTabsIntent.Builder()
    .setActionButton(bitmap, "自定义Action", activity)
    .setDefaultColorSchemeParams(schemeParams)
    .build().launchUrl(context, uri)

这里用PendingIntent指定后续操作,比如打开一个页面或者发送一个广播。

在这里插入图片描述

可以看到右上角多了一个设置的小图标。

除此之外还有很多别的api,比如:

  • addMenuItem(String label, PendingIntent pendingIntent)
  • setCloseButtonIcon(Bitmap icon)
  • setShowTitle(boolean showTitle)
  • 等等

完整代码


    btn_launch.setOnClickListener {
        openWebPage(this, Uri.parse("https://www.baidu.com"))
    }
 
	...

    private fun openWebPage(context: Context, uri: Uri) {
        if (context.isChromeSupported()) {
            //设置颜色方案
            val schemeParams = CustomTabColorSchemeParams.Builder()
                .setToolbarColor(ContextCompat.getColor(context, R.color.colorPrimary))
                .setSecondaryToolbarColor(ContextCompat.getColor(context, R.color.colorPrimaryDark))
                .build()

            val bitmap = BitmapFactory.decodeResource(this.resources, R.mipmap.ic_setting)
            val intent = Intent(context, LoginActivity::class.java)
            val activity = PendingIntent.getActivity(context, 0, intent, 0)

            //内置启动
            CustomTabsIntent.Builder()
                .setActionButton(bitmap, "自定义Action", activity)
                .setDefaultColorSchemeParams(schemeParams)
                .build().launchUrl(context, uri)
        } else {
            //启动默认浏览器
            context.startActivity(Intent(Intent.ACTION_VIEW, uri))
        }
    }

    private fun Context.isChromeSupported(): Boolean {
        val serviceIntent = Intent(CustomTabsService.ACTION_CUSTOM_TABS_CONNECTION)
        serviceIntent.setPackage("com.android.chrome")
        val resolveInfos = packageManager.queryIntentServices(serviceIntent, 0)
        return !resolveInfos.isNullOrEmpty()
    }

感谢