日常英語のようなプログラミング言語で
1行ごとに何をやっているか確認しながらコードを書く Page 03


08: カード、メッセージ・パス

少し「card　カード」について説明をします。LiveCodeではスタックを作ると、スタックと同じ大きさのカードが1枚作られます。カードにはすべて番号が振られていて、スタックを作った時のカードは「card 1」になります。スタックを作った直後にグラフィックやボタンなどのオブジェクトを作ると、そのオブジェクトはカード1の上に作られます。次に新しいカードを作ると、カード1の上に作られたオブジェクトも覆い隠して、カード1と同じサイズの「card 2」が作られます。カードはスタックの中に何枚でも作ることができまから、それぞれのカードの上に写真（image　イメージ）を配置して、カードを次々に開いてゆくスライド・ショーのようなスタックも簡単につくれます。LiveCodeで言うスタックは、何枚ものカードを束ねたトランプとか、カードを何枚も収納した昔の書類の整理箱のように考えることができます。

今はLiveCodeのカードの考え方の説明だけで、カード1（card 1）だけを使ったスクリプトを書いて行きます。カードもボタンと同じにオブジェクトのひとつですから、カード1にはカード1のスクリプト・エディターというのがあって、カード１の上にあるオブジェクトに書かれたスクリプトのステートメントは、ユーザーのマウスアップなどのアクションの後、カードを通ってさらにその上位のスタックを通ってコンピューターに指令が送られて、機械言語で処理された結果が、同じ経路を遡ってカード上で実行されます。LiveCodeではスクリプトをコンピュータまで送るこの道筋（階層）をメッセージ・パス（message path）と言います。またこの階層のオブジェクトの構造を、オブジェクト・ハイアラキー（object hierarchy）と呼んでいます。


09: カスタム・コマンド

前のページで作ったボタンのように、カード上に作ったオブジェクトがほとんど同じ内容のスクリプトだったりした時には、まとめたステートメントにしてオブジェクトが置いてあるカードのスクリプト・エディターに書き込んで、短なコマンド名にしてスクリプトの実行をさせることができます。このようにしてカスタムで作った命令語（命令文）を「custom command　カスタム・コマンド」と言います。文章で読むより下に書いた例を見てもらったほうが、わかりやすいでしょう。

現在はカード2は作られていませんが、カード2にも同じ命令文が使えるボタンがあったりした場合には、カードのもうひとつ上の階層のスタックのスクリプト・エディターにまとめて「custom command　カスタム・コマンド」を書きます（２枚のカードのオブジェクト・ハイアラキーで上位の階層）。カスタム・コマンドは必ずしも上の階層でなく、場合によってはオブジェクト内のエディターに書くこともありますが、今はわかりやすいように、カード1に４つあるボタンの、上の階層のカード1のエディターに書く説明をします。

まずグラフィックを右に動かすスクリプトと、グラフィックを左に動かすボタンの中に書かれたスクリプトを見比べてみましょう。

-- ボタン名「right」
set the loc of grc 1 to item 1 of the loc of grc 1 +20, item 2 of the loc of grc 1

-- ボタン名「left」
set the loc of grc 1 to item 1 of the loc of grc 1 -20, item 2 of the loc of grc 1

この二つのスクリプトの違いは、赤文字にしたアイテム１の数字です。ロケーション（the loc）で得られるXの座標（アイテム１）の数値を、増やすか減らすかという意味です。

次に上下に動かすボタンのスクリプトを比べてみます。

-- ボタン名「up」
set the loc of grc 1 to item 1 of the loc of grc 1, item 2 of the loc of grc 1 -20

-- ボタン名「down」
set the loc of grc 1 to item 1 of the loc of grc 1, item 2 of the loc of grc 1 +20

こちらはロケーション（the loc）で得られるYの座標（アイテム2）をの数値を、増やすか減らすかという意味です。この４つのスクリプトの共通点をまとめると、下に書いたスクリプトのようになります。

set the loc of grc 1 to \
    item 1 of the loc of grc 1 + (プラスかマイナスのピクセル数 = パラメータ１に置き換える), \
    item 2 of the loc of grc 1 + (プラスかマイナスのピクセル数 = パラメータ２に置き換える)



10: カードのスクリプト・エディター




カードのスクリプト・エディターを開くには「Object」メニューから「Card Script」を選ぶか、ポインター・ツールでカード上を右クリックするとコンテクスト・メニューが出ますから「Edit Script」を選びます。

カスタム・コマンドの基本形は下に書いたようになります。カスタム・コマンドは始めに「command 」と書いて同じ行に「コマンド名」次に「パラメータ１, パラメータ２」をカンマ（comma ）で繋いで書いて、次の行にステートメントの本文を書いて、最後に「end コマンド名」で終わります。パラメータは今はふたつだけですが、カンマで繋いで必要なだけ増やすことができます。

command コマンド名 パラメータ1, パラメータ2
 -- カスタムで作る命令語のステートメントがここに来る 
end コマンド名

