ריבוי משימות עם כרטיסיות מותאמות אישית חלקיות

Sebastian Benz

כברירת מחדל, כרטיסיות בהתאמה אישית מופעלות כפעילות בחלון מלא. החל מגרסה 107 של Chrome, אפשר להשתמש בכרטיסיות מותאמות אישית חלקיות כדי לציין גובה אחר של הפעלה במצב לאורך, כדי שהמשתמשים יוכלו לבצע כמה משימות בו-זמנית על ידי אינטראקציה עם האפליקציה שלכם בזמן הצפייה בתוכן אינטרנט. המשתמשים יכולים להרחיב את הכרטיסייה המותאמת אישית למסך מלא על ידי גרירת נקודת האחיזה של סרגל הכלים כלפי מעלה ולשחזר את גובה ההפעלה הראשוני על ידי גרירת הידית כלפי מטה.

כרטיסייה מותאמת אישית חלקית בגיליון תחתון.

במסכים גדולים או במכשירים בפריסה לרוחב, החל מגרסה 120 של Chrome, אפשר לציין את רוחב הפתיחה המקסימלי כדי להציג כרטיסייה מותאמת אישית חלקית בחלונית צדדית. הגדרת נקודת עצירה מאפשרת לכם לקבוע מתי להציג כרטיסייה מותאמת אישית חלקית בגיליון תחתון או בגיליון צדדי.

גיליון צדדי עם כרטיסייה מותאמת אישית חלקית.

נקודה חשובה:

• אם דפדפן ברירת המחדל לא תומך בכרטיסיות מותאמות אישית חלקיות, לציון גובה הפעילות הראשוני לא תהיה השפעה. במקרה כזה, המערכת תתעלם מהפרמטר הנוסף של כוונת החיפוש והכרטיסייה בהתאמה אישית תשתרע על כל גובה המסך.
• המאפיינים CustomTabColorScheme.navigationBarColor ו-CustomTabColorScheme.navigationBarDividerColor לא פועלים כשאתם יוצרים כוונה לכרטיסייה מותאמת אישית חלקית. הסיבה לכך היא שהם יורשים את ערכת הצבעים של אפליקציית המארח למאפייני ממשק המשתמש שלמעלה. לפני שתפעילו כרטיסייה בהתאמה אישית, אתם תהיו אחראים לוודא שהנכסים האלה יהיו עקביים מבחינה חזותית.

דרישות מוקדמות

כדי להשתמש בכרטיסיות מותאמות אישית חלקיות, צריך:

• מתחילים סשן חדש בדפדפן באמצעות CustomTabsServiceConnection ומעבירים אותו לכוונת הרכישה של הכרטיסיות בהתאמה אישית, או

• מתחילים את הפעילות בכרטיסייה מותאמת אישית באמצעות startActivityForResult().

אם רוצים הפעלה מהירה במקרה שחיבור השירות עדיין לא הוקם, אפשר לשלב בין שתי הגישות.

הגדרת הגיליון התחתון

כדי להפוך כרטיסייה מותאמת אישית לכרטיסייה מותאמת אישית חלקית, מגדירים את הגובה הראשוני של ההפעלה בפיקסלים על ידי קריאה ל-method‏ setInitialActivityHeightPx() של הכיתה CustomTabBuilder. כברירת מחדל, אפשר לשנות את הגודל של הכרטיסייה המותאמת אישית חלקית, אבל אפשר להעביר את הערך ACTIVITY\_HEIGHT\_FIXED כדי להשבית את ההתנהגות הזו:

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

נקודת מפתח: הגובה המינימלי של כרטיסייה מותאמת אישית חלקית הוא 50% מגובה המסך. אם הגובה של המסך מוגדר לערך נמוך מ-50% מגובה המסך, Chrome מתאים באופן אוטומטי את הכרטיסייה בהתאמה אישית ל-50% מגובה המסך.

הגדרת הגיליון הצדדי

כדי להגדיר את ההתנהגות של הגיליון הצדדי, מגדירים את רוחב ההפעלה הראשוני בפיקסלים באמצעות קריאה ל-method setInitialActivityWidthPx() של המחלקה CustomTabBuilder.

כברירת מחדל, אפשר לשנות את הגודל של הכרטיסייה החלקית המותאמת אישית, אבל אפשר להעביר את הפקודה ACTIVITY\_HEIGHT\_FIXED כדי להשבית את ההתנהגות הזו:

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

הכרטיסייה בהתאמה אישית תפעל ככרטיסייה צדדית אם רוחב המסך גדול מערך נקודת העצירה שהוגדר על ידי setActivitySideSheetBreakpointDp()‎. אם רוחב המסך גבוה מ-x, הכרטיסייה בהתאמה אישית תפעל ככרטיסייה צדדית, אחרת היא תפעל ככרטיסייה תחתונה. אם לא מציינים נקודת עצירה, צריך להגדיר את ערך ברירת המחדל של הטמעת הדפדפן כ-840dp. אם x מוגדר כ-<600dp, ההטמעה בדפדפן אמורה להגדיר אותו כברירת מחדל כ-600dp.

הפעלה של כרטיסייה חלקית בהתאמה אישית עם סשן קיים

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

הפעלת כרטיסייה בהתאמה אישית חלקית באמצעות 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);
        }
    });
}

בשלב הבא: איך מודדים את התעניינות המשתמשים בכרטיסיות בהתאמה אישית.