提供: Japanese Scratch-Wiki
ペンはScratchに用意されている機能の1つで、スプライトを使って画面上に図形を描画したり、ピクセル単位でカラフルな線を引いたりできる。この機能を使うときは、ペン拡張機能を使用する。
直線、点、長方形、円など比較的簡単に描ける図形のほか、数式などをうまく利用すれば、どんな形でも描くことができる。
ペンに関連するブロック
- 詳細は「ペン拡張機能」を参照
- 消す — 画面上にペンで描かれた内容をすべて消す
- ペンを下ろす — スプライトのペン機能をオンにする。これによって、スプライトが画面上を動いたとき、動いた道すじにペンによる線が描かれるようになる。これは、ペン機能がオフになるまでつづく。
- ペンを上げる — スプライトのペン機能をオフにする。スプライトが動いても線が描かれないようになる。
- ペンの色を (カラー) にする — ペンの色をカラーピッカー（スポイトツール）で選択した色にする。
- ペンの () を (数値) にする — ペンの色の状態を数値で指定した色にする。
- ペンの () を () ずつ変える — ペンの色の状態を、現在の色から指定した値だけ変える。
- ペンの太さを () ずつ変える — ペンの太さを、現在の太さから指定した値だけ変える。
- ペンの太さを () にする — ペンの太さを、指定した値にする。
- スタンプ — スプライトの現在の見た目をステージ上にコピーする
Flashプレイヤーに由来する問題
|
この項目またはセクションには、Scratch 3.0の現行バージョンに含まれていない機能が記載されています。これは歴史的な観点からのみ有用です。 |
Flashプレイヤーが原因で、ペンの太さの最大値が255に制限されている。
またFlashプレイヤーに起因する問題としてはそのほかに、ペンの太さが1にしたとき、対象のピクセル全体が描画されないというものがある。ピクセルの一部に色が塗られていない透明な部分ができてしまうのだ。Flashプレイヤーで1ピクセル分を正確に塗りたいときは、ペンの太さを「2」にする必要がある。
なお、このバグを逆手に取って意図的に後ろが透けて見える画像を描画することもできる。ただし、ターボモードでもピクセル単位で画像を描画するのは時間がかかる処理になるため、半透明の画像が使いたいだけであれば、幽霊の画像効果を使ったほうが効率はよい。
使用例
ペンは、おもに次のような目的で使用される：
- ヘビゲームタイプのゲーム
- スプライトの動いた跡（軌跡）を表示
- アニメーション
- 1S1Sプロジェクトで物体を描画
- 模様、パターンなどを描画
- グラフを作成
- お絵かきプログラムを作成する
- 3D プロジェクトで物体を描画
- テキストレンダリング
透明ペン
- 詳細は「コンピューターの色」を参照
Scratch 2.0のv435.2[1]以降、透明ペンの機能が追加された。これを使うと、下に描かれたものが透けて見える線を描くことができる。
Scratch 3.0では、正式に透明度を指定できる。
RGB／ARGB表現
ARGB (別名：RGBA) は、RGB (Red (赤)、Green (緑) 、Blue (青)) による光の三原色に、A (アルファチャンネル) による透過度を追加した色の表現方法である。 アルファチチャンネルの値は1〜255までの数値で表され、1が完全な透明、255が完全な不透明（まったく透けない状態）を表す。 まず、アルファチャンネルを使わない場合のRGBによる色の指定方法は次のとおり：
ペンの色を ((((R) * (65536)) + ((G) * (256))) + (B)) にする // このブロックは、下のカラーボックスを指定するタイプのブロックでなければいけない（数値を入れるタイプのブロックではない）。これを間違えると、意図しない色になってしまう。 ペンの色を [#0000FF] にする
アルファチャンネルを追加したARGBによる色の指定方法は次のとおり：
ペンの色を ((((A) * (16777216)) + ((R) * (65536))) + (((G) * (256)) + (B))) にする
警告: これらの式を使うときは、A、R、G、Bがすべて整数でなければいけない。これらに小数が含まれる場合、下位の値に影響してしまうからだ（たとえば、Rの値が小数の場合、下位の桁にあるGやBが意図しない値として扱われる）。このような間違いを防ぐには、次のコードを使用すると良いだろう。
ペンの色を (((((A) を四捨五入) * (16777216)) + (((R) を四捨五入) * (65536))) + ((((G) を四捨五入) * (256)) + ((B) を四捨五入))) にする
「画面を再描画せずに実行する」オプション
カスタムブロック定義で「画面を再描画せずに実行する」 オプションをチェックすると、ブロック内の処理がすべて終わった段階で一度だけ画面を更新されるため、処理のスピードがアップする。ペンで描画するカスタムブロックをつくるとき、描画の途中の様子を見せたい場合以外は、［オプション］を開いて、このオプションをチェックしておくとよいだろう。次に、カスタムブロックをつかってScratchのステージ上にペンで画像を描画する例を2つ示す。どちらも画像をピクセルごとの色に分解したデータを用意しておき、それを使って元の画像をペンで描画するスクリプトである。違いは、1つめのスクリプトは画像データとしてリストを、2つめのスクリプトは画像データとして文字列変数を使っている点である。
定義 画像を描画
[繰り返し番号 v] を (0) にする // 画像データリストに用意した色の中から1つずつ色を拾っていくための変数
ペンの太さを (2) にする // Flashプレイヤーのバグを避けるためペンサイズを2に
x座標を (-240) 、y座標を (180) にする // 開始位置
(360) 回繰り返す // y方向の繰り返し
(480) 回繰り返す // x方向の繰り返し
[繰り返し番号 v] を (1) ずつ変える
ペンの色を ([画像データリスト v]の(繰り返し番号) 番目:: list) にする // ペンの色を画像データリストで指定したものにする
ペンを下ろす
ペンを上げる
x座標を (1) ずつ変える
end
x座標を (-240) にする // 画面の左端に戻る
y座標を (-1) ずつ変える
end
2つめは、文字列変数にピクセルごとの色情報を保存したものを画像データとして利用するスクリプトである。
定義 画像を描画
[繰り返し番号 v] を (0) にする // 色指定用の文字列の中から1つずつ色を拾っていくための変数
ペンの太さを (2) にする // Flashプレイヤーのバグを避けるためペンサイズを2に
x座標を (-240) 、y座標を (180) にする // 開始位置
(360) 回繰り返す // y方向の繰り返し
(480) 回繰り返す // x方向の繰り返し
[繰り返し番号 v] を (3) ずつ変える // 3文字ずつ取り出すため、3つずつずらす (色の最大値は200なので、3文字分あればよい)
[現在の色 v] を [] にする // 「画像データ」から色を取り出すための一時的な変数
[現在の色 v] を ((画像データ)の((繰り返し番号) - (2)) 番目の文字::operators) にする
[現在の色 v] を ((現在の色) と ((画像データ)の((繰り返し番号) - (1)) 番目の文字::operators)) にする
[現在の色 v] を ((現在の色) と ((画像データ)の((繰り返し番号) - (1)) 番目の文字::operators)) にする
ペンの色を (現在の色) にする // 取り出した「現在の色」をペンの色にする
ペンを下ろす
ペンを上げる
x座標を (1) ずつ変える
end
x座標を (-240) にする // 画面の左端に戻る
y座標を (-1) ずつ変える
end
もちろん、画像データとして、Scratchの画面ピクセルのすべての色（360*480=172800色）を含んだリストや変数を用意してもよいのだが、スクリプトを工夫すればもう少し解像度の低い画像にして、データ量を減らすことができる。また、上記のスクリプトを応用すれば、ユーザーが描いた絵をリストに保存する画像編集ソフトをつくることも可能である。
