ממשקים מבוססי כרטיסים

דוגמה לכרטיס תוסף

התוספים של Google Workspace מציגים מידע ואמצעי בקרה למשתמשים בסרגל הצד של ממשק המשתמש של אפליקציית המארח. תוסף מורכב מסרגל כלים ראשי מזהה, יחד עם כרטיס אחד או יותר.

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

הכרטיסים יכולים להיות לא לפי הקשר או בהתאם להקשר. כרטיסים לפי הקשר מוצגים למשתמש כשאפליקציית המארח נמצאת בהקשר ספציפי. לדוגמה, כשפותחים הודעה ב-Gmail או אירוע ביומן Google. כרטיסים ללא הקשר (כמו דפי בית) מוצגים למשתמש מחוץ להקשר ספציפי של המארח. לדוגמה, כשהמשתמש מציג את תיבת הדואר הנכנס ב-Gmail, את התיקייה הראשית ב-Drive או את יומן Google.

תוספי Google Workspace שנוצרו ב-Apps Script משתמשים בשירות הכרטיסים כדי ליצור ממשקי משתמש מכרטיסים. תוספים שנוצרו בשפות אחרות חייבים להחזיר קובץ JSON בפורמט תקין כדי שהממשק ידפיס אותם כקלפים.

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

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

  • אין צורך בידע ב-HTML או ב-CSS כדי ליצור ממשקים שמבוססים על כרטיסים.
  • הכרטיסים והווידג'טים מקבלים עיצוב באופן אוטומטי כדי שיתואמו לאפליקציות Google Workspace שהם מרחיבים.

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

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

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

כדאי לעיין בדפים האלה כשאתם יוצרים כרטיסים ומטמיעים התנהגות של ממשק משתמש. כדאי להיעזר גם בדוגמאות הבאות כשמטמיעים את התוסף: