自定义标签页的优势之一是可以无缝集成到您的应用中。在“自定义标签页”指南的这一部分中,您将了解如何更改自定义标签页的外观和行为,使其与您的应用相匹配。
设置工具栏的颜色
![采用自定义浅色配色方案的自定义标签页](https://developer.chrome.google.cn/static/docs/android/custom-tabs/guide-ui-customization/image/custom-tab-a-custom-ligh-a25471aaa0cb9.png?authuser=5&hl=ca)
![采用自定义深色配色方案的自定义标签页](https://developer.chrome.google.cn/static/docs/android/custom-tabs/guide-ui-customization/image/custom-tab-a-custom-dark-4673c50a2cf6c.png?authuser=5&hl=ca)
首先,自定义“自定义标签页”的地址栏,使其与应用的主题保持一致。以下代码段通过调用 setDefaultColorSchemeParams()
更改默认的工具栏颜色。如果您的应用还支持深色配色方案,请通过 .setColorSchemeParams(CustomTabsIntent.COLOR_SCHEME_DARK, …)
进行设置。
// get the current toolbar background color (this might work differently in your app)
@ColorInt int colorPrimaryLight = ContextCompat.getColor(MainActivity.this, R.color.md_theme_light_primary);
@ColorInt int colorPrimaryDark = ContextCompat.getColor(MainActivity.this, R.color.md_theme_dark_primary);
CustomTabsIntent intent = new CustomTabsIntent.Builder()
// set the default color scheme
.setDefaultColorSchemeParams(new CustomTabColorSchemeParams.Builder()
.setToolbarColor(colorPrimaryLight)
.build())
// set the alternative dark color scheme
.setColorSchemeParams(CustomTabsIntent.COLOR_SCHEME_DARK, new CustomTabColorSchemeParams.Builder()
.setToolbarColor(colorPrimaryDark)
.build())
.build();
工具栏现在具有自定义背景和前景色。
配置自定义进入和退出动画
接下来,您可以使用 setStartAnimation
和 setExitAnimation
定义自定义的开始和退出动画,让用户在应用中启动(和退出)自定义标签页时获享更加顺畅的体验:
CustomTabsIntent intent = new CustomTabsIntent.Builder()
…
.setStartAnimations(MainActivity.this, R.anim.slide_in_right, R.anim.slide_out_left)
.setExitAnimations(MainActivity.this, android.R.anim.slide_in_left, android.R.anim.slide_out_right)
.build();
进一步自定义:标题、自动隐藏应用栏和自定义关闭图标
您还可以执行一些其他操作,以根据需要调整自定义标签页的界面。
- 滚动时隐藏网址栏,为用户提供更多空间,以使用
setUrlBarHidingEnabled()(true)
浏览 Web 内容。 - 通过
setShowTitle()(true)
显示文档标题,而不是网址。 - 自定义关闭按钮,以符合应用中的用户流,例如,显示返回箭头而不是默认的
X
图标:setCloseButtonIcon()(myCustomCloseIcon)
。
这些都是可选的,但它们可以改善应用中的自定义标签体验。
Bitmap myCustomCloseIcon = getDrawable(R.drawable.ic_baseline_arrow_back_24));
CustomTabsIntent intent = new CustomTabsIntent.Builder()
…
.setUrlBarHidingEnabled(true)
.setShowTitle(true)
.setCloseButtonIcon(toBitmap(myCustomCloseIcon))
.build();
设置自定义引荐来源网址
您可以在启动自定义标签页时将应用设为引荐来源网址。这样,您就可以让网站知道其流量来自何处。
CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder().build()
customTabsIntent.intent.putExtra(Intent.EXTRA_REFERRER,
Uri.parse("android-app://" + context.getPackageName()));
接下来:了解如何向自定义标签页添加自定义操作。