MIT App Inventor 2 お絵かきの消しゴムは? | おるどんこんが書きたいコトを書きっぱなし

おるどんこんが書きたいコトを書きっぱなし

おるどんこんが書きたいことを書くためのブログ。
MIT App Inventor 2でお越しの方、書いてある内容のことならお気楽にお声かけください。

MIT App Inventor 2でお絵かきの消しゴムを探すけど見つからない。

キャンバスのクリアは最初から用意されていてボタンに設定したら一発。

昨日ボンヤリ考えていたのは、キャンバスの色が白なので、黒い文字の上から白で塗れば見かけ上は消えたことになるから代用できると思っていました。

 

 

 

画面中央がキャンバス部分で、キャンバスの背景イメージに自分で作ったマス目の画像が設定されています。

マス目を描いた紙の上に透明なガラス板がのっていて、そのガラス板に「おしまい」と書いた状態になっています。

キャンバスをクリアを何かのボタンに設定したなら、ガラスの上にかいた文字や絵が消えて何も書かれていない透明なガラス板になります。

 

最初に考えたように消しゴムの代わりに線の色を白にして、書いた黒い文字を上書きします。書いた黒の文字は消えますが、背景のイメージとして設定しているマス目も白の線に隠れて見えなくなります。

マス目を描いた紙の上に透明なガラス板がのっていて、「おしまい」と黒で書かれた上から白色で上書きした状態ですからマス目もその白に隠れて見えなくなります。

 

消しゴムのように使いたいときは透明の色で上書きするという方法を使うようです。

 

消しゴム代わりの透明の色の設定方法。

キャンバスの線の色を設定します。

色の中から「RGBでカスタム色作成-リストを作成」を選択します。

 

消しゴムなどのボタンを作ってボタンのブロックにくっつけて下さい。

リストを作成の右側に3つの数字がありますが、色の指定のようです。

上から赤、緑、青でそれぞれ0~255の数字で設定できますが、画像のように全て255だと混ざった色が白になります。

このまま、消しゴムボタンに設定すると白い線が描かれるだけですので、背景イメージを消さないようにするには不向き。

(背景が真っ白ならこれでも問題ない)

 

色の透明度を指定する項目が必要です。

そこで次からの作業。

 

リストを作成の文字の前にある小さな歯車をクリックすると、リストに要素を追加するブロックが上に出てきます。

 

 

 

四角の中で左側の要素をドラッグしてリスト一番下に追加。

すると、下のリスト作成のブロックにもう一つ要素を追加できる場所が出来ました。

 

 

そこに組み込みブロックの数学から数字ブロックをドラッグしてきてくっつけます。

色の指定をRGBでカスタム色作成、そしてそのリストの要素を4つにしたとき上3つは赤緑青の色を指定、4つめは不透明度(透明度?どっちか?)を指定するようです。

4つめを255にすると実際の色が塗られますし、この数字を小さくするとだんだん薄い色が塗られます。0にすると透明の色を塗るようです。

これで黒い文字の上から描くと透明の色で上書きですから、描いた部分は透明になります。

これで、消しゴムの代わりになりました。

自分の場合、消しゴムにしたときには線の太さも太く指定しています。