Class ImageButton

ImageButton

이미지가 표시된 ImageButton입니다.

Google Workspace 부가기능 및 Google Chat 앱에서 사용할 수 있습니다. 

const imageButton =
    CardService.newImageButton()
        .setAltText('An image button with an airplane icon.')
        .setIcon(CardService.Icon.AIRPLANE)
        .setOpenLink(CardService.newOpenLink().setUrl('https://airplane.com'));

메서드

메서드반환 유형간략한 설명
setAltText(altText)ImageButton접근성을 위해 버튼의 대체 텍스트를 설정합니다.
setAuthorizationAction(action)ImageButton객체를 클릭할 때 승인 흐름으로 연결되는 URL을 여는 승인 작업을 설정합니다.
setComposeAction(action, composedEmailType)ImageButton객체를 클릭할 때 임시 이메일을 작성하는 작업을 설정합니다.
setIcon(icon)ImageButton버튼에 표시할 미리 정의된 Icon을 설정합니다.
setIconUrl(url)ImageButton이 버튼의 아이콘으로 사용할 이미지의 URL을 설정합니다.
setImageButtonStyle(imageButtonStyle)ImageButton버튼 스타일을 설정합니다.
setMaterialIcon(icon)ImageButtonMaterial Design 아이콘을 설정합니다.
setOnClickAction(action)ImageButton객체를 클릭할 때 실행되는 작업을 설정합니다.
setOnClickOpenLinkAction(action)ImageButton객체를 클릭할 때 탭에서 URL을 여는 작업을 설정합니다.
setOpenLink(openLink)ImageButton객체를 클릭할 때 열릴 URL을 설정합니다.
setOverflowMenu(menu)ImageButton객체를 클릭할 때 열릴 팝업 메뉴를 설정합니다.

자세한 문서

setAltText(altText)

접근성을 위해 버튼의 대체 텍스트를 설정합니다. 필수 항목입니다.

매개변수

이름유형설명
altTextString이 버튼에 할당할 대체 텍스트입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setAuthorizationAction(action)

객체를 클릭할 때 승인 흐름으로 연결되는 URL을 여는 승인 작업을 설정합니다. 이렇게 하면 새 창에서 URL이 열립니다. 사용자가 승인 흐름을 완료하고 애플리케이션으로 돌아가면 부가기능이 다시 로드됩니다.

UI 객체에는 setOpenLink(openLink), setOnClickAction(action), setOnClickOpenLinkAction(action), setAuthorizationAction(action), setComposeAction(action, composedEmailType) 중 하나만 설정할 수 있습니다. 

// ...

const action = CardService.newAuthorizationAction().setAuthorizationUrl('url');
CardService.newTextButton().setText('Authorize').setAuthorizationAction(action);

매개변수

이름유형설명
actionAuthorizationAction이 요소를 클릭할 때 실행할 승인 작업을 지정하는 객체입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setComposeAction(action, composedEmailType)

객체를 클릭할 때 임시 이메일을 작성하는 작업을 설정합니다. UI 객체에는 setOpenLink(openLink), setOnClickAction(action), setOnClickOpenLinkAction(action), setAuthorizationAction(action), setComposeAction(action, composedEmailType) 중 하나만 설정할 수 있습니다.

Action 매개변수는 ComposeActionResponse 객체를 반환하는 콜백 함수를 지정해야 합니다. ComposeActionResponseBuilder.setGmailDraft(draft)를 사용하여 구성됩니다. 

// ...

const action = CardService.newAction().setFunctionName('composeEmailCallback');
CardService.newTextButton()
    .setText('Compose Email')
    .setComposeAction(action, CardService.ComposedEmailType.REPLY_AS_DRAFT);

// ...

function composeEmailCallback(e) {
  const thread = GmailApp.getThreadById(e.threadId);
  const draft = thread.createDraftReply('This is a reply');
  return CardService.newComposeActionResponseBuilder()
      .setGmailDraft(draft)
      .build();
}

매개변수

이름유형설명
actionAction이 요소를 클릭할 때 실행할 작성 작업을 지정하는 객체입니다.
composedEmailTypeComposedEmailType작성된 임시 이메일이 독립형 임시 이메일인지 답장 임시 이메일인지 지정하는 enum 값입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setIcon(icon)

버튼에 표시할 미리 정의된 Icon을 설정합니다. 버튼 이미지를 정의하려면 이 메서드 또는 setIconUrl(url)을 사용해야 합니다.

매개변수

이름유형설명
iconIcon미리 정의된 Icon 값 중 하나입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setIconUrl(url)

이 버튼의 아이콘으로 사용할 이미지의 URL을 설정합니다. 버튼 이미지를 정의하려면 이 메서드 또는 setIcon(icon)을 사용해야 합니다.

매개변수

