next2d-development-mcp 1.1.2 → 1.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/references/framework-specs.md +99 -68
  2. package/dist/references/player-specs.md +113 -1
  3. package/package.json +12 -12
package/dist/references/framework-specs.md CHANGED
@@ -513,9 +513,11 @@ src/config/
513
513
  └── routing.json # ルーティング設定
514
514
  ```
515
515
 
516
+ ---
517
+
516
518
  ## stage.json
517
519
 
518
- 表示領域（Stage）の設定を行うJSONファイルです。
520
+ 表示領域（Stage）の設定を行うJSONファイルです。アプリ起動時に一度だけ読み込まれ、Stageの初期パラメータとして使用されます。
519
521
 
520
522
  ```json
521
523
  {
@@ -534,22 +536,30 @@ src/config/
534
536
 
535
537
  | プロパティ | 型 | デフォルト | 説明 |
536
538
  |-----------|------|----------|------|
537
- | `width` | number | 240 | 表示領域の幅 |
538
- | `height` | number | 240 | 表示領域の高さ |
539
- | `fps` | number | 60 | 1秒間に何回描画するか（1〜60） |
540
- | `options` | object | null | オプション設定 |
539
+ | `width` | number | 240 | 表示領域の幅（ピクセル単位）。実際の描画キャンバスの基準幅として使用される |
540
+ | `height` | number | 240 | 表示領域の高さ（ピクセル単位）。実際の描画キャンバスの基準高さとして使用される |
541
+ | `fps` | number | 60 | 1秒間の描画回数。指定可能な範囲は 1〜60 |
542
+ | `options` | object | null | 追加オプション設定。省略可能 |
541
543
 
542
- ### options設定
544
+ ### options 設定
543
545
 
544
546
  | プロパティ | 型 | デフォルト | 説明 |
545
547
  |-----------|------|----------|------|
546
- | `fullScreen` | boolean | false | Stageで設定した幅と高さを超えて画面全体に描画 |
547
- | `tagId` | string | null | IDを指定すると、指定したIDのエレメント内で描画を行う |
548
- | `bgColor` | string | "transparent" | 背景色を16進数で指定。デフォルトは無色透明 |
548
+ | `fullScreen` | boolean | false | `true` にするとウィンドウ全体にStageを拡張して描画する。`false` の場合は `width`・`height` で指定したサイズで固定描画 |
549
+ | `tagId` | string \| null | null | 描画先とするHTML要素のID。指定したIDのエレメント内部にキャンバスが生成される。`null` の場合は `<body>` 直下に生成される |
550
+ | `bgColor` | string | "transparent" | 背景色を16進数カラーコードで指定（例: `"#1461A0"`）。`"transparent"` を指定すると透明になる |
551
+
552
+ > [!WARNING]
553
+ > `stage.json` で有効なプロパティは上記の `width`・`height`・`fps`・`options` のみです。
554
+ > `align`・`scaleMode` などステージ表示に関わる設定であっても、`stage.json` には存在しないプロパティです。
555
+ > これらの設定が必要な場合は `config.json` に記述してください。
556
+ > 上記以外のプロパティを記述しても、フレームワークは一切処理しません。
557
+
558
+ ---
549
559
 
550
560
  ## config.json
551
561
 
552
- 環境ごとの設定を管理するファイルです。`local`、`dev`、`stg`、`prd`、`all`と区切られており、`all`以外は任意の環境名です。
562
+ 環境ごとの設定を管理するファイルです。ビルド時に `--env` オプションで指定した環境名のオブジェクトと `all` オブジェクトがマージされ、アプリケーション全体で参照可能な設定として展開されます。
553
563
 
554
564
  ```json
555
565
  {
@@ -584,20 +594,68 @@ src/config/
584
594
  }
585
595
  ```
586
596
 
587
- ### all設定
597
+ ### 環境キーの仕様
598
+
599
+ `local`・`dev`・`stg`・`prd` などのキー名は任意です（`all` を除く）。ビルド時に `--env=<環境名>` で一致したキーのオブジェクトが読み込まれます。
600
+
601
+ | キー | 説明 |
602
+ |------|------|
603
+ | `all` | すべての環境で共通して読み込まれる設定 |
604
+ | それ以外 | `--env` で指定した環境名と一致したときのみ読み込まれる設定 |
605
+
606
+ ### all 設定（フレームワーク予約済みプロパティ）
588
607
 
589
- `all`はどの環境でも書き出される共通変数です。
608
+ 以下のプロパティはフレームワークが自動的に処理します。
590
609
 
591
610
  | プロパティ | 型 | デフォルト | 説明 |
592
611
  |-----------|------|----------|------|
593
- | `spa` | boolean | true | Single Page ApplicationとしてURLでシーンを制御 |
594
- | `defaultTop` | string | "top" | ページトップのView。設定がない場合はTopViewクラスが起動 |
595
- | `loading.callback` | string | Loading | ローディング画面のクラス名。start関数とend関数を呼び出す |
596
- | `gotoView.callback` | string \| array | ["callback.Background"] | gotoView完了後のコールバッククラス |
612
+ | `spa` | boolean | true | `true` にするとSingle Page Applicationとして動作し、ブラウザのURLと連動してView遷移を管理する |
613
+ | `defaultTop` | string | "top" | アプリ起動時に最初に表示するViewの名前。指定しない場合は `TopView` クラスが起動する |
614
+ | `loading.callback` | string | "Loading" | ローディング画面として使用するクラス名。そのクラスの `start()` と `end()` が自動的に呼び出される |
615
+ | `gotoView.callback` | string \| string[] | — | View遷移完了後に呼び出すコールバッククラス名。配列で複数指定でき、async/awaitで順次実行される |
597
616
 
598
- ### platform設定
617
+ ### ユーザー定義プロパティ
599
618
 
600
- ビルド時の`--platform`で指定した値がセットされます。
619
+ フレームワークの予約済みプロパティ以外に、任意のプロパティをどの環境キーにも追加できます。追加したプロパティはビルド後に `config` オブジェクトから参照できます。
620
+
621
+ エンドポイントURLや機能フラグ、表示設定など、環境ごとに変える必要がある値をここで管理します。
622
+
623
+ ```json
624
+ {
625
+ "local": {
626
+ "api": {
627
+ "endPoint": "http://localhost:3000/"
628
+ }
629
+ },
630
+ "prd": {
631
+ "api": {
632
+ "endPoint": "https://api.example.com/"
633
+ }
634
+ },
635
+ "all": {
636
+ "spa": true,
637
+ "defaultTop": "top",
638
+ "align": "TL",
639
+ "scaleMode": "noScale"
640
+ }
641
+ }
642
+ ```
643
+
644
+ ```typescript
645
+ import { config } from "@/config/Config";
646
+
647
+ // ユーザー定義プロパティへのアクセス
648
+ const align = config.align; // "TL"
649
+ const scaleMode = config.scaleMode; // "noScale"
650
+ ```
651
+
652
+ > [!WARNING]
653
+ > `config.json` でフレームワークが自動処理するプロパティは `spa`・`defaultTop`・`loading`・`gotoView` のみです。
654
+ > それ以外のプロパティはフレームワークが直接処理することはありませんが、`config` オブジェクト経由でアプリケーションコードから自由に参照できます。
655
+
656
+ ### platform 設定
657
+
658
+ ビルド時の `--platform` で指定した値が自動的にセットされます。設定ファイルに記述する必要はなく、読み取り専用です。
601
659
 
602
660
  対応値: `macos`, `windows`, `linux`, `ios`, `android`, `web`
603
661
 
@@ -609,6 +667,8 @@ if (config.platform === "ios") {
609
667
  }
610
668
  ```
611
669
 
670
+ ---
671
+
612
672
  ## routing.json
613
673
 
614
674
  ルーティングの設定ファイルです。詳細は[ルーティング](/ja/reference/framework/routing)を参照してください。
@@ -630,45 +690,13 @@ if (config.platform === "ios") {
630
690
  }
631
691
  ```
632
692
 
633
- ## 設定値の取得
634
-
635
- コード内で設定値を取得するには`config`オブジェクトを使用します。
636
-
637
- ### Config.tsの例
693
+ ---
638
694
 
639
- ```typescript
640
- import stageJson from "./stage.json";
641
- import configJson from "./config.json";
642
-
643
- interface IStageConfig {
644
- width: number;
645
- height: number;
646
- fps: number;
647
- options: {
648
- fullScreen: boolean;
649
- tagId: string | null;
650
- bgColor: string;
651
- };
652
- }
695
+ ## 設定値の取得
653
696
 
654
- interface IConfig {
655
- stage: IStageConfig;
656
- api: {
657
- endPoint: string;
658
- };
659
- content: {
660
- endPoint: string;
661
- };
662
- spa: boolean;
663
- defaultTop: string;
664
- platform: string;
665
- }
697
+ `Config.ts` は `npm start` 実行時に自動生成されるファイルです。手動で作成・編集する必要はありません。
666
698
 
667
- export const config: IConfig = {
668
- stage: stageJson,
669
- ...configJson
670
- };
671
- ```
699
+ コード内で設定値を取得するには、自動生成された `config` オブジェクトをインポートして使用します。
672
700
 
673
701
  ### 使用例
674
702
 
@@ -676,7 +704,7 @@ export const config: IConfig = {
676
704
  import { config } from "@/config/Config";
677
705
 
678
706
  // ステージ設定
679
- const stageWidth = config.stage.width;
707
+ const stageWidth = config.stage.width;
680
708
  const stageHeight = config.stage.height;
681
709
 
682
710
  // API設定
@@ -686,9 +714,11 @@ const apiEndPoint = config.api.endPoint;
686
714
  const isSpa = config.spa;
687
715
  ```
688
716
 
717
+ ---
718
+
689
719
  ## ローディング画面
690
720
 
691
- `loading.callback`で設定したクラスの`start`関数と`end`関数が呼び出されます。
721
+ `loading.callback` で設定したクラスの `start()` と `end()` が自動的に呼び出されます。
692
722
 
693
723
  ```typescript
694
724
  export class Loading
@@ -715,9 +745,11 @@ export class Loading
715
745
  }
716
746
  ```
717
747
 
718
- ## gotoViewコールバック
748
+ ---
749
+
750
+ ## gotoView コールバック
719
751
 
720
- `gotoView.callback`で設定したクラスの`execute`関数が呼び出されます。複数のクラスを配列で設定でき、async/awaitで順次実行されます。
752
+ `gotoView.callback` で設定したクラスの `execute()` が呼び出されます。配列で複数のクラスを指定でき、async/await で順次実行されます。
721
753
 
722
754
  ```typescript
723
755
  import { app } from "@next2d/framework";
@@ -744,6 +776,8 @@ export class Background
744
776
  }
