GAS(GoogleAppsScript)を使ってみる #004

はじめに

　え、このシリーズ#003で終わったんじゃ無かったのかって？ええ、続きます( ´艸｀)
まだネタがあったので少なくとも#005までは続けます(`・ω・)

概要

スプレッドシート出社記録を付けているのだが、この表何と手作り(* ´艸｀)ｸｽｸｽ
無くなったら新たに作成するのですが、、、（コピペと日付直しと祝祭日のセルカラー変更と～などちまちました操作が必要）

面倒なので自動化します！(`・ω・´)

…というのが#001から続けてきた事です。

GAS(GoogleAppsScript)を使ってみるシリーズ一覧

#001. Calendar.getEvents(startTime, EndTime)の挙動がおかしい報告
#002. リハビリ出社記録表作成支援ツールの総括
#003. トリガーの失敗例とソース修正
いまここ☞#004. セルの書式設定の細かいお話
#005. jQueryとTimePickerをユーザプロンプトとして出力するお話
#006. リファクタリングとクラス設計のお話

---

　

今回の課題

　所感欄の書式設定がデフォのままだったのでそこまでMain処理でやってしまう(`・ω・´)

詳しく言うと…

上記の図の赤い部分が課題で、緑色にしたいということ。

これには

1. 垂直位置を上にする
2. 水平位置を左寄せにする
3. テキストを折り返す
   としなければなりません。

これを毎週分ポチポチ手でやるのは面倒です(;´Д`)

と、いうことで#003のprintFormatOfWeek関数の最後に処理を盛り込むことにした。

検討

1. 垂直位置を上にする

Rangeクラスの中で当たりをつける。ふむ、垂直位置は多分コレ(setVerticalAlignment(alignment))だろう。

(リファレンス本文引用)

var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var cell = sheet.getRange("B2");
cell.setVerticalAlignment("middle");

これでB2セルの値の表示高さを真ん中に出来る。また、alignmentは文字列型で以下の3つ、またはnullを許容するようなので、要件通りtopとする。

> alignment	String	The alignment, either **'top'**, **'middle'** or **'bottom'**; a **null** value resets the alignment.

## 2. 水平位置を左寄せにする
1. と同じくセルをアレコレする振る舞いなのでやっぱりRangeクラスであたりを付ける。うん、[コレ(setHorizontalAlignment(alignment)
)](https://developers.google.com/apps-script/reference/spreadsheet/range#sethorizontalalignmentalignment)ですね。

(リファレンス本文引用)
> ```js
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var cell = sheet.getRange("B2");
cell.setHorizontalAlignment("center");

これでB2セルの値の左右を真ん中に出来る。また、alignmentは文字列型で以下の3つ、またはnullを許容するようなので、要件通りleftとする。

alignment String The alignment, either 'left', 'center' or 'normal'; a null value resets the alignment.

3. テキストを折り返す

これも同じくRangeクラスから。コレ(setWrap(isWrapEnabled))かな？

(リファレンス本文引用)

var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheets()[0];
var cell = sheet.getRange("B2");
cell.setWrap(true);

こうすることでB2の折り返しを有効に出来るらしい。

、、、が結果変わらなかったorz...

そこでもう一つの[コチラ(setWrapStrategy(strategy))](https://developers.google.com/apps-script/reference/spreadsheet/range#setwrapstrategystrategy)が気になるお年頃...

(リファレンス本文引用)
> Sets the text wrapping strategy for the cells in the range.
> ```js
 // Sets all cells in range B2:D4 to use the clip wrap strategy.
 var sheet = SpreadsheetApp.getActiveSheet();
 var range = sheet.getRange("B2:D4");
 range.setWrapStrategy(SpreadsheetApp.WrapStrategy.CLIP);

strategy WrapStrategy The desired wrapping strategy.

だそうだ。折り返しの種類がいくつかあるから選べと。
WrapStaretegyについても調べてみた。

(リファレンス本文引用)

Enum WrapStrategy
An enumeration of the strategies used to handle cell text wrapping.

| Property | Type | Description |
| ---- | ---- | ---- |
| WRAP | Enum | Wrap lines that are longer than the cell width onto a new line. Single words that are longer than a line are wrapped at the character level.|
| OVERFLOW | Enum | Overflow lines into the next cell, so long as that cell is empty. If the next cell over is non-empty, this behaves the same as CLIP. |
| CLIP| Enum | Clip lines that are longer than the cell width. |

うーんCLIPとWRAPの違いがあんま分からないけれど、OVERFLOWで無ければよさそうだよね(∩´∀｀)∩

実装

( ´-` ).oOと、いうことで下記コードが完成した

function printFormatOfWeek() {
  var range = sh.getRange( sh.getDataRange().getLastRow() + 2, 1, 8, 9 ); // 出力先のRange
  range.setBorder( true, true, true, true, true, true );
  var horizontalAlignments = [
    [ "center", "center", "left", "left", "left", "left", "left", "left", "left" ]
  ];
  range.setHorizontalAlignment( "center" );
  range.offset( 8, 0, 1, 9 ).setHorizontalAlignments( horizontalAlignments );
  
  var youbi = sh.getRange( range.getRow(), range.getColumn(), 1, 2 ); // '曜日'
  youbi.merge()
  .setValue( '曜日' );
  
  youbi.offset( 0, 2, 1, 1 ).setValue( '日' );
  youbi.offset( 0, 3, 1, 1 ).setValue( '月' );
  youbi.offset( 0, 4, 1, 1 ).setValue( '火' );
  youbi.offset( 0, 5, 1, 1 ).setValue( '水' );
  youbi.offset( 0, 6, 1, 1 ).setValue( '木' );
  youbi.offset( 0, 7, 1, 1 ).setValue( '金' );
  youbi.offset( 0, 8, 1, 1 ).setValue( '土' );

  var tsukihi = youbi.offset( 1, 0 ); // '月日'
  tsukihi.merge().setValue( '月日' );
  
  var yotei = tsukihi.offset( 1, 0, 2, 1 )
  .merge().setValue( '予定' ) 
  yotei.offset( 0, 1, 1, 1 ).setValue( '出社時間' );
  yotei.offset( 1, 1, 1, 1 ).setValue( '退社時間' );

  var zisseki = yotei.offset( 2, 0, 2, 1 )
  .merge().setValue( '実績' )
  zisseki.offset( 0, 1, 1, 1 ).setValue( '出社時間' );
  zisseki.offset( 1, 1, 1 ,1 ).setValue( '退社時間' );

  var taichomen = zisseki.offset( 2, 0, 1, 2 )
  .merge().setValue( '体調面' );
  
  var shokan = taichomen.offset( 1, 0, 1, 2 )
  .merge().setValue( '所感' )

  shokan.offset( 0, 2, 1, 7)
  .setHorizontalAlignment( 'left' )
  .setVerticalAlignment( 'top' )
  .setWrapStrategy( SpreadsheetApp.WrapStrategy.CLIP)
  .setWrap( true );
  
  return range;
}

大抵のメソッドが処理結果と共に自身を返すため、極力メソッドチェーンにしてみました(`・ω・´)

結果

　ちょっと見づらいけど左寄せ、上詰め、折り返しになっている(∩´∀｀)∩

次回予告

次回は予定時刻の入力支援を実装します(`・ω・´)
ちょっと高度な使い方として、GASの中でjQueryを実装してみようと試みます(`・ω・´)
軽めのテストでは成功したのですが、上手く行かなかったら試行錯誤内容や失敗結果を載せます...(;ﾟДﾟ)