이름유형설명
urlString이 버튼의 아이콘으로 사용할 호스팅된 이미지의 URL 주소입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setImageButtonStyle(imageButtonStyle)

버튼 스타일을 설정합니다. 설정하지 않으면 기본적으로 ImageButtonStyle.BORDERLESS 버튼이 됩니다.

Google Chat 앱에서 사용할 수 있습니다. Google Workspace 부가기능의 개발자 프리뷰에서 사용할 수 있습니다. 

const imageButton = CardService.newImageButton().setImageButtonStyle(
    CardService.ImageButtonStyle.BORDERLESS,
);

매개변수

이름유형설명
imageButtonStyleImageButtonStyle버튼 스타일입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setMaterialIcon(icon)

Material Design 아이콘을 설정합니다. 

const imageButton = CardService.newImageButton().setMaterialIcon(
    CardService.newMaterialIcon().setName('search'),
);

매개변수

이름유형설명
iconMaterialIconMaterial Design 아이콘입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setOnClickAction(action)

객체를 클릭할 때 실행되는 작업을 설정합니다. UI 객체에는 setOpenLink(openLink), setOnClickAction(action), setOnClickOpenLinkAction(action), setAuthorizationAction(action), setComposeAction(action, composedEmailType) 중 하나만 설정할 수 있습니다.

Action 매개변수는 ActionResponse 객체를 반환하는 콜백 함수를 지정해야 합니다. 

// ...

const action = CardService.newAction().setFunctionName('notificationCallback');
CardService.newTextButton()
    .setText('Create notification')
    .setOnClickAction(action);

// ...

function notificationCallback() {
  return CardService.newActionResponseBuilder()
      .setNotification(
          CardService.newNotification().setText('Some info to display to user'),
          )
      .build();
}

매개변수

이름유형설명
actionAction이 요소를 클릭할 때 실행할 작업입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setOnClickOpenLinkAction(action)

객체를 클릭할 때 탭에서 URL을 여는 작업을 설정합니다. URL을 빌드해야 하거나 OpenLink 객체를 만드는 것 외에 다른 작업을 실행해야 하는 경우 이 함수를 사용합니다. UI 객체에는 setOpenLink(openLink), setOnClickAction(action), setOnClickOpenLinkAction(action), setAuthorizationAction(action), setComposeAction(action, composedEmailType) 중 하나만 설정할 수 있습니다.

Action 매개변수는 ActionResponseBuilder.setOpenLink(openLink)를 사용하여 구성된 ActionResponse 객체를 반환하는 콜백 함수를 지정해야 합니다. 

// ...

const action = CardService.newAction().setFunctionName('openLinkCallback');
CardService.newTextButton()
    .setText('Open Link')
    .setOnClickOpenLinkAction(action);

// ...

function openLinkCallback() {
  return CardService.newActionResponseBuilder()
      .setOpenLink(CardService.newOpenLink().setUrl('https://www.google.com'))
      .build();
}

매개변수

이름유형설명
actionAction이 요소를 클릭할 때 실행할 링크 열기 작업을 지정하는 객체입니다. 클릭했습니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

객체를 클릭할 때 열릴 URL을 설정합니다. URL을 이미 알고 있고 열기만 하면 되는 경우 이 함수를 사용합니다. UI 객체에는 setOpenLink(openLink), setOnClickAction(action), setOnClickOpenLinkAction(action), setAuthorizationAction(action), setComposeAction(action, composedEmailType) 중 하나만 설정할 수 있습니다.

매개변수

이름유형설명
openLinkOpenLink열 URL을 설명하는 OpenLink 객체입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.

setOverflowMenu(menu)

객체를 클릭할 때 열릴 팝업 메뉴를 설정합니다. 메뉴의 각 항목은 클릭할 때 트리거될 작업을 지정할 수 있습니다. 중첩된 메뉴는 지원되지 않으며 메뉴 항목의 작업은 오버플로 메뉴를 지정해서는 안 됩니다.

Google Chat 앱에서 사용할 수 있습니다. Google Workspace 부가기능의 개발자 프리뷰에서 사용할 수 있습니다. 

const overflowMenuItem =
    CardService.newOverflowMenuItem()
        .setStartIcon(
            CardService.newIconImage().setIconUrl(
                'https://www.google.com/images/branding/googleg/1x/googleg_standard_color_64dp.png',
                ),
            )
        .setText('Open Link')
        .setOpenLink(
            CardService.newOpenLink().setUrl('https://www.google.com'));

const overflowMenu =
    CardService.newOverflowMenu().addMenuItem(overflowMenuItem).build();

매개변수

이름유형설명
menuOverflowMenu이 요소를 클릭할 때 표시할 오버플로 메뉴를 지정하는 객체입니다.

리턴

ImageButton — 연결을 위한 이 객체입니다.