745
777
  ```
746
778
 
779
+ ---
780
+
747
781
  ## ビルドコマンド
748
782
 
749
783
  環境を指定してビルド:
@@ -767,6 +801,8 @@ npm run build -- --platform=ios
767
801
  npm run build -- --platform=android
768
802
  ```
769
803
 
804
+ ---
805
+
770
806
  ## 設定例
771
807
 
772
808
  ### 完全な設定ファイルの例
@@ -822,11 +858,15 @@ npm run build -- --platform=android
822
858
  },
823
859
  "gotoView": {
824
860
  "callback": ["callback.Background"]
825
- }
861
+ },
862
+ "align": "TL",
863
+ "scaleMode": "noScale"
826
864
  }
827
865
  }
828
866
  ```
829
867
 
868
+ ---
869
+
830
870
  ## 関連項目
831
871
 
832
872
  - [ルーティング](/ja/reference/framework/routing)
@@ -1068,15 +1108,6 @@ export class HomeDataCallback
1068
1108
  - 引数を省略した場合は、現在のURLから遷移先が解決されます（SPAの`popstate`時）。
1069
1109
  - 遷移開始時に前回の`response`マップはクリアされます。
1070
1110
 
1071
- `gotoView`実行シーケンス（詳細）:
1072
-
1073
- 1. 前回遷移で保持していた`response`マップを初期化します。
1074
- 2. `name`または現在URLから遷移先ルートを解決し、クエリを分解します。
1075
- 3. `all.spa: true`かつ通常遷移時はHistory API（`pushState`）でURL履歴を更新します。
1076
- 4. 遷移先`requests`を実行し、`name`キー単位で`response`/`cache`へ格納します。
1077
- 5. `requests.callback`と`gotoView.callback`を順次実行します。
1078
- 6. 旧Viewの`onExit`/unbind後に新View/ViewModelをbindし、`initialize`完了後に`onEnter`を呼び出します。
1079
-
1080
1111
  ```typescript
1081
1112
  import { app } from "@next2d/framework";
1082
1113
 
package/dist/references/player-specs.md CHANGED
@@ -265,6 +265,7 @@ DisplayObjectは、Next2D Playerにおける全ての表示オブジェクトの
265
265
  | `visible` | boolean | 表示オブジェクトが可視かどうか（デフォルト: true） |
266
266
  | `x` | number | 親DisplayObjectContainerのローカル座標を基準にしたX座標 |
267
267
  | `y` | number | 親DisplayObjectContainerのローカル座標を基準にしたY座標 |
268
+ | `cacheAsBitmap` | Matrix \| null | ベクター描画やコンテナをビットマップとしてキャッシュするMatrix（nullで解除、Videoには適用不可） |
268
269
 
269
270
  ## メソッド (Methods)
270
271
 
@@ -377,6 +378,108 @@ const state = displayObject.getGlobalVariable("gameState");
377
378
  displayObject.clearGlobalVariable(); // 全てクリア
378
379
  ```
379
380
 
381
+ ### cacheAsBitmapの例
382
+
383
+ `cacheAsBitmap`はベクター描画やコンテナをビットマップとしてキャッシュし、2回目以降の描画でキャッシュを再利用することでパフォーマンスを向上させるプロパティです。
384
+
385
+ **適用対象クラス:**
386
+ - `Shape` — ベクター描画のキャッシュ
387
+ - `TextField` — テキスト描画のキャッシュ
388
+ - `Sprite` — コンテナとその子要素をまとめてキャッシュ
389
+ - `MovieClip` — コンテナとその子要素をまとめてキャッシュ
390
+
391
+ > ⚠️ `Video`には適用できません。Videoは画像サイズが固定されているため、キャッシュの効果がありません。
392
+
393
+ **Matrixの制限:**
394
+ Matrixにはスケール値（a, d）のみ設定できます。回転（b, c）や移動（tx, ty）は無視されます。
395
+
396
+ ```typescript
397
+ // ✅ 正しい使い方（スケールのみ設定）
398
+ shape.cacheAsBitmap = new Matrix(1, 0, 0, 1, 0, 0); // 等倍
399
+ shape.cacheAsBitmap = new Matrix(2, 0, 0, 2, 0, 0); // 2倍品質
400
+
401
+ // ❌ 回転・移動の値は無視される
402
+ shape.cacheAsBitmap = new Matrix(1, 0.5, 0.5, 1, 100, 200); // b, c, tx, tyは無視
403
+ ```
404
+
405
+ **利用用途の例:**
406
+
407
+ 1. **速度の速いアニメーション** — 高速で動くオブジェクトは視認性が低いため、キャッシュによる画質低下が目立たず、パフォーマンス向上が期待できます
408
+ 2. **静的な背景やUI部品** — 変化しないUI要素（パネル、装飾、アイコンなど）をキャッシュすることで毎フレームの再描画コストを削減できます
409
+ 3. **複雑なベクター描画** — パスが多い複雑なShapeをキャッシュすることで描画負荷を大幅に軽減できます
410
+
411
+ ```typescript
412
+ const { Shape, Sprite } = next2d.display;
413
+ const { Matrix } = next2d.geom;
414
+
415
+ // 等倍でキャッシュ（1.0基準 = displayObjectのscaleX/scaleYに対する等倍）
416
+ const shape = new Shape();
417
+ shape.graphics.beginFill(0xFF0000).drawCircle(50, 50, 40).endFill();
418
+ shape.cacheAsBitmap = new Matrix(1, 0, 0, 1, 0, 0);
419
+
420
+ // 2倍の解像度でキャッシュ（自身のスケールの2倍品質）
421
+ const hqShape = new Shape();
422
+ hqShape.graphics.beginFill(0x00FF00).drawRect(0, 0, 100, 80).endFill();
423
+ hqShape.cacheAsBitmap = new Matrix(2, 0, 0, 2, 0, 0);
424
+
425
+ // scaleX/scaleYが反映される（キャッシュ品質 = Matrix × 自身のスケール × stageスケール）
426
+ shape.scaleX = 2; // キャッシュ品質: 1 × 2 × stageScale
427
+ shape.scaleY = 2;
428
+
429
+ // 親のスケールはキャッシュ品質に影響しない（描画位置には反映される）
430
+ const container = new Sprite();
431
+ container.scaleX = 3;
432
+ container.scaleY = 3;
433
+ container.addChild(shape);
434
+
435
+ // ヒットテスト・幅・高さはベクター基準
436
+ const bounds = shape.getBounds(shape); // ベクターの境界を返す
437
+
438
+ // キャッシュを解除
439
+ shape.cacheAsBitmap = null;
440
+ ```
441
+
442
+ ### DisplayObjectContainerでのcacheAsBitmap
443
+
444
+ `Sprite`や`MovieClip`などの`DisplayObjectContainer`に対しても`cacheAsBitmap`を設定できます。
445
+ コンテナの全子要素をまとめてテクスチャにキャッシュし、以降のフレームではキャッシュされたテクスチャを再利用します。
446
+
447
+ ```typescript
448
+ const { Shape, Sprite, MovieClip } = next2d.display;
449
+ const { Matrix } = next2d.geom;
450
+
451
+ // 複数の子要素を持つSprite
452
+ const sprite = new Sprite();
453
+ const rect = new Shape();
454
+ rect.graphics.beginFill(0xFF0000).drawRect(0, 0, 100, 80).endFill();
455
+ sprite.addChild(rect);
456
+ const circle = new Shape();
457
+ circle.graphics.beginFill(0x00FF00).drawCircle(50, 40, 30).endFill();
458
+ sprite.addChild(circle);
459
+
460
+ // コンテナ全体をビットマップキャッシュ
461
+ sprite.cacheAsBitmap = new Matrix(1, 0, 0, 1, 0, 0);
462
+
463
+ // MovieClipにも同様に適用可能
464
+ const mc = new MovieClip();
465
+ mc.cacheAsBitmap = new Matrix(1, 0, 0, 1, 0, 0);
466
+
467
+ // キャッシュを解除（次フレームから通常描画に戻る）
468
+ sprite.cacheAsBitmap = null;
469
+ ```
470
+
471
+ **キャッシュの動作:**
472
+ - 先祖や自身のスケールが変更されるとキャッシュが無効化され、次フレームで再生成されます
473
+ - 位置（x, y）の変更ではキャッシュは維持され、描画位置のみ更新されます
474
+ - スケールが頻繁に変化するアニメーション中はキャッシュが毎フレーム再生成されるため、アニメーション完了後の静的な状態で最も効果を発揮します
475
+
476
+ **注意事項:**
477
+ - **Matrixにはスケール値のみ設定可能**です（回転・移動は無視されます）
478
+ - **Videoには適用できません**（固定サイズの画像データのため）
479
+ - キャッシュ中は子要素の変更（追加・削除・プロパティ変更）が画面に反映されません
480
+ - `stage.rendererScale`が変更されるとキャッシュが自動的に無効化されます
481
+ - `filter`と`cacheAsBitmap`を同時に設定した場合、`cacheAsBitmap`が優先されます
482
+
380
483
  ## 関連項目
381
484
 
382
485
  - [MovieClip](/ja/reference/player/movie-clip)
@@ -727,6 +830,7 @@ classDiagram
727
830
  | `mouseChildren` | `boolean` | オブジェクトの子がマウスまたはユーザー入力デバイスに対応しているかどうかを判断する |
728
831
  | `mask` | `DisplayObject \| null` | 呼び出し元の表示オブジェクトをマスクする指定されたマスクオブジェクト |
729
832
  | `isContainerEnabled` | `boolean` | コンテナの機能を所持しているかを返却（読み取り専用） |
833
+ | `cacheAsBitmap` | `Matrix \| null` | ベクター描画やコンテナをビットマップとしてキャッシュするMatrix（nullで解除） |
730
834
 
731
835
  ## メソッド
732
836
 
@@ -1160,7 +1264,8 @@ stage.addChild(frontShape);
1160
1264
 
1161
1265
  ```typescript
