Multi-tasking dengan Tab Khusus Parsial

Sebastian Benz

Secara default, Tab Khusus diluncurkan sebagai aktivitas jendela penuh. Mulai Chrome 107, Anda dapat menggunakan Tab Kustom sebagian untuk menentukan tinggi peluncuran yang berbeda dalam mode potret sehingga pengguna dapat melakukan multitasking dengan berinteraksi dengan aplikasi Anda saat melihat konten web. Pengguna dapat meluaskan Tab Khusus ke layar penuh dengan menarik tombol toolbar ke atas dan memulihkan tinggi peluncuran awal dengan menarik tombol ke bawah.

Tab Kustom Sebagian di sheet bawah.

Untuk perangkat layar besar atau perangkat dalam mode lanskap, mulai Chrome 120, Anda dapat menentukan, lebar peluncuran maksimum untuk menampilkan Tab Khusus sebagian di sheet samping. Dengan menetapkan titik jeda, Anda dapat memutuskan kapan akan meluncurkan Tab Khusus sebagian di bagian bawah atau sheet samping.

Tab Khusus Parsial dalam sheet samping.

Poin utama:

• Menentukan tinggi aktivitas awal tidak akan berpengaruh jika browser default tidak mendukung Tab Khusus parsial. Dalam hal ini, tambahan intent akan diabaikan dan Tab Kustom akan mencakup tinggi tampilan lengkap.
• Properti CustomTabColorScheme.navigationBarColor dan CustomTabColorScheme.navigationBarDividerColor tidak berfungsi saat mem-build intent untuk Tab Kustom sebagian. Hal ini karena aplikasi tersebut mewarisi skema warna aplikasi host untuk properti antarmuka pengguna di atas. Anda akan bertanggung jawab untuk memastikan konsistensi visual untuk properti ini sebelum meluncurkan Tab Khusus.

Prasyarat

Agar dapat menggunakan Tab Kustom sebagian, Anda harus:

• memulai sesi browser baru menggunakan CustomTabsServiceConnection dan meneruskannya ke intent Tab Kustom atau

• mulai aktivitas Tab Kustom menggunakan startActivityForResult().

Gabungkan kedua pendekatan tersebut jika Anda menginginkan startup yang cepat jika koneksi layanan belum dibuat.

Mengonfigurasi sheet bawah

Untuk mengubah Tab Khusus menjadi Tab Khusus parsial, tentukan tinggi peluncuran awal dalam piksel dengan memanggil metode setInitialActivityHeightPx() class CustomTabBuilder. Secara default, Custom Tabs sebagian dapat diubah ukurannya, tetapi Anda dapat meneruskan ACTIVITY\_HEIGHT\_FIXED untuk menonaktifkan perilaku ini:

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

Poin penting: Tinggi tab kustom sebagian minimum adalah 50% dari tinggi layar. Jika tinggi layar ditetapkan ke nilai kurang dari 50% tinggi layar, Chrome akan otomatis menyesuaikan Tab Kustom ke 50% tinggi layar.

Mengonfigurasi panel samping

Untuk mengonfigurasi perilaku sheet samping, tentukan lebar peluncuran awal dalam piksel dengan memanggil metode setInitialActivityWidthPx() class CustomTabBuilder.

Secara default, sebagian Tab Khusus dapat diubah ukurannya, tetapi Anda dapat meneruskan ACTIVITY\_HEIGHT\_FIXED untuk menonaktifkan perilaku ini:

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

Tab Kustom akan berperilaku sebagai panel samping jika lebar layar lebih besar dari nilai titik henti sementara yang ditetapkan oleh setActivitySideSheetBreakpointDp(). Jika lebar layar lebih tinggi dari x, Tab Kustom akan berperilaku sebagai panel samping, jika tidak, Tab Kustom akan berperilaku sebagai panel bawah. Jika tidak ada titik henti sementara yang ditentukan, tetapkan implementasi browser yang harus ditetapkan sebagai nilai default 840dp. Jika x ditetapkan ke <600dp, implementasi browser akan menetapkannya secara default ke 600dp.

Meluncurkan Tab Kustom sebagian dengan sesi yang ada

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))

Meluncurkan Tab Kustom sebagian melalui 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);
        }
    });
}

Berikutnya: pelajari cara mengukur engagement pengguna di Tab Kustom.