[구글 앱스 스크립트 기본 7] 도형이나 이미지에 스크립트 할당해서 버튼처럼 사용하기

 

 

[구글 앱스 스크립트 기본 7] 도형이나 이미지에 스크립트 할당해서 버튼처럼 사용하기

 

 

글의 순서 

• 들어가는 말
• 도형과 이미지
  • 도형 삽입하기
  • 이미지 삽입하기
• 예제에 사용할 스크립트 만들기: 선택된 셀의 정보를 F1 셀에 넣는 함수
• 도형에 스크립트 할당하기
• 이미지에 스크립트 할당하기

 

 

들어가는 말

구글 앱스 스크립트를 구글 시트와 연동해 사용하다 보면, 스크립트를 수정할 일이 없기 때문에 스크립트 에디터에 들어갈 필요는 없지만, 스크립트를 실행하기 위해 스크립트 에디터를 열어야 하는 경우들이 생깁니다. 단지 스크립트를 실행하기 위해 스크립트 에디터를 열고 원하는 함수를 선택하는 단계를 매번 거치는 것은 비효율적입니다. 때문에 구글 시트에서는 구글 앱스 스크립트 에디터에 들어가지 않고도 스크립트를 실행시킬 수 있게 하는 몇 가지 기능을 제공하고 있습니다. 이 글에서는 그 기능들 중에서 도형이나 이미지에 스크립트를 할당해서 버튼처럼 사용하는 방법에 대해서 알아보겠습니다. 

 

 

도형과 이미지

도형 삽입하기

구글 시트의 도형(Drawing)기능에 대해 들어보지 못하신 분들도 있으리라 생각됩니다. 구글 시트는 구글 시트 내에 간단한 도형을 삽입하는 기능을 제공하고 있습니다. 구글 시트의 도형 기능을 이용하시기 위해서는 구글 시트 상단 메뉴바에서 삽입(Insert)을 클릭하고 도형(Drawing)을 선택하면 됩니다.

 

 

도형 버튼을 누르게 되면 나오는 창은 처음 이용해 보시는 분들도 바로 이용하실 수 있을 정도로 직관적인 UI를 제공합니다. 상단 메뉴바에서 원하는 도형/텍스트/이미지 등을 삽입한 후 우측 상단의 저장하기(Save and Close) 버튼을 누르시면 됩니다. 단, 이 도형 기능을 이용해서 삽입되는 모든 도형/텍스트/이미지와 같은 객체들은 삽입 후 도형으로 인식됩니다. 즉, 도형 기능으로 텍스트를 입력한다고 하더라도, 구글시트는 이를 도형으로 인식하게 됩니다. 저는 버튼 모양의 도형에 Click me!라는 텍스트를 넣어 구글 시트에 삽입하겠습니다. 

 

 

 

이미지 삽입하기

도형과 마찬가지로 구글 시트에는 이미지도 삽입할 수 있습니다. 구글 시트에 이미지를 삽입하는 방법은 두 가지가 있습니다. 아주 오래전부터 지원하던 기능인 셀 위에 이미지를 삽입하는 기능(insert image over cells)과 최근부터 지원하게 된 셀 안에 이미지를 삽입하는 기능(insert image in cell)이 있습니다. 이미지를 삽입하기 위해서는 도형을 삽입할 때와 마찬가지로 삽입(Insert) 버튼을 누른 후 이미지를 선택 후 셀 위에 이미지 삽입 또는 셀 안쪽에 이미지 삽입 버튼을 누르시면 됩니다. 주의할 점은, 셀 안쪽에 이미지를 넣게 되면 그 셀에는 더이상 다른 값을 입력할 수 없다는 점과, 구글 앱스 스크립트를 이미지에 할당하기 위해서는 반드시 셀 위에 이미지를 삽입해야 한다는 점입니다. 

 

 

 

예제에 사용할 스크립트 만들기: 선택된 셀의 정보를 F1 셀에 넣는 함수