これから作るカスタム・コマンドの名前を「moveGrc」としました。カスタム・コマンドの名前もパラメータも、コードを書いて行く上で理解しやすい名前の１語で、LiveCodeで予約されている言葉でなく、数字や＆記号で始まる語でなければ、英語でも日本語でもかまいません。キーボードを日本語変換に切り替えたりする面倒がないので、私は特別な理由がない限り英語にしています。パラメータは初めの１文字を「p」とする、LiveCodeディベロッパーの慣用的な名付け方にしましたが、文法上の決まりではありません。カードに書き込むカスタム・コマンド「moveGrc」は以下の通りです。赤文字にした「pItem1」「pItem2」がパラメータを変える事で、それぞれのボタンでこの値が変化するコマンドになります。中に書いたステートメントは１行でも書けますが、このページのレイアウトの関係で、次の行につなぐ「\　スラッシュ」を行変えに付けて２行にしています。

command moveGrc pItem1, pItem2
   set the loc of grc 1 to item 1 of the loc of grc 1 + pItem1, \
      item 2 of the loc of grc 1 + pItem2
end moveGrc




それではボタン名「up （上）」の中に、このカスタム・コマンド「moveGrc」がマウスアップ（mouseUp）で実行できるように書き込みます。下の図では前のスクリプトをわかりやすいように、そのままコメントにして残してあります。実際には残す必要はありません。コメントというのはスクリプトの内容を、後から読み返した場合などのために付けておく注釈です。実行されないように１行のコメントの始めには「--」を付けておきます。複数行のコメントは始め「/*」を付けて、終わりは「*/」で閉じます。



ボタン「up」に書き込むコマンド「moveGrc」のパラメータ「pItem1」は「0」、パラメータ「pItem2」は「-20」と、具体的な数字に置き換えます。この場合のパラメータは数字に置き換えましたが、パラメータは特に数字である必要はありません。それぞれのボタンのマウスアップ・ハンドラーに書き込む、カスタム・コマンドを使ったスクリプトです。前のスクリプトも参照できるようコメントにしてその下に書いてあります。 

-- ボタン名「up」レーベル「上」
moveGrc 0,-20
  -- set the loc of grc 1 to item 1 of the loc of grc 1, item 2 of the loc of grc 1 -20

-- ボタン名「down」レーベル「下」
moveGrc 0,20
  -- set the loc of grc 1 to item 1 of the loc of grc 1, item 2 of the loc of grc 1 +20
  
-- ボタン名「right」レーベル「右」
moveGrc 20,0
  -- set the loc of grc 1 to item 1 of the loc of grc 1 +20, item 2 of the loc of grc 1

-- ボタン名「left」レーベル「左」
moveGrc -20,0
  -- sset the loc of grc 1 to item 1 of the loc of grc 1 -20, item 2 of the loc of grc 1

４つのボタンのマウスアップ（mouseUp）ハンドラーに、それぞれパラメータの値を変えたカスタム・コマンドを書き込んでください。これで各ボタンは前のページで試したスクリプトと同じ働きをします。もしエラーになったり予想した動きと違うようでしたら、文字の間違いがないか、パラメータの数字が正しいかチェックしてください。


11: 斜めに動くボタンを増やす


斜めにも動くようにボタンを増やします。真ん中に「リセット」のボタンも作りましょう。下の図のようにボタンを作って配置してください。リセットのスクリプトは前ページの最後にメッセージ・ボックスから送ったスクリプトにします。 


on mouseUp  --「リセット」ボタン
   set the loc of grc 1 to the loc of this card
end mouseUp

その他のボタンは「上、下、左、右」とほぼ同じで、カスタム・コマンドのパラメータの数字を変えるだけです。今度は説明に付けた前のスクリプトをコメントで残していません。 

on mouseUp  --ボタン・レーベル「左上」
   moveGrc -20, -20
end mouseUp

on mouseUp  --ボタン・レーベル「左下」
   moveGrc -20, 20
end mouseUp

on mouseUp  --ボタン・レーベル「右上」
   moveGrc 20, -20
end mouseUp

on mouseUp  --ボタン・レーベル「右下」
   moveGrc 20, 20
end mouseUp

何かの事情でグラフィックのレイヤーが変わってしまった時には、メッセージ・ボックスからレイヤーの番号を「1」に設定して、グラフィックを一番下のレイヤーに移動させます。グラフィック 1（grc 1）のオブジェクト・インスペクター（Object Inspector）のポジション・タブ（Position tab）からでも、レイヤー（Layer）のナンバーを変える事ができます。 



set the layer of grc 1 to 1



2016年6月2日



役に立ったらドネーションをよろしく。
著者・アーティスト：小島健治
Eメール：index@kenjikojima.com

Page 02
05: グラフィックのサイズ変更
06: グラフィックの位置の移動
07: ボタンを作って「mouseUp」ハンドラーに書き込む


Page 04
12: リピート文１、ティックス「ticks」
13: ポイントがあるかないかを知るウィズイン「within」
14: if 文「もし何々ならば ... 」
15: ビープを鳴らしてリピートの途中から抜ける
16: 「or」と「and」の違い



ⓒ 小島健治 / Kenji Kojima