では、ブロックエディタで処理を作成しましょう。まずは、アプリの初期化処理と、必要な変数の用意、そして撮影用ボタンまでです。

・グローバル変数の用意
「Built-in」の「Definition」から[def variable as]という部品を配置してグローバル変数を用意します。グローバル変数は、「variable」の部分が変数名になるので、これを書き換えておきます。また配置したら、初期値の値を右側に接続します。これは「Built-in」の「Text」や「Math」にある[text]や[number]を使えばよいでしょう。今回、作成するグローバル変数は以下の４つです。

path――保存するファイルのパスを保管します。textの値です。
counter――保存するファイルの通し番号です。number値です。
lastX, lastY――最後にタッチした場所を保管するnumber値の変数です。

・Screen1の初期化
アプリ起動時の初期化処理は、画面のScreenに用意されているイベント処理を使います。Screen1にある[when Screen1.Initialize do]という部品が、そのためのものです。ここでは、Canvasの縦幅を調整する処理を用意します。App Inventorでは、カメラの撮影は横向き（ランドスケープ・モード）が基本です。つまり、横にして撮った写真を、縦向きのCanvasに（90度回転した状態で）表示することになります。従って、横向きの写真サイズに合わせた縮尺にしておく必要があります。

ここでは、「画面の横幅の４分の３サイズ」に設定することにします。下の図を参考に、Canvas1のHeightを、[Screen1.Width] x [3] / [4]となるようにパーツを並べてください。

・撮影ボタン
撮影用のボタン（Button1）をタッチしたときの処理は、[Button1.Click do]という部品を配置して作ります。ここに組み込むのは、Camera1に用意されている[Camera1.TakePicture]という部品だけです。これで、カメラアプリを起動し写真を撮影する処理ができてしまいます。

・撮影後の処理
Cameraには、「撮影後のイベント」というのが用意されています。[Camera1.AfterPicture image do]という部品がそれです。これは引数に[image]というものが渡されますが、これが撮影した写真のイメージです。

ここでは、[set Canvas1.BackgroundImage]を配置し、右側に[value image]を接続しておきます。[value image]は、My Blocksの「My Definitions」の中に用意されています。イベント処理で用意される引数や、自分で用意したグローバル変数は、すべてここにまとめられています。

――さあ、これで起動し、ボタンをタッチして写真を撮影し、それをCanvasに表示する、という一連の処理まで完成しました。