Быстрый старт: надстройка индикатора выполнения для Google Slides

Выполните шаги, описанные в оставшейся части этой страницы, и примерно через пять минут вы создадите надстройку Google Slides, которая добавляет индикатор выполнения в вашу презентацию. Вы также можете узнать больше об этом дополнении для слайдов и о том, как оно работает, из видео справа.

Настройте это

  1. Создайте новую презентацию Google .
  2. В новой презентации выберите пункт меню « Инструменты» > «Редактор сценариев» . Если появится экран приветствия, щелкните Пустой проект .
  3. Удалите любой код в редакторе скриптов и переименуйте Code.gs в progress.gs .

    слайды/прогресс/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();
          }
        }
      }
    }
  1. Выберите пункт меню Файл > Сохранить все . Назовите новый сценарий «Быстрый запуск индикатора выполнения» и нажмите « ОК ». Имя скрипта отображается для конечных пользователей в нескольких местах, в том числе в диалоге авторизации.

Попробуйте

  1. Вернитесь к презентации и перезагрузите страницу.
  2. Через несколько секунд в меню надстроек появится подменю ProgressBar . Нажмите «Дополнения» > «ProgressBar» > «Показать индикатор выполнения» .
  3. Диалоговое окно указывает, что сценарий требует авторизации. Нажмите Продолжить . Второе диалоговое окно запрашивает авторизацию для определенных сервисов Google. Щелкните Разрешить .
  4. Появится индикатор выполнения. Чтобы удалить индикатор выполнения, нажмите « Дополнения» > «ProgressBar» > «Hide Progress Bar» .

Публиковать

Так как это пример надстройки, наш туториал заканчивается. Если бы вы разрабатывали настоящее дополнение, последним шагом была бы его публикация , чтобы другие люди могли найти и установить его.

Учить больше

Чтобы продолжить изучение того, как расширить Google Slides с помощью Apps Script, ознакомьтесь со следующими ресурсами: