Chrome 自定义选项卡更改默认关闭按钮不起作用

Question

我正在尝试更改自定义 chrome 选项卡操作栏上的默认关闭按钮。我尝试使用 setCloseButtonIcon() 进行设置，但是，默认的关闭按钮仍然显示。我想将关闭更改为箭头。

我的代码如下：

public void openHomePage() {
    final CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder();
    builder.setToolbarColor(ContextCompat.getColor(getActivity(), R.color.primary));
    final Bitmap backButton = BitmapFactory.decodeResource(getResources(), R.drawable.ic_arrow_back_black_48dp);
    builder.setCloseButtonIcon(backButton);

    builder.setShowTitle(true);
    final CustomTabsIntent customTabsIntent = builder.build();

    customTabsIntent.launchUrl(getActivity(), Uri.parse(mTvHomepage.getText().toString()));
}

Answer 1

假设您使用的是 Google library and not on of the related ones the icons size should be 24dp as documented here。

这可以通过 BitmapFactory 选项实现：

BitmapFactory.Options options = new BitmapFactory.Options();
options.outWidth = 24;
options.outHeight = 24;
options.inScaled = true; //already default, just for illustration - ie scale to screen density (dp)
... = BitmapFactory.decodeResource(getResources(), R.drawable.ic_arrow_back_black_48dp, opts);

Answer 2

我有一个观察。上个月，在搜索 SO for various chrome custom tab issues, I found this answer suggesting to use 24dp size icon and also found this question 时说它在 PNG 上运行良好。

我已经使用 here.

中的后退箭头图标检查了您的代码

当我使用 "ic_arrow_back_black_48dp" 时，它没有将默认关闭按钮更改为箭头（见左图）。

final Bitmap backButton = BitmapFactory.decodeResource(getResources(), R.drawable.ic_arrow_back_black_48dp);

但是当我使用"ic_arrow_back_black_24dp"时，它完美地将默认关闭按钮更改为箭头（见右图）。

final Bitmap backButton = BitmapFactory.decodeResource(getResources(), R.drawable.ic_arrow_back_black_24dp);

因为它对我来说效果很好，你也应该尝试使用 here 中的 "24dp" 大小的后退箭头图标而不是 "48dp " 尺寸后退箭头图标。

截图：[设备：ASUS_Z00UD； OS: 6.0.1 ]

Answer 3

您可以直接从 Drawable 获取 BitmapDrawable 但不能从 VectorDrawable 获取，因为 setCloseButtonIcon 需要 @NonNull Bitmap icon

您也可以使用 svg 如下。从这里下载 svg ic_arrow_back_black_24px

以下方法不言自明：

private static Bitmap getBitmapFromDrawable(Context context, int drawableId) {
Drawable drawable = ContextCompat.getDrawable(context, drawableId);
if (drawable instanceof BitmapDrawable) {
  return ((BitmapDrawable) drawable).getBitmap();
} else if (drawable instanceof VectorDrawable) {
  return getBitmapFromVectorDrawable((VectorDrawable) drawable);
} else {
  throw new IllegalArgumentException("Unable to convert to bitmap");
}
}

@TargetApi(Build.VERSION_CODES.LOLLIPOP)
private static Bitmap getBitmapFromVectorDrawable(VectorDrawable vectorDrawable) {
Bitmap bitmap = Bitmap.createBitmap(vectorDrawable.getIntrinsicWidth(),
    vectorDrawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
vectorDrawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
vectorDrawable.draw(canvas);
return bitmap;
}

您可以将以上内容用作：

builder.setCloseButtonIcon(getBitmapFromDrawable(this, R.drawable.ic_arrow_back_black_24px));

Answer 4

为什么不添加图像资源并存储在 mipmap 中，这样使用 android studio 中内置的默认图标会更容易 Assest Studio

上传后您可以使用 ImageView 中的 src 资源立即轻松访问 xml 文件中 mipmap 的图标和图像

android:src="@mipmap/ic_launcher"

Answer 5

要在 Kotlin 中使用 any 24dp 可绘制资源使此工作（使用 Android KTX）：

AppCompatResources.getDrawable(activity, R.drawable.ic_arrow_back_white_24dp)?.let {
    builder.setCloseButtonIcon(it.toBitmap())
}

如果你需要做一些调色：

AppCompatResources.getDrawable(activity, R.drawable.ic_arrow_back_black_24dp)?.mutate()?.let {
    DrawableCompat.setTint(it, Color.WHITE)
    builder.setCloseButtonIcon(it.toBitmap())
}

如果 drawable 需要调整大小，则将新的 width/height 传递给 Drawable.toBitmap() 函数。

如果您不使用 Kotlin，那么您可以使用 Drawable.toBitmap() 代码的等价物：

fun Drawable.toBitmap(
    @Px width: Int = intrinsicWidth,
    @Px height: Int = intrinsicHeight,
    config: Config? = null
): Bitmap {
    if (this is BitmapDrawable) {
        if (config == null || bitmap.config == config) {
            // Fast-path to return original. Bitmap.createScaledBitmap will do this check, but it
            // involves allocation and two jumps into native code so we perform the check ourselves.
            if (width == intrinsicWidth && height == intrinsicHeight) {
                return bitmap
            }
            return Bitmap.createScaledBitmap(bitmap, width, height, true)
        }
    }

    val (oldLeft, oldTop, oldRight, oldBottom) = bounds

    val bitmap = Bitmap.createBitmap(width, height, config ?: Config.ARGB_8888)
    setBounds(0, 0, width, height)
    draw(Canvas(bitmap))

    setBounds(oldLeft, oldTop, oldRight, oldBottom)
    return bitmap
}

有关更多信息，请参阅答案。

Answer 6

我也遇到了同样的问题

解决方案：-

1) 取image(back arrow)为png格式
2) 将图像大小保持在 24dp .

以下

Answer 7

虽然这个问题已经得到解答，但由于我也遇到了这个问题并且none以上建议解决了我的问题我想分享我解决问题的方法。希望对其他人有帮助。

Ref

  fun Context.openCustomTab(
    url: String,
    @ColorRes toolbarColor: Int,
    @ColorRes iconColor: Int,
    @DrawableRes drawable: Int
) {
    CustomTabsIntent.Builder().let { ctb ->
        AppCompatResources.getDrawable(this, drawable)?.let {
            DrawableCompat.setTint(it, resources.getColor(iconColor))
            ctb.setCloseButtonIcon(it.toBitmap())
        }
        ctb.setDefaultColorSchemeParams(
            CustomTabColorSchemeParams.Builder()
                .setToolbarColor(
                    ContextCompat.getColor(
                        this,
                        toolbarColor,
                    )
                ).build()
        )

        ctb.setShowTitle(true)
    }.build().launchUrl(this, Uri.parse(url))
}

Chrome 自定义选项卡更改默认关闭按钮不起作用

Chrome Custom Tabs change the default close button not working

android

chrome-custom-tabs