Làm nhiều việc cùng lúc với các thẻ tuỳ chỉnh một phần

Sebastian Benz

Theo mặc định, Thẻ tuỳ chỉnh sẽ khởi chạy dưới dạng hoạt động toàn cửa sổ. Kể từ Chrome 107, bạn có thể sử dụng một phần Thẻ tuỳ chỉnh để chỉ định chiều cao khởi chạy khác ở chế độ dọc sao cho người dùng có thể làm nhiều việc cùng lúc bằng cách tương tác với ứng dụng trong khi xem nội dung trên web. Người dùng có thể mở rộng Thẻ tuỳ chỉnh ra toàn màn hình bằng cách kéo ô điều khiển của thanh công cụ lên và khôi phục chiều cao khởi chạy ban đầu bằng cách kéo ô điều khiển xuống.

Đối với màn hình lớn hoặc thiết bị ở chế độ ngang, kể từ Chrome 120, bạn có thể chỉ định chiều rộng khởi chạy tối đa để hiển thị một phần Thẻ tuỳ chỉnh trong một trang tính bên. Bằng cách đặt một điểm ngắt, bạn có thể quyết định thời điểm chạy một phần Thẻ tuỳ chỉnh trong bảng dưới cùng hoặc bảng bên.

Điều kiện tiên quyết

Để có thể sử dụng một phần Thẻ tuỳ chỉnh, bạn cần:

• bắt đầu một phiên trình duyệt mới bằng cách sử dụng CustomTabsServiceConnection và chuyển phiên đó đến ý định Thẻ tuỳ chỉnh hoặc

• bắt đầu hoạt động Thẻ tuỳ chỉnh bằng startActivityForResult().

Kết hợp cả hai phương pháp nếu bạn muốn khởi động nhanh trong trường hợp kết nối dịch vụ chưa được thiết lập.

Định cấu hình bảng dưới cùng

Để chuyển Thẻ tuỳ chỉnh thành một phần Thẻ tuỳ chỉnh, hãy xác định chiều cao khởi chạy ban đầu tính bằng pixel bằng cách gọi phương thức setInitialActivityHeightPx() của lớp CustomTabBuilder. Theo mặc định, một phần Thẻ tuỳ chỉnh có thể đổi kích thước, nhưng bạn có thể chuyển ACTIVITY\_HEIGHT\_FIXED để vô hiệu hoá hành vi này:

new CustomTabsBuilder().setInitialActivityHeightPx(
    400,
    ACTIVITY_HEIGHT_FIXED
);

Định cấu hình trang tính bên

Để định cấu hình hoạt động của bảng bên, hãy xác định chiều rộng khởi chạy ban đầu tính bằng pixel bằng cách gọi phương thức setInitialActivityWidthPx() của lớp CustomTabBuilder.

Theo mặc định, một phần Thẻ tuỳ chỉnh có thể đổi kích thước, nhưng bạn có thể chuyển ACTIVITY\_HEIGHT\_FIXED để vô hiệu hoá hành vi này:

  CustomTabsIntent.Builder intentBuilder = new CustomTabsIntent.Builder(session)
        .setInitialActivityHeightPx(400)
        .setInitialActivityWidthPx(400);
        .setActivitySideSheetBreakpointDp(800);

Thẻ tuỳ chỉnh sẽ hoạt động như một trang tính bên nếu chiều rộng của màn hình lớn hơn giá trị điểm ngắt do setActivitySideSheetBreakpointDp() đặt. Nếu chiều rộng của màn hình lớn hơn x, thì Thẻ tuỳ chỉnh sẽ hoạt động như một trang tính bên, nếu không, thẻ sẽ hoạt động như một bảng dưới cùng. Nếu không có điểm ngắt nào được chỉ định, hãy đặt cách triển khai trình duyệt làm giá trị mặc định 840dp. Nếu bạn đặt x thành <600dp, thì phương thức triển khai trình duyệt sẽ mặc định là 600dp.

Khởi chạy một phần Thẻ tuỳ chỉnh bằng một phiên hoạt động hiện có

CustomTabsSession customTabsSession;

// ...

CustomTabsIntent customTabsIntent = new CustomTabsIntent.Builder(customTabsSession)
   .setInitialActivityHeightPx(500)
    .setInitialActivityWidthPx(400);
    .setActivitySideSheetBreakpointDp(800);
   .setCloseButtonPosition(CustomTabsIntent.CLOSE_BUTTON_POSITION_END)
   // ...
   .build();

customTabsIntent.launchUrl(context, Uri.parse(url))

Chạy một phần Thẻ tuỳ chỉnh thông qua startActivityForResult

private ActivityResultLauncher<String> mCustomTabLauncher = registerForActivityResult(new ActivityResultContract<String, Integer>() {
    @Override
    public Integer parseResult(int statusCode, @Nullable Intent intent) {
        return statusCode;
    }

    @NonNull
    @Override
    public Intent createIntent(@NonNull Context context, String url) {
        CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder(customTabsSession)
                .setInitialActivityHeightPx(500)
                .setInitialActivityWidthPx(400);
                .setActivitySideSheetBreakpointDp(800);
                .setCloseButtonPosition(CustomTabsIntent.CLOSE_BUTTON_POSITION_END)
                .setToolbarCornerRadiusDp(10);
        Intent customTabsIntent = builder.build().intent;
        customTabsIntent.setData(Uri.parse(url));
        return customTabsIntent;
    }
}, new ActivityResultCallback<Integer>() {
    @Override
    public void onActivityResult(Integer statusCode) {
       // ...
    }
});

@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
    Button selectButton = findViewById(R.id.select_button);
    selectButton.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View view) {
            mCustomTabLauncher.launch(customTabsIntent.intent);
        }
    });
}

Tiếp theo: tìm hiểu cách đo lường mức độ tương tác của người dùng trong Thẻ tuỳ chỉnh.