episode2 GASの「文字入力と消去をボタン操作で行う」(Hunter×Hunterで覚えるGoogle Apps Script)

この記事を読むと、アニメHUNTER×HUNTER(ハンターハンター)を通してGAS(Google Apps Script)の基礎の基礎が学べます。この記事ではスプレッドシートにボタンを作成してスクリプトを登録して、ボタンを押すと各関数の処理が実行される流れを学ぶことが出来ます。
また、スプレッドシートのボタンの複製は悩む所なので、お役に立てるかも知れません。

サイトマップはこちらから

GASサンプル集に戻る
メインメニューに戻る
これからプログラミングを始める方へ
基本情報技術者へ
自己紹介

GASは環境設定不要ですぐ始められますが、

まずは前回(episode1)の復習をします。

・セルA1に「ハンターハンター」と入力する

function hh1no1(){
  
  //アクティブなスプレッドシートにアクセスしている
  const ss=SpreadsheetApp.getActiveSheet();

  //ここで入力処理を行なっている。
  ss.getRange(1,1).setValue('ハンターハンター');

}

・セルA1の内容を実行ログに出力

function hh1no1(){
  const ss=SpreadsheetApp.getActiveSheet();
  ss.getRange(1,1).setValue('ハンターハンター');

  //ここを追加してセルA1の内容をログに表示する
  console.log(ss.getRange(1,1).getValue());
}

・セルA1の内容を消去する

function hh1no1(){
  const ss=SpreadsheetApp.getActiveSheet();
  ss.getRange(1,1).setValue('ハンターハンター');

  //消去する処理
  console.log(ss.getRange(1,1).clear());
}

以上を関数に分けます。

いきなり「関数」なんて出てくると難しそうですが、

入力と表示」を「ヤマダさんのお家」、
文字の消去」を「サトウさんのお家」、
両家(両方)で使うスプレッドシートからアクティブシートを選択する共通の処理を「ゴミ捨て場」というイメージを持って読み進めて下さい。

ゴミ捨て場→「共通:アクティブなシートを選択」・・・グローバル関数(共通領域)


ヤマダ家→「入出力:セルA1に「ハンターハンター」と入力して実行ログに表示する」・・・mySet関数

サトウ家→「消去:セルA1に入力された内容を消去する」・・・myClear関数

ヤマダさんは、ヤマダさんの家と共通のゴミ捨て場は使えるけれど、サトウさんの家のものは使えない、
サトウの立場ではその逆が言える、これが関数のイメージです。

//アクティブなスプレッドシートを選択するグローバル(共通の処理)
const ss=SpreadsheetApp.getActiveSheet();

//入力とログ出力をする関数
function mySet(){

  //セル入力
  let hh=ss.getRange(1,1).setValue('ハンターハンター');

  //ログ出力
  console.log(hh);

}

//消去する関数
function myClear(){
  ss.getRange(1,1).clear();

}

このようにスクリプトを作成しました。

スプレッドシートに「入力」と「消去」というボタンを2つ作って、そのボタンを右クリックし、右上角の「てんてん」をクリックして、「スクリプトを割りあて」を押します。そのやり方について、図を用いて詳しく解説致します。

「入力ボタン」を作ってから、それを元に「消去ボタン」を作ります。
ボタンの作り方は、「挿入」→「図形描画」から作れます。


ここで任意の図形を選択します。


図形を選択すると文字が入力可能です。


この文字を中央にするには、図形を選択した状態で下の図の赤枠「・・・」をクリックします。

下の図の「配置」から中央揃えを選びます。

あとは、色やサイズを調整して、右上の緑色の「保存して終了」をクリックします。

この後に、この「入力ボタン」を元に「消去ボタン」をコピーして作成します。

まず、さっき作った「入力ボタン」を右クリックして、の右上角の「てんてん」をクリックし、「編集」をクリックして、編集画面で「入力ボタン」をコピーします。

右上の緑色の「保存して終了」を押して、面倒ですがまたスプレッドシートの「挿入」→「図形描画」から開き、貼り付けてボタンの体裁を整えて、右上の緑の「保存して終了」を押すと複製出来ます。

位置を調整します。

「入力」を実行します。

消去を押すと消せます。

ご精読ありがとうございました。

サイトマップはこちらから

GASサンプル集に戻る
メインメニューに戻る
これからプログラミングを始める方へ
基本情報技術者へ
自己紹介

■参考文献の紹介■
初めてGASを学ぶ方向け。
スプレッドシートの基本的な使い方からGASのベースとなるJavaScriptの基礎文法、GASでの初歩的なプログラミングを学べます。

GASに少し慣れて来たら、基礎固めとリファレンスとしてこの本を通してじっくり学べます。



←episode1               episode3→

←GAS自作サンプルへ戻る

投稿者: nekosiestr

プログラミング学習中のロスジェネ(就職氷河期世代)の発達障害者です。 宜しくお願いします。 趣味で写真を撮っています。 プログラミングは、GAS/HTML/CSS/JavaScript/jQuery/PHP、 発達障害は、自閉症スペクトラムASD/ADHD、その他双極性障害やHSP(5人に1人の繊細さん)などの生きづらさを抱えておりますが、それでも楽しく生きて行きたいです!! 写真は、以前はコンパクトデジカメ、現在は、OLYMPUSミラーレス一眼を使っています。