Guia de início rápido: complemento da barra de progresso no Apresentações Google

Mantenha tudo organizado com as coleções Salve e categorize o conteúdo com base nas suas preferências.

Conclua as etapas descritas no restante desta página e, em cerca de cinco minutos, você terá criado um complemento do Apresentações Google que adiciona uma barra de progresso à sua apresentação. Você também pode saber mais sobre esse complemento do Apresentações e como ele funciona no vídeo à direita.

Configurar

  1. Crie uma nova Apresentação do Google.
  2. Na nova apresentação, selecione o item de menu Ferramentas > Editor de script. Se uma tela de boas-vindas for exibida, clique em Projeto em branco.
  3. Exclua qualquer código no editor de script e renomeie Code.gs como progress.gs.

    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();
          }
        }
      }
    }
  1. Selecione o item de menu File > Save all. Nomeie o novo script como "Progresso da barra de progresso" e clique em OK. O nome do script é mostrado aos usuários finais em vários lugares, incluindo a caixa de diálogo de autorização.

Fazer um teste

  1. Volte para sua apresentação e atualize a página.
  2. Depois de alguns segundos, o submenu ProgressBar aparece no menu Complementos. Clique em Complementos > ProgressBar > Mostrar barra de progresso.
  3. Uma caixa de diálogo indica que o script requer autorização. Clique em Continuar. Uma segunda caixa de diálogo solicita autorização para serviços específicos do Google. Clique em Permitir.
  4. Uma barra de progresso será exibida. Para remover a barra de progresso, clique em Complementos > ProgressBar > Ocultar barra de progresso.

Publicar

Como este é um exemplo de complemento, nosso tutorial termina aqui. Se você estivesse desenvolvendo um complemento real, a última etapa seria publicá-lo para que outras pessoas possam encontrá-lo e instalar.

Saiba mais

Para continuar aprendendo sobre como estender o Apresentações Google com o Apps Script, consulte os seguintes recursos: