⬆️ upstream そのまま — upstream の実装をほぼそのまま利用
スプライトの見た目(コスチューム)の編集機能。コスチュームライブラリからの選択、自分で描く(ペイントエディタ)、ファイルから取り込む、コスチューム間の切替を行う。upstream Scratch から継承しており、Smalruby 固有の改良はない。
ステージの背景 (backdrop) も技術的にはコスチュームの一種で、同じ仕組みで管理される(docs/stage/ 参照)。
- 小学生として、スプライトに複数のコスチュームを持たせて、アニメーションのように切替えたい
- 作品を作る子として、自分で描いた絵(PNG / SVG)をコスチュームとして使いたい
- 発表会の出展者として、ライブラリの素材を組み合わせて見栄えのするキャラクターを作りたい
エディタ上部のタブで コスチューム タブを選択:
- 左カラムにコスチューム一覧
- 右カラムにペイントエディタ
- 「+」ボタン → コスチュームライブラリ / カメラ / ファイル / 自分で描く
ペイントエディタは upstream の scratch-paint を統合。
| ファイル | 役割 |
|---|---|
packages/scratch-gui/src/containers/costume-tab.jsx |
コスチュームタブのメインコンテナ |
packages/scratch-gui/src/containers/costume-library.jsx |
コスチュームライブラリモーダル |
packages/scratch-gui/src/containers/paint-editor-wrapper.jsx |
ペイントエディタのラッパー |
packages/scratch-gui/src/components/asset-panel/ |
アセット (コスチューム/サウンド) パネル UI |
packages/scratch-gui/src/lib/get-costume-url.js |
コスチューム URL の生成 |
packages/scratch-gui/src/lib/empty-assets.js |
空コスチュームの定義 |
packages/scratch-gui/src/lib/bmp-converter.js— BMP → PNG 変換packages/scratch-gui/src/lib/data-uri-to-blob.js— Data URI → Blob 変換packages/scratch-gui/src/lib/gif-decoder.js— アニメーション GIF 分解packages/scratch-gui/src/lib/import-csv.js— CSV インポート(リスト用、コスチュームと共通)
packages/scratch-svg-renderer/ — SVG 処理(描画前処理、サイズ計測など)
packages/scratch-render/ — WebGL レンダリング
なし。
コスチューム自体を操作するブロックのみ列挙(見た目全般のブロックは含めない):
| ブロック | 説明 |
|---|---|
looks_switchcostumeto |
指定コスチュームに切替 |
looks_nextcostume |
次のコスチュームに切替 |
looks_costume |
コスチューム選択メニュー(引数用) |
looks_costumenumbername |
現在のコスチュームの番号 / 名前を取得 |
「見た目」全般(
looks_say,looks_show,looks_changesizebyなど)はコスチュームに直接関係しないため含めない。各ブロックの Ruby 表現はdocs/smalruby-language-spec.ja.mdを参照。
なし(コスチュームデータはプロジェクトの一部として .sb3 に保存される)。
ペイントエディタは別パッケージ (scratch-paint) を統合している。本リポジトリでは管理外。
docs/sprite/— コスチュームを持つスプライトdocs/stage/— 背景もコスチュームの一種docs/sound/— サウンドも同じアセットパネル
upstream そのままの機能のため、Smalruby 固有の Issue はほとんどなし。
