הצגה של סרגלי התקדמות במצגת ב-Google Slides

רמת תכנות: בינונית
משך זמן: 15 דקות
Project type (סוג הפרויקט): תוסף עריכה

מטרות

  • להבין מה הפתרון עושה.
  • להבין מה שירותי Apps Script עושים במסגרת לפתרון הבעיה.
  • מגדירים את הסקריפט.
  • מריצים את הסקריפט.

מידע על הפתרון הזה

אפשר להשתמש בפתרון הזה כדי להוסיף סרגל התקדמות לתחתית השקפים את המצגת שלך.

צילום מסך של תוסף העריכה של Slides בסרגל ההתקדמות

איך זה עובד

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

שירותי Apps Script

הפתרון הזה משתמש בשירות הבא:

  • שירות Slides – Gets את השקפים במצגת ומוסיפה צורה מלבנית לכל שקף.

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

כדי להשתמש בדוגמה הזו, צריך לעמוד בדרישות המוקדמות הבאות:

  • חשבון Google (חשבונות Google Workspace יכולים נדרש אישור של האדמין).
  • דפדפן אינטרנט עם גישה לאינטרנט.

הגדרת הסקריפט

  1. צריך ללחוץ על הלחצן הבא כדי ליצור עותק של סרגל ההתקדמות Slides מצגת. פרויקט Apps Script עבור שהפתרון הזה מצורף למצגת.
    יצירת עותק
  2. במצגת, לוחצים על תוספים. > סרגל ההתקדמות > הצגת סרגל ההתקדמות.
  3. כשמוצגת הנחיה, מאשרים את הסקריפט. אם במסך ההסכמה של OAuth מוצגת האזהרה האפליקציה הזו לא מאומתת כדי להמשיך, בוחרים באפשרות מתקדם >. עוברים אל {Project Name} (לא בטוח).

  4. שוב, לוחצים על תוספים >. סרגל ההתקדמות > הצגת סרגל ההתקדמות.

  5. כדי להסיר את סרגל ההתקדמות, לוחצים על תוספים. > סרגל ההתקדמות > הסתרת סרגל ההתקדמות.

בדיקת הקוד

כדי לבדוק את קוד Apps Script של הפתרון הזה, לוחצים על הצגת קוד המקור בהמשך:

הצגת קוד המקור

Slides/progress/progress.gs
/**
 * @OnlyCurrentDoc Adds progress bars to a presentation.
 */
const BAR_ID = 'PROGRESS_BAR_ID';
const BAR_HEIGHT = 10; // px

/**
 * Runs when the add-on is installed.
 * @param {object} e The event parameter for a simple onInstall trigger. To
 *     determine which authorization mode (ScriptApp.AuthMode) the trigger is
 *     running in, inspect e.authMode. (In practice, onInstall triggers always
 *     run in AuthMode.FULL, but onOpen triggers may be AuthMode.LIMITED or
 *     AuthMode.NONE.)
 */
function onInstall(e) {
  onOpen();
}

/**
 * Trigger for opening a presentation.
 * @param {object} e The onOpen event.
 */
function onOpen(e) {
  SlidesApp.getUi().createAddonMenu()
      .addItem('Show progress bar', 'createBars')
      .addItem('Hide progress bar', 'deleteBars')
      .addToUi();
}

/**
 * Create a rectangle on every slide with different bar widths.
 */
function createBars() {
  deleteBars(); // Delete any existing progress bars
  const presentation = SlidesApp.getActivePresentation();
  const slides = presentation.getSlides();
  for (let i = 0; i < slides.length; ++i) {
    const ratioComplete = (i / (slides.length - 1));
    const x = 0;
    const y = presentation.getPageHeight() - BAR_HEIGHT;
    const barWidth = presentation.getPageWidth() * ratioComplete;
    if (barWidth > 0) {
      const bar = slides[i].insertShape(SlidesApp.ShapeType.RECTANGLE, x, y,
          barWidth, BAR_HEIGHT);
      bar.getBorder().setTransparent();
      bar.setLinkUrl(BAR_ID);
    }
  }
}

/**
 * Deletes all progress bar rectangles.
 */
function deleteBars() {
  const presentation = SlidesApp.getActivePresentation();
  const slides = presentation.getSlides();
  for (let i = 0; i < slides.length; ++i) {
    const elements = slides[i].getPageElements();
    for (const el of elements) {
      if (el.getPageElementType() === SlidesApp.PageElementType.SHAPE &&
        el.asShape().getLink() &&
        el.asShape().getLink().getUrl() === BAR_ID) {
        el.remove();
      }
    }
  }
}

תורמים

הדוגמה הזו מתוחזקת על ידי Google בעזרת מומחי המפתחים של Google.

השלבים הבאים