1162
1266
  // 複雑な図形をビットマップとしてキャッシュ
1163
- shape.cacheAsBitmap = true;
1267
+ const { Matrix } = next2d.geom;
1268
+ shape.cacheAsBitmap = new Matrix(1, 0, 0, 1, 0, 0);
1164
1269
  ```
1165
1270
 
1166
1271
  ## Graphics クラス
@@ -1739,6 +1844,7 @@ classDiagram
1739
1844
  | `mouseY` | number | Yes | - | 対象のDisplayObjectの基準点からのy軸の位置（ピクセル） |
1740
1845
  | `dropTarget` | Sprite \| null | Yes | null | スプライトのドラッグ先またはドロップされた先の表示オブジェクト |
1741
1846
  | `isMask` | boolean | No | false | マスクとしてDisplayObjectにセットされているかを示します |
1847
+ | `cacheAsBitmap` | Matrix \| null | No | null | ベクター描画やコンテナをビットマップとしてキャッシュするMatrix（nullで解除） |
1742
1848
 
1743
1849
  ## メソッド
1744
1850
 
@@ -1992,6 +2098,12 @@ classDiagram
1992
2098
  | `xScrollShape` | Shape | xスクロールバーの表示用のShapeオブジェクト（読み取り専用） |
1993
2099
  | `yScrollShape` | Shape | yスクロールバーの表示用のShapeオブジェクト（読み取り専用） |
1994
2100
 
2101
+ ### DisplayObjectから継承されるプロパティ
2102
+
2103
+ | プロパティ | 型 | 説明 |
2104
+ |-----------|------|------|
2105
+ | `cacheAsBitmap` | Matrix \| null | テキスト描画をビットマップとしてキャッシュするMatrix（nullで解除） |
2106
+
1995
2107
  ## メソッド
1996
2108
 
1997
2109
  | メソッド | 戻り値 | 説明 |
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "next2d-development-mcp",
3
3
  "displayName": "Next2D Development MCP",
4
- "version": "1.1.2",
4
+ "version": "1.1.5",
5
5
  "description": "MCP server for Next2D application development assistance",
6
6
  "type": "module",
7
7
  "author": "Toshiyuki Ienaga <ienaga@next2d.app>",
@@ -48,23 +48,23 @@
48
48
  ]
49
49
  },
50
50
  "dependencies": {
51
- "@modelcontextprotocol/sdk": "^1.27.1"
51
+ "@modelcontextprotocol/sdk": "^1.29.0"
52
52
  },
53
53
  "devDependencies": {
54
54
  "@eslint/js": "^10.0.1",
55
- "@types/node": "^25.3.1",
56
- "@types/vscode": "^1.109.0",
57
- "@typescript-eslint/eslint-plugin": "^8.56.1",
58
- "@typescript-eslint/parser": "^8.56.1",
59
- "@vscode/vsce": "^3.7.1",
60
- "eslint": "^10.0.2",
55
+ "@types/node": "^25.6.0",
56
+ "@types/vscode": "^1.115.0",
57
+ "@typescript-eslint/eslint-plugin": "^8.58.2",
58
+ "@typescript-eslint/parser": "^8.58.2",
59
+ "@vscode/vsce": "^3.8.0",
60
+ "eslint": "^10.2.0",
61
61
  "eslint-plugin-unused-imports": "^4.4.1",
62
- "globals": "^17.3.0",
63
- "typescript": "^5.9.3",
64
- "vitest": "^4.0.18"
62
+ "globals": "^17.5.0",
63
+ "typescript": "^6.0.2",
64
+ "vitest": "^4.1.4"
65
65
  },
66
66
  "engines": {
67
67
  "node": ">=22.0.0",
68
- "vscode": "^1.109.0"
68
+ "vscode": "^1.110.0"
69
69
  }
70
70
  }