도형에 스크립트를 할당하기 위해서 가장 먼저 할당할 스크립트를 써보도록 하겠습니다. 이번에 만들어볼 함수는 선택한 한 개의 셀에서 정보를 가져와 그 정보를 F1셀에 넣는 함수입니다. 이 함수를 만들기 위해 새롭게 사용해 보는 메서드는 클래스 Sheet의 메서드인 getCurrentCell입니다. 이 getCurrentCell은 현재 선택된 셀 범위를 가져오기 때문에 매개변수가 필수가 아닙니다. 이번 예제에서 사용할 함수 example1은 아래와 같습니다. 아래의 스크립트를 확인하기 전에 스스로 한번 스크립트를 써보시는 것을 추천드립니다.

function example1() {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getActiveSheet();
  var range1 = sheet.getCurrentCell();
  var val1 = range1.getValue();
  var range2 = sheet.getRange(1,6);
  
  range2.setValue(val1);
}

 

 

도형에 스크립트 할당하기

위에서 만든 함수 example1을 아까 제가 삽입했던 Click me! 버튼에 할당해 보겠습니다. 가장 먼저 도형을 우클릭합니다. 도형을 우클릭하면 도형 우측 상단에 회색 점 세 개로 이루어진 버튼이 생깁니다. 그 버튼을 누르게 되면 메뉴가 생기는데 그중에서 Assign script 버튼을 선택하시면 됩니다. 참고로 스크립트가 할당되지 않은 도형은 우클릭이 아닌 좌클릭을 해도 메뉴에 접근할 수 있지만, 스크립트가 할당된 후에는 좌클릭을 통해서만 접근할 수 있습니다. 

 

 

 

Assign script 버튼을 누르면 스크립트를 할당할 수 있는 팝업이 뜨게 됩니다. 이 팝업 내부의 입력창에 할당하고자 하는 함수의 이름을 넣으면 됩니다. 이 때 주의할 점은 함수이름 뒤에 오는 매개변수가 들어가는 공간인 소괄호()를 입력하지 않는다는 점입니다. 반드시 함수의 이름만 넣으셔야 합니다. 함수의 이름인 example1을 입력하고 OK버튼을 누르면 버튼에 스크립트를 할당할 수 있습니다. (매개변수가 들어가는 자리인 소괄호를 넣을 수 없기에 반드시 매개변수가 필요한 함수들은 버튼에 할당할 수 없습니다.)

 

 

스크립트가 제대로 할당되었는지 확인하기 위해 현재 선택되어있는 셀인 D2셀에 "Hello, world!"를 작성한 후 버튼을 클릭해 보겠습니다. 만약 이번 예제를 위해 구글 시트 파일과 구글 앱스 스크립트 파일을 새로 만드셨다면 스크립트 실행을 위해 권한을 부여해야 한다는 팝업이 뜨게 됩니다. 

 

 

위의 이미지처럼 D2의 값인 "Hello, world!" 문자열이 F1 셀에 삽입된 것을 확인할 수 있습니다. 또한 스크립트 실행 중에 구글 시트 파일 중앙 상단에 스크립트가 실행 중이라는 안내가 뜨고, 스크립트 실행이 끝나면 위의 이미지처럼 스크립트가 종료되었다는 안내가 뜹니다. 만약 D2셀이 아닌 다른 셀에 다른 값을 입력한 후 그 셀을 선택하고 Click me! 도형을 누르게 되면 그 셀의 값이 F1셀에 들어가는 것을 확인할 수 있습니다. 

 

 

이미지에 스크립트 할당하기

이미지에 스크립트를 삽입하는 경우도 도형에 삽입하는 경우와 동일합니다. 원하는 이미지를 선택한 후 우클릭(스크립트를 처음 할당하는 경우는 좌클릭도 가능)한 후 나오는 팝업의 입력창에 example1을 입력합니다. 마찬가지로 소괄호 없이 함수 이름만 넣은 후 OK버튼을 누릅니다. 

 

 

이번에는 D5 셀에 "이미지에 스크립트 할당"이라는 텍스트를 입력하겠습니다. 이후 스크립트가 할당된 이미지를 클릭해 스크립트를 실행하면 아래와 같은 결과를 얻을 수 있습니다. 

 

 

위에서 언급했듯이, 셀 내부에 삽입된 이미지는 스크립트를 할당할 수 없습니다. 이는 셀 안에 삽입된 이미지는 어떤 방식으로도 선택할 수 없다는 사실에서도 알 수 있습니다.