Scratch

Based on ScratchにShareメニューを追加する

Posted on by admin

この記事はSmalltalk Advent Calendar 2015のエントリです。

今さらSmalltalkベースのScratch 1.4をイジる必要はなかろうと思うが、ちょっとしたアイデアを試したりするのにまだまだ使える部分が多い。
その１つにRemote Sensor Protocolがある。シンプルなプロトコルなので他の言語でも実装しやすい。ScratchでRemote Sensor Protocolを使うには、ちょっとしたメソッドの変更を行った上で、Shiftを押しながらShareメニューをクリックして、Host MeshまたはJoin Meshを選べばよい。（簡単だけど奥深い！Scratchプログラミングの魅力）
しかし、ScratchSource1.4として公開されているオープンなScratch（いわゆるBased on Scratch）環境では、Shareメニューが存在しないので、この機能を利用することができない。
そこで、この記事ではBased on ScratchにShareメニューを追加する方法について説明したい。

目標

この記事では以下の機能の実現を目指す。

  1. Based on ScratchにShareメニューを追加する。
  2. ShareメニューにHost MeshおよびJoin Meshのメニュー項目を置く。
  3. 各メニュー項目がScratchにおけるRemote Sensor Protocolに基づいた機能を提供する。

ScratchのShareメニューには、作品をScratchのウェブサイトにアップロードする機能もあるが、Based on Scratch環境ではアップロードを行うことは許されていない。

you cannot implement the ability to upload projects to any MIT Scratch website (currently, http://scratch.mit.edu)
（License Informationより）

そこで、Host MeshおよびJoin Meshの機能実現のみとする。

準備

まずはScratchSource1.4.zipをダウンロードの上、適当なフォルダで展開する。
展開したフォルダにはイメージのみでVMがないので、普通のScratch1.4もダウンロードしてインストールしておく。
展開したフォルダにあるScratchSourceCode1.4.imageのファイルを、ScratchのVM（アプリケーション）にドラッグ＆ドロップして、Based on Scratchを起動する。
ScratchSource1.4.imageの起動
ScratchSource1.4の起動時画面
起動したら、表示されているScratchのウィンドウを閉じる。そのためにはShiftを押しながらCommandキーを押し、表示されたHaloのうち左上の×印のボタンをクリックする。
×印のボタンを押して閉じる

メニュー用メソッドの作成

まずはShareメニューを押した時に反応するメソッドを作成する。
画面左側の緑色のウィンドウ（browser）の上段で、一番左にあるペイン（クラスカテゴリペイン）から、Scratch-UI-Panesを選ぶ。続いて、その右に表示されるクラスペインから、ScratchFrameMorphを選ぶ。そして、その右のプロトコルペインからmenu/button actionsを選ぶ。
browserの上段
するとbrowserの下段のコードペインが以下のようになっている（はず）。
メソッド入力欄
この内容を全て消して、以下の内容をコードペインに入力 or コピペする。

shareMenu: aMenuTitleMorph
    | menu |
    menu _ CustomMenu new.
    self addServerCommandsTo: menu.
    menu localize.
    menu invokeOn: self at: aMenuTitleMorph bottomLeft + (0 @ 10)

shareMenu:の入力
「＿」アンダースコアになっている部分が、入力すると←の記号に変わっているがこれで問題ない。
メソッド入力欄の左上に表示される「ー」をクリックしてコンテキストメニューを出し、acceptを選ぶ。
Screen Shot 2015-12-03 at 8.55.52
Screen Shot 2015-12-03 at 8.56.03
特に問題がなければイニシャルを入れるように促されるので適当なもの（スペースが含んでいてはダメ）を入力してAcceptを押す。
Screen Shot 2015-12-03 at 10.32.48
１行目が太字で表示されればOK。

メニューの登録

メニューにShareを追加して、shareMenu:メッセージを送るようにする。
同じbrowser内で上段の右から２番目のプロトコルペインでinitializationを選び、その右のメソッド一覧ペインでcreateMenuPanelを選ぶ。
Screen Shot 2015-12-03 at 10.37.21
コードペインの20行目付近に、メニュー項目を登録している箇所がある。EditとHelpのエントリの間へ、以下のようにShareメニューのエントリを追加する。
Screen Shot 2015-12-03 at 10.41.16
終わったら先ほどと同様に、コードペインのコンテキストメニューでacceptを選ぶ。

MESH機能の抑制解除

この時点でメニューにはShareと表示されるが、クリックしてもメニュー項目は表示されない。これは、ScratchがデフォルトでMESH機能を抑制しているためなので、この抑制を解除する必要がある。
browserのプロトコルペインでmenu/button actionsを選び、メソッド一覧ペインでaddServerCommandsTo:を選ぶ。
Screen Shot 2015-12-03 at 15.42.25
抑制を解除するには、上のコード中で明るく表示されているtrueを、falseに置き換える。そして、コードペインのコンテキストメニューでacceptを選べよい。

試してみる

３つの追加・変更が完了したら、デスクトップをクリックしてworldメニューを出し、open…からScratchを選ぶ。Shareメニューをクリックして２つのメニュー項目が表示されればOKである。
Screen Shot 2015-12-03 at 15.44.50
ネットワークで接続された２台以上のPCでScratchを起動すればMESH機能の面白さを実感できるが、１台のPC上でもScratchを２個立ち上げて、一方でHost Meshを選び、もう一方でJoin Meshを選べば動作を確かめることができる。後者についてはIPアドレスとして127.0.0.1と入力すればよい。
気をつけなければならないのは、一方で変数値を更新しても、もう一方の変数が変わるわけではないこと。もう一方ではセンサー値として他の変数値を参照できるだけである。

Change File

上記の追加・変更を行うチェンジファイルも公開しておく。
http://itolab.com/software/scratch/enableShareMenu.1.cs
このファイルをダウンロードしたらScratchSourceのフォルダに格納した上で、worldメニューを出して、open…からfile listを選ぶ。enableShareMenu.1.csを選んでコンテキストメニューからfileInを選べば、全ての追加・変更が行われる。
手軽に実施したい人はどうぞ。

admin