@maoyugames/phaser-framework 1.0.4 → 1.0.6

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 (4) hide show
  1. package/dist/cli/index.js +134 -87
  2. package/dist/index.d.ts +72 -5
  3. package/dist/index.js +113 -34
  4. package/package.json +1 -1
package/dist/cli/index.js CHANGED
@@ -3,7 +3,7 @@ import '../chunk-PKBMQBKP.js';
3
3
  import pc6 from 'picocolors';
4
4
  import { resolve, join, extname, relative, basename, dirname } from 'path';
5
5
  import { randomBytes } from 'crypto';
6
- import fse4 from 'fs-extra';
6
+ import fse from 'fs-extra';
7
7
  import { createRequire } from 'module';
8
8
  import { fileURLToPath } from 'url';
9
9
  import { existsSync, mkdirSync, writeFileSync, readFile, readFileSync } from 'fs';
@@ -461,6 +461,72 @@ export default config;
461
461
  `;
462
462
  }
463
463
 
464
+ // src/cli/shells/tiktok.ts
465
+ var DEFAULT_SDK_URL = "https://connect.tiktok-minis.com/game/sdk.js";
466
+ function renderTikTokHtml(cfg, scriptSrc) {
467
+ const title = escapeHtml(cfg?.title ?? "TikTok Mini Game");
468
+ const sdkUrl = cfg?.sdkUrl ?? DEFAULT_SDK_URL;
469
+ const clientKey = cfg?.clientKey ?? "";
470
+ const sdkTag = sdkUrl ? `<!--
471
+ TikTok Mini Games(Minis)SDK \u6CE8\u5165:\u5FC5\u987B\u5728 <head> \u4E2D\u3001\u7D27\u8DDF\u5176\u540E\u4E00\u4E2A init \u8C03\u7528,
472
+ \u5BA1\u6838\u811A\u672C\u6309\u6B64 pattern \u68C0\u6D4B;\u8BE6\u89C1 @ttmg/cli \u7684 init \u6D41\u7A0B\u3002
473
+ -->
474
+ <script src="${escapeAttr(sdkUrl)}"></script>` : "";
475
+ const initTag = sdkUrl ? `<script>
476
+ window.TTMinis = TTMinis;
477
+ TTMinis.game.init({ clientKey: "${escapeAttr(clientKey)}" });
478
+ </script>` : "";
479
+ return `<!doctype html>
480
+ <html lang="en">
481
+ <head>
482
+ <meta charset="UTF-8" />
483
+ <meta
484
+ name="viewport"
485
+ content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
486
+ />
487
+ <title>${title}</title>
488
+ ${sdkTag}
489
+ ${initTag}
490
+ <style>
491
+ html,
492
+ body {
493
+ margin: 0;
494
+ padding: 0;
495
+ width: 100%;
496
+ height: 100%;
497
+ background: #000;
498
+ overflow: hidden;
499
+ box-sizing: border-box;
500
+ }
501
+ #game-root {
502
+ width: 100%;
503
+ height: 100%;
504
+ }
505
+ #game-root canvas {
506
+ display: block;
507
+ margin: 0 auto;
508
+ }
509
+ </style>
510
+ </head>
511
+ <body>
512
+ <!-- \u6E38\u620F\u753B\u5E03\u6302\u8F7D\u70B9 -->
513
+ <div id="game-root"></div>
514
+ <!-- TikTok \u5E73\u53F0\u5165\u53E3:\u4EC5\u9759\u6001 import TikTok \u9002\u914D\u5668 -->
515
+ <script type="module" src="${scriptSrc}"></script>
516
+ </body>
517
+ </html>
518
+ `;
519
+ }
520
+ function renderTikTokMinigameConfig(cfg) {
521
+ const orientation = (cfg?.orientation ?? "portrait").toLowerCase() === "landscape" ? "HORIZONTAL" : "VERTICAL";
522
+ const obj = {
523
+ _comment: "orientation is the orientation of the game. It can be either 'VERTICAL' or 'HORIZONTAL'. our game default is VERTICAL; minigame.config.json dev is a configuration file for minigame development. You can use it to configure the minigame.",
524
+ orientation,
525
+ dev: { port: 9527 }
526
+ };
527
+ return JSON.stringify(obj, null, 2) + "\n";
528
+ }
529
+
464
530
  // src/cli/shells/wechat.ts
465
531
  function renderGameJs() {
466
532
  return `/**
@@ -531,14 +597,32 @@ function renderWeChatShells(cfg) {
531
597
  }
532
598
 
533
599
  // src/cli/inject.ts
600
+ function removeEmptyFiles(dir) {
601
+ const removed = [];
602
+ const walk = (cur) => {
603
+ if (!fse.existsSync(cur)) return;
604
+ for (const name of fse.readdirSync(cur)) {
605
+ const full = join(cur, name);
606
+ const st = fse.statSync(full);
607
+ if (st.isDirectory()) {
608
+ walk(full);
609
+ } else if (st.size === 0) {
610
+ fse.removeSync(full);
611
+ removed.push(full);
612
+ }
613
+ }
614
+ };
615
+ walk(dir);
616
+ return removed;
617
+ }
534
618
  function wechatVendorDirs(projectRoot) {
535
619
  return [resolve(projectRoot, "wechat/vendor"), resolve(projectRoot, "platforms/wechat/vendor")];
536
620
  }
537
621
  function writeShellFiles(distDir, projectRoot, files) {
538
622
  for (const f of files) {
539
623
  const dst = join(distDir, f.relPath);
540
- fse4.ensureDirSync(resolve(dst, ".."));
541
- fse4.writeFileSync(dst, f.content, "utf-8");
624
+ fse.ensureDirSync(resolve(dst, ".."));
625
+ fse.writeFileSync(dst, f.content, "utf-8");
542
626
  console.log(pc6.green(` \u2713 ${f.relPath} \u2192 ${relative(projectRoot, dst)}`));
543
627
  }
544
628
  }
@@ -546,8 +630,23 @@ function injectShell(opts) {
546
630
  const { platform, projectRoot, distDir, config } = opts;
547
631
  switch (platform) {
548
632
  case "web":
549
- case "tiktok":
550
633
  return true;
634
+ case "tiktok": {
635
+ console.log(pc6.cyan(` \u25B6 [tiktok] \u6CE8\u5165 minigame.config.json + \u6E05\u7406\u7A7A\u6587\u4EF6`));
636
+ writeShellFiles(distDir, projectRoot, [
637
+ { relPath: "minigame.config.json", content: renderTikTokMinigameConfig(config.tiktok) }
638
+ ]);
639
+ const removed = removeEmptyFiles(distDir);
640
+ if (removed.length > 0) {
641
+ console.log(pc6.gray(` \u6E05\u7406 ${removed.length} \u4E2A\u7A7A\u6587\u4EF6: ${removed.map((p) => relative(distDir, p)).join(", ")}`));
642
+ }
643
+ if (!config.tiktok?.clientKey) {
644
+ console.log(pc6.yellow(pc6.bold(" \u26A0 platform.config.tiktok.clientKey \u672A\u914D\u7F6E")));
645
+ console.log(pc6.yellow(' index.html \u5DF2\u6CE8\u5165 TTMinis.game.init({clientKey: ""}),\u63D0\u5BA1\u4F1A\u88AB\u62D2\u3002'));
646
+ console.log(pc6.yellow(" \u8BF7\u5728 platform.config.ts \u7684 tiktok \u6BB5\u586B clientKey(\u5F00\u53D1\u8005\u540E\u53F0\u62FF)\u3002"));
647
+ }
648
+ return true;
649
+ }
551
650
  case "facebook": {
552
651
  console.log(pc6.cyan(` \u25B6 [facebook] \u6CE8\u5165\u5916\u58F3\u6587\u4EF6`));
553
652
  writeShellFiles(distDir, projectRoot, [renderFacebookAppConfig(config.facebook)]);
@@ -556,7 +655,7 @@ function injectShell(opts) {
556
655
  case "capacitor": {
557
656
  console.log(pc6.cyan(` \u25B6 [capacitor] \u751F\u6210 capacitor.config.ts(\u9879\u76EE\u6839)`));
558
657
  const capCfgPath = resolve(projectRoot, "capacitor.config.ts");
559
- fse4.writeFileSync(capCfgPath, renderCapacitorConfig(config.capacitor), "utf-8");
658
+ fse.writeFileSync(capCfgPath, renderCapacitorConfig(config.capacitor), "utf-8");
560
659
  console.log(pc6.green(` \u2713 capacitor.config.ts \u2192 ${relative(projectRoot, capCfgPath)}`));
561
660
  return true;
562
661
  }
@@ -573,22 +672,22 @@ function injectShell(opts) {
573
672
  }
574
673
  function copyPublicAssetsToWechat(projectRoot, distDir) {
575
674
  const srcPublic = resolve(projectRoot, "src/game/public");
576
- if (!fse4.existsSync(srcPublic)) return;
675
+ if (!fse.existsSync(srcPublic)) return;
577
676
  console.log(pc6.cyan(" \u25B6 [wechat] \u62F7\u8D1D\u4E1A\u52A1\u9759\u6001\u8D44\u6E90(src/game/public)"));
578
- fse4.copySync(srcPublic, distDir);
677
+ fse.copySync(srcPublic, distDir);
579
678
  console.log(pc6.green(" \u2713 src/game/public/* \u2192 dist/wechat/"));
580
679
  }
581
680
  function copyWechatVendor(projectRoot, distDir) {
582
681
  console.log(pc6.cyan(" \u25B6 [wechat] \u68C0\u6D4B\u5FAE\u4FE1\u9002\u914D\u5668(vendor)"));
583
682
  const dirs = wechatVendorDirs(projectRoot);
584
- const adapter = dirs.map((d) => join(d, "weapp-adapter.js")).find((p) => fse4.existsSync(p));
683
+ const adapter = dirs.map((d) => join(d, "weapp-adapter.js")).find((p) => fse.existsSync(p));
585
684
  if (adapter) {
586
- fse4.copyFileSync(adapter, join(distDir, "weapp-adapter.js"));
685
+ fse.copyFileSync(adapter, join(distDir, "weapp-adapter.js"));
587
686
  console.log(pc6.green(" \u2713 weapp-adapter.js \u2192 dist/wechat/weapp-adapter.js"));
588
687
  const vendorDir = resolve(adapter, "..");
589
688
  const symbol = join(vendorDir, "symbol.js");
590
- if (fse4.existsSync(symbol)) {
591
- fse4.copyFileSync(symbol, join(distDir, "symbol.js"));
689
+ if (fse.existsSync(symbol)) {
690
+ fse.copyFileSync(symbol, join(distDir, "symbol.js"));
592
691
  console.log(pc6.green(" \u2713 symbol.js \u2192 dist/wechat/symbol.js"));
593
692
  }
594
693
  return true;
@@ -610,10 +709,10 @@ function copyWechatVendor(projectRoot, distDir) {
610
709
  }
611
710
  function listFiles(dir) {
612
711
  const out = [];
613
- if (!fse4.existsSync(dir)) return out;
614
- for (const name of fse4.readdirSync(dir)) {
712
+ if (!fse.existsSync(dir)) return out;
713
+ for (const name of fse.readdirSync(dir)) {
615
714
  const full = join(dir, name);
616
- const st = fse4.statSync(full);
715
+ const st = fse.statSync(full);
617
716
  if (st.isDirectory()) out.push(...listFiles(full));
618
717
  else out.push({ path: full, size: st.size });
619
718
  }
@@ -627,7 +726,7 @@ function findMainBundle(files) {
627
726
  return jsFiles.reduce((max, f) => f.size > max.size ? f : max, jsFiles[0]);
628
727
  }
629
728
  function checkPlatform(platform, distDir) {
630
- if (!fse4.existsSync(distDir)) {
729
+ if (!fse.existsSync(distDir)) {
631
730
  console.log(pc6.gray(` [${platform}] \u672A\u6784\u5EFA,\u8DF3\u8FC7`));
632
731
  return true;
633
732
  }
@@ -700,10 +799,10 @@ function invalidTarget(target) {
700
799
  }
701
800
  function collectJsFiles(dir) {
702
801
  const out = [];
703
- if (!fse4.existsSync(dir)) return out;
704
- for (const name of fse4.readdirSync(dir)) {
802
+ if (!fse.existsSync(dir)) return out;
803
+ for (const name of fse.readdirSync(dir)) {
705
804
  const full = join(dir, name);
706
- const st = fse4.statSync(full);
805
+ const st = fse.statSync(full);
707
806
  if (st.isDirectory()) out.push(...collectJsFiles(full));
708
807
  else if (/\.(js|mjs|cjs)$/i.test(name)) out.push(full);
709
808
  }
@@ -716,7 +815,7 @@ function snippetAround(text, index, span = 60) {
716
815
  }
717
816
  function verifyPlatform(platform, distDir, projectRoot) {
718
817
  const rules = ISOLATION_RULES[platform];
719
- if (!fse4.existsSync(distDir)) {
818
+ if (!fse.existsSync(distDir)) {
720
819
  console.log(pc6.gray(` [${platform}] \u672A\u6784\u5EFA(${relative(projectRoot, distDir)} \u4E0D\u5B58\u5728),\u8DF3\u8FC7`));
721
820
  return 0;
722
821
  }
@@ -727,7 +826,7 @@ function verifyPlatform(platform, distDir, projectRoot) {
727
826
  }
728
827
  let hits = 0;
729
828
  for (const file of files) {
730
- const text = fse4.readFileSync(file, "utf-8");
829
+ const text = fse.readFileSync(file, "utf-8");
731
830
  for (const sig of rules.forbidden) {
732
831
  let from = 0;
733
832
  let idx = text.indexOf(sig, from);
@@ -833,58 +932,6 @@ function renderWebHtml(cfg, scriptSrc) {
833
932
  `;
834
933
  }
835
934
 
836
- // src/cli/shells/tiktok.ts
837
- var DEFAULT_SDK_URL = "https://developers.tiktok.com/js/minis.js";
838
- function renderTikTokHtml(cfg, scriptSrc) {
839
- const title = escapeHtml(cfg?.title ?? "TikTok Mini Game");
840
- const sdkUrl = cfg?.sdkUrl ?? DEFAULT_SDK_URL;
841
- const sdkTag = sdkUrl ? `<!--
842
- TikTok Mini Games(Minis)SDK \u6CE8\u5165(\u5730\u5740\u6765\u81EA platform.config.tiktok.sdkUrl)\u3002
843
- \u5FC5\u987B\u5728\u6E38\u620F\u811A\u672C\u4E4B\u524D\u52A0\u8F7D,\u8FD0\u884C\u65F6\u901A\u8FC7\u5168\u5C40 TTMinis.game.* \u8C03\u7528\u6865\u63A5\u80FD\u529B\u3002
844
- -->
845
- <script src="${escapeAttr(sdkUrl)}"></script>` : "";
846
- return `<!doctype html>
847
- <html lang="en">
848
- <head>
849
- <meta charset="UTF-8" />
850
- <meta
851
- name="viewport"
852
- content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
853
- />
854
- <title>${title}</title>
855
- <style>
856
- html,
857
- body {
858
- margin: 0;
859
- padding: 0;
860
- width: 100%;
861
- height: 100%;
862
- background: #000;
863
- overflow: hidden;
864
- box-sizing: border-box;
865
- }
866
- #game-root {
867
- width: 100%;
868
- height: 100%;
869
- }
870
- #game-root canvas {
871
- display: block;
872
- margin: 0 auto;
873
- }
874
- </style>
875
- </head>
876
- <body>
877
- ${sdkTag}
878
-
879
- <!-- \u6E38\u620F\u753B\u5E03\u6302\u8F7D\u70B9 -->
880
- <div id="game-root"></div>
881
- <!-- TikTok \u5E73\u53F0\u5165\u53E3:\u4EC5\u9759\u6001 import TikTok \u9002\u914D\u5668 -->
882
- <script type="module" src="${scriptSrc}"></script>
883
- </body>
884
- </html>
885
- `;
886
- }
887
-
888
935
  // src/cli/commands/build.ts
889
936
  function cacheDir(projectRoot) {
890
937
  return resolve(projectRoot, "node_modules/.cache/pf");
@@ -905,20 +952,20 @@ function renderHtmlShell(platform, config, scriptSrc) {
905
952
  }
906
953
  function normalizeHtmlOutput(distDir) {
907
954
  const finalHtml = join(distDir, "index.html");
908
- if (fse4.existsSync(finalHtml)) return;
955
+ if (fse.existsSync(finalHtml)) return;
909
956
  const found = findFirstHtml(distDir);
910
957
  if (found) {
911
- fse4.moveSync(found, finalHtml, { overwrite: true });
958
+ fse.moveSync(found, finalHtml, { overwrite: true });
912
959
  }
913
960
  const nm = join(distDir, "node_modules");
914
- if (fse4.existsSync(nm)) {
915
- fse4.removeSync(nm);
961
+ if (fse.existsSync(nm)) {
962
+ fse.removeSync(nm);
916
963
  }
917
964
  }
918
965
  function findFirstHtml(dir) {
919
- for (const name of fse4.readdirSync(dir)) {
966
+ for (const name of fse.readdirSync(dir)) {
920
967
  const full = join(dir, name);
921
- const st = fse4.statSync(full);
968
+ const st = fse.statSync(full);
922
969
  if (st.isDirectory()) {
923
970
  const inner = findFirstHtml(full);
924
971
  if (inner) return inner;
@@ -931,11 +978,11 @@ function findFirstHtml(dir) {
931
978
  async function buildPlatform(platform, ctx, config, vite) {
932
979
  console.log(pc6.bgCyan(pc6.black(` \u6784\u5EFA\u5E73\u53F0:${platform} `)));
933
980
  const cache = cacheDir(ctx.root);
934
- fse4.ensureDirSync(cache);
981
+ fse.ensureDirSync(cache);
935
982
  const hash = randomBytes(4).toString("hex");
936
983
  const entryFileName = `main.${platform}.${hash}.ts`;
937
984
  const entryPath = join(cache, entryFileName);
938
- fse4.writeFileSync(entryPath, renderEntry({ platform, projectRoot: ctx.root }), "utf-8");
985
+ fse.writeFileSync(entryPath, renderEntry({ platform, projectRoot: ctx.root }), "utf-8");
939
986
  const tempFiles = [entryPath];
940
987
  const distDir = resolve(ctx.root, "dist", platform);
941
988
  try {
@@ -945,7 +992,7 @@ async function buildPlatform(platform, ctx, config, vite) {
945
992
  } else {
946
993
  const htmlName = `index.${platform}.${hash}.html`;
947
994
  const htmlPath = join(cache, htmlName);
948
- fse4.writeFileSync(htmlPath, renderHtmlShell(platform, config, `./${entryFileName}`), "utf-8");
995
+ fse.writeFileSync(htmlPath, renderHtmlShell(platform, config, `./${entryFileName}`), "utf-8");
949
996
  tempFiles.push(htmlPath);
950
997
  inputFile = htmlPath;
951
998
  }
@@ -982,7 +1029,7 @@ async function buildPlatform(platform, ctx, config, vite) {
982
1029
  } finally {
983
1030
  for (const f of tempFiles) {
984
1031
  try {
985
- fse4.removeSync(f);
1032
+ fse.removeSync(f);
986
1033
  } catch {
987
1034
  }
988
1035
  }
@@ -1054,15 +1101,15 @@ async function runDev(target) {
1054
1101
  const cache = cacheDir2(ctx.root);
1055
1102
  const hash = randomBytes(4).toString("hex");
1056
1103
  const runDir = join(cache, `dev-${platform}-${hash}`);
1057
- fse4.ensureDirSync(runDir);
1104
+ fse.ensureDirSync(runDir);
1058
1105
  const entryFileName = `main.${platform}.ts`;
1059
1106
  const entryPath = join(runDir, entryFileName);
1060
1107
  const htmlPath = join(runDir, "index.html");
1061
- fse4.writeFileSync(entryPath, renderEntry({ platform, projectRoot: ctx.root }), "utf-8");
1062
- fse4.writeFileSync(htmlPath, renderHtmlShell2(platform, config, `./${entryFileName}`), "utf-8");
1108
+ fse.writeFileSync(entryPath, renderEntry({ platform, projectRoot: ctx.root }), "utf-8");
1109
+ fse.writeFileSync(htmlPath, renderHtmlShell2(platform, config, `./${entryFileName}`), "utf-8");
1063
1110
  const cleanup = () => {
1064
1111
  try {
1065
- fse4.removeSync(runDir);
1112
+ fse.removeSync(runDir);
1066
1113
  } catch {
1067
1114
  }
1068
1115
  };
@@ -1353,7 +1400,7 @@ function runCap(action, platform) {
1353
1400
  if (action === "sync") {
1354
1401
  console.log(pc6.cyan(pc6.bold("\u25B6 Capacitor sync")));
1355
1402
  const distDir = resolve(ctx.root, "dist", "capacitor");
1356
- if (!fse4.existsSync(distDir)) {
1403
+ if (!fse.existsSync(distDir)) {
1357
1404
  console.log(pc6.red("\u2717 dist/capacitor \u4E0D\u5B58\u5728"));
1358
1405
  console.log(pc6.yellow(" \u8BF7\u5148\u6784\u5EFA:pf build capacitor"));
1359
1406
  return false;
package/dist/index.d.ts CHANGED
@@ -620,7 +620,7 @@ declare abstract class BasePanel extends Phaser.GameObjects.Container {
620
620
  color?: number;
621
621
  alpha?: number;
622
622
  closeOnClick?: boolean;
623
- }): Phaser.GameObjects.Graphics;
623
+ }): Phaser.GameObjects.Image;
624
624
  /**
625
625
  * 把一个子对象放到设计稿正中(以设计稿坐标系)。
626
626
  * 仅设置坐标,不负责 add(由调用方决定何时 add 进容器)。
@@ -1057,6 +1057,13 @@ interface ButtonConfig extends ButtonStyle {
1057
1057
  declare class Button extends Phaser.GameObjects.Container {
1058
1058
  private readonly bg;
1059
1059
  private readonly label;
1060
+ /**
1061
+ * 透明输入命中层(Image,使用默认 frame 命中区)。
1062
+ * 不直接在容器上 setInteractive(自定义 Rectangle) 的原因:真机/高分屏 Phaser FIT
1063
+ * 非整数缩放时,容器自定义矩形命中区会随离中心距离产生偏移,小按钮点不准;
1064
+ * Image 的 frame 命中区不受此影响。故输入统一走这一层。
1065
+ */
1066
+ private readonly hit;
1060
1067
  private readonly style;
1061
1068
  private readonly onClick?;
1062
1069
  /** 是否禁用 */
@@ -1071,7 +1078,58 @@ declare class Button extends Phaser.GameObjects.Container {
1071
1078
  get disabled(): boolean;
1072
1079
  /** 绘制圆角背景(以中心为原点) */
1073
1080
  private drawBackground;
1074
- /** 绑定指针交互:悬停/按下/抬起,实现按下态与点击触发 */
1081
+ /** 绑定指针交互:悬停/按下/抬起,实现按下态与点击触发(事件挂在命中层 hit 上) */
1082
+ private bindEvents;
1083
+ }
1084
+
1085
+ /**
1086
+ * 圆形图标按钮 IconButton(基于 Phaser.GameObjects.Container)。
1087
+ *
1088
+ * 与 Button 的区别:Button 是「圆角矩形 + 文字」,IconButton 是「圆底 + 图标纹理」,
1089
+ * 适合返回/设置/帮助等小图标按钮。
1090
+ *
1091
+ * 输入用透明 Image 命中层(默认 frame 命中区)+ down/up 触发——在真机/高分屏
1092
+ * (Phaser FIT 非整数缩放)下命中可靠,规避「容器自定义 Rectangle 命中区小按钮点不准」的坑。
1093
+ *
1094
+ * 用法:
1095
+ * new IconButton(this, { x, y, size: 88, texture: 'icon_home', onClick: () => goMain() });
1096
+ */
1097
+
1098
+ interface IconButtonConfig {
1099
+ x?: number;
1100
+ y?: number;
1101
+ /** 直径(圆底与命中区尺寸),默认 88 */
1102
+ size?: number;
1103
+ /** 图标纹理 key */
1104
+ texture: string;
1105
+ /** 图标帧(图集时用,可选) */
1106
+ frame?: string | number;
1107
+ /** 图标相对 size 的比例,默认 0.56 */
1108
+ iconScale?: number;
1109
+ /** 圆底颜色;传 null 不绘制底,默认深灰 0x232c44 */
1110
+ bgColor?: number | null;
1111
+ /** 圆底不透明度,默认 1 */
1112
+ bgAlpha?: number;
1113
+ /** 水平翻转图标(如用「下一关」箭头翻成「上一关」) */
1114
+ flipX?: boolean;
1115
+ /** 图标着色 */
1116
+ iconTint?: number;
1117
+ /** 点击回调(按下并在按钮内抬起才触发) */
1118
+ onClick?: () => void;
1119
+ }
1120
+ declare class IconButton extends Phaser.GameObjects.Container {
1121
+ private readonly icon;
1122
+ /** 透明命中层(frame 命中区,真机/高分屏可靠) */
1123
+ private readonly hit;
1124
+ private readonly onClick?;
1125
+ private _disabled;
1126
+ private pressed;
1127
+ constructor(scene: Phaser.Scene, config: IconButtonConfig);
1128
+ /** 更新图标纹理 */
1129
+ setIcon(texture: string, frame?: string | number): this;
1130
+ /** 设置禁用态 */
1131
+ setDisabled(disabled: boolean): this;
1132
+ get disabled(): boolean;
1075
1133
  private bindEvents;
1076
1134
  }
1077
1135
 
@@ -1699,11 +1757,20 @@ interface WebPlatformConfig {
1699
1757
  }
1700
1758
  /** TikTok Mini Games 平台配置 */
1701
1759
  interface TikTokPlatformConfig {
1702
- /** TikTok 小游戏 SDK 脚本地址(注入 index.html) */
1760
+ /**
1761
+ * TikTok 小游戏 SDK 脚本地址(注入 index.html <head> 第一个 script)。
1762
+ * 不填用默认 https://connect.tiktok-minis.com/game/sdk.js(TikTok 现行 SDK URL);
1763
+ * 旧的 https://developers.tiktok.com/js/minis.js 已不被审核脚本识别,出现 "JSSDK missing" 报错。
1764
+ */
1703
1765
  sdkUrl?: string;
1766
+ /**
1767
+ * TikTok 开发者后台拿的 client_key(等同 app_id),会注入 index.html 调用
1768
+ * `TTMinis.game.init({clientKey})`。审核脚本按此 pattern 检测,必填才能过审。
1769
+ */
1770
+ clientKey?: string;
1704
1771
  /** 页面标题 */
1705
1772
  title?: string;
1706
- /** 屏幕方向 */
1773
+ /** 屏幕方向(VERTICAL/HORIZONTAL,写入 minigame.config.json;不填默认 VERTICAL) */
1707
1774
  orientation?: Orientation;
1708
1775
  /** 业务后端基址(覆盖 common.apiBaseURL) */
1709
1776
  apiBaseURL?: string;
@@ -1777,4 +1844,4 @@ interface PlatformConfig {
1777
1844
  capacitor?: CapacitorPlatformConfig;
1778
1845
  }
1779
1846
 
1780
- export { AdResult, type AdsConfig, App, type AppConfig, BaseModule, BasePanel, BaseScene, Button, type ButtonConfig, type ButtonStyle, type CapacitorPlatformConfig, ConfigTable, ConfigTableManager, ErrorCode, type FacebookPlatformConfig, FrameworkError, Handler, HttpClient, type HttpClientConfig, HttpError, type HttpInterceptors, HttpRequestOptions, I18n, type I18nOptions, type IAccountService, type IAdsManager, type IAnalyticsManager, type IApp, type IAssetLoader, type IAudioManager, type IConfigService, type IEventBus, type IHttpClient, type IKcpTransport, type ILogger, type INetManager, type IPanelManager, type IPaymentManager, IPlatform, IPlatformLifecycle, type ISceneManager, type ISocketClient, type IStorageManager, JsonCodec, KcpClient, type KcpClientConfig, type KcpTransportFactory, type LayerName, Layers, LogLevel, LoginResult, MessageChannel, type MessageChannelOptions, type MessageCodec, type MessageEnvelope, MessageError, ModuleRegistry, NetManager, type NetManagerOptions, type NetProtocol, ObjectPool, type Orientation, type PanelCtor, PanelManager, type PlatformConfig, PlatformContext, PurchaseResult, SafeArea, SaveManager, type SaveSlot, type SaveSlotOptions, type ScheduleHandle, Scheduler, type SocketClientConfig, type SocketState, type StartGameOptions, type Store, type TikTokPlatformConfig, TypedEventBus, Unsubscribe, type WeChatPlatformConfig, type WebPlatformConfig, WebSocketClient, createStore, createTypedEventBus, isFrameworkError, normalizeLocale, startGame };
1847
+ export { AdResult, type AdsConfig, App, type AppConfig, BaseModule, BasePanel, BaseScene, Button, type ButtonConfig, type ButtonStyle, type CapacitorPlatformConfig, ConfigTable, ConfigTableManager, ErrorCode, type FacebookPlatformConfig, FrameworkError, Handler, HttpClient, type HttpClientConfig, HttpError, type HttpInterceptors, HttpRequestOptions, I18n, type I18nOptions, type IAccountService, type IAdsManager, type IAnalyticsManager, type IApp, type IAssetLoader, type IAudioManager, type IConfigService, type IEventBus, type IHttpClient, type IKcpTransport, type ILogger, type INetManager, type IPanelManager, type IPaymentManager, IPlatform, IPlatformLifecycle, type ISceneManager, type ISocketClient, type IStorageManager, IconButton, type IconButtonConfig, JsonCodec, KcpClient, type KcpClientConfig, type KcpTransportFactory, type LayerName, Layers, LogLevel, LoginResult, MessageChannel, type MessageChannelOptions, type MessageCodec, type MessageEnvelope, MessageError, ModuleRegistry, NetManager, type NetManagerOptions, type NetProtocol, ObjectPool, type Orientation, type PanelCtor, PanelManager, type PlatformConfig, PlatformContext, PurchaseResult, SafeArea, SaveManager, type SaveSlot, type SaveSlotOptions, type ScheduleHandle, Scheduler, type SocketClientConfig, type SocketState, type StartGameOptions, type Store, type TikTokPlatformConfig, TypedEventBus, Unsubscribe, type WeChatPlatformConfig, type WebPlatformConfig, WebSocketClient, createStore, createTypedEventBus, isFrameworkError, normalizeLocale, startGame };
package/dist/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { PlatformUnsupportedError } from './chunk-II3JM4R3.js';
2
2
  export { PlatformUnsupportedError } from './chunk-II3JM4R3.js';
3
3
  import { __publicField } from './chunk-PKBMQBKP.js';
4
- import Phaser4 from 'phaser';
4
+ import Phaser2 from 'phaser';
5
5
 
6
6
  // src/App.ts
7
7
  var parts = null;
@@ -2598,7 +2598,7 @@ var ModuleRegistry = class {
2598
2598
  return this.modules.size;
2599
2599
  }
2600
2600
  };
2601
- var BasePanel = class extends Phaser4.GameObjects.Container {
2601
+ var BasePanel = class extends Phaser2.GameObjects.Container {
2602
2602
  constructor(scene) {
2603
2603
  super(scene, 0, 0);
2604
2604
  /** 打开本面板时所属的 key(由 PanelManager 在创建后注入,用于自我关闭) */
@@ -2683,12 +2683,11 @@ var BasePanel = class extends Phaser4.GameObjects.Container {
2683
2683
  const h = this.designHeight;
2684
2684
  const color = opts?.color ?? 0;
2685
2685
  const alpha = opts?.alpha ?? 0.6;
2686
- const dim = this.scene.make.graphics({}, false);
2687
- dim.fillStyle(color, alpha);
2688
- dim.fillRect(0, 0, w, h);
2686
+ const dim = this.scene.make.image({ x: w / 2, y: h / 2, key: "__WHITE" }, false);
2687
+ dim.setDisplaySize(w, h).setTint(color).setAlpha(alpha);
2689
2688
  if (opts?.closeOnClick) {
2690
- dim.setInteractive(new Phaser4.Geom.Rectangle(0, 0, w, h), Phaser4.Geom.Rectangle.Contains);
2691
- dim.on(Phaser4.Input.Events.POINTER_UP, () => this.close());
2689
+ dim.setInteractive();
2690
+ dim.on(Phaser2.Input.Events.POINTER_UP, () => this.close());
2692
2691
  }
2693
2692
  this.addAt(dim, 0);
2694
2693
  return dim;
@@ -2947,7 +2946,7 @@ async function startGame(opts) {
2947
2946
  }
2948
2947
  function createPhaserGameInstance(config, scenes) {
2949
2948
  const gameConfig = {
2950
- type: Phaser4.AUTO,
2949
+ type: Phaser2.AUTO,
2951
2950
  // 关键:把 canvas 挂进各平台外壳的 #game-root(外壳已为它写好布局/居中 CSS)。
2952
2951
  // 不设 parent 时 Phaser 把 canvas 追加到 document.body —— 而外壳里 #game-root 占满
2953
2952
  // 100% 高度,canvas 作为其后的块级兄弟会被挤到视口外,再被 body 的 overflow:hidden
@@ -2958,19 +2957,22 @@ function createPhaserGameInstance(config, scenes) {
2958
2957
  backgroundColor: "#1f2937",
2959
2958
  scale: {
2960
2959
  // FIT:按设计分辨率等比缩放铺满容器(保持比例,留黑边);CENTER_BOTH:居中
2961
- mode: Phaser4.Scale.FIT,
2962
- autoCenter: Phaser4.Scale.CENTER_BOTH,
2960
+ mode: Phaser2.Scale.FIT,
2961
+ autoCenter: Phaser2.Scale.CENTER_BOTH,
2963
2962
  width: config.designWidth,
2963
+ // autoRound:把缩放后画布尺寸取整,避免非整数缩放(如真机 1.866x)产生亚像素偏移,
2964
+ // 渲染更清晰、指针命中更准(配合 UI 组件用 frame 命中区,彻底解决高分屏小按钮点不准)。
2965
+ autoRound: true,
2964
2966
  height: config.designHeight
2965
2967
  },
2966
2968
  scene: scenes
2967
2969
  // 微信等无 DOM 平台由 weapp-adapter 提供 canvas;有 DOM 平台 Phaser 自动建 canvas
2968
2970
  };
2969
- return new Phaser4.Game(gameConfig);
2971
+ return new Phaser2.Game(gameConfig);
2970
2972
  }
2971
2973
  function waitForGameReady(game) {
2972
2974
  return new Promise((resolve) => {
2973
- game.events.once(Phaser4.Core.Events.READY, () => resolve());
2975
+ game.events.once(Phaser2.Core.Events.READY, () => resolve());
2974
2976
  });
2975
2977
  }
2976
2978
 
@@ -3076,7 +3078,7 @@ var Scheduler = class {
3076
3078
  };
3077
3079
 
3078
3080
  // src/scene/BaseScene.ts
3079
- var BaseScene = class extends Phaser4.Scene {
3081
+ var BaseScene = class extends Phaser2.Scene {
3080
3082
  constructor(config) {
3081
3083
  super(config);
3082
3084
  /* --------------------------- 自动清理 / 调度 --------------------------- */
@@ -3126,10 +3128,10 @@ var BaseScene = class extends Phaser4.Scene {
3126
3128
  this._cleanupArmed = true;
3127
3129
  const onShutdown = () => {
3128
3130
  this.runCleanup();
3129
- this.events.once(Phaser4.Scenes.Events.SHUTDOWN, onShutdown);
3131
+ this.events.once(Phaser2.Scenes.Events.SHUTDOWN, onShutdown);
3130
3132
  };
3131
- this.events.once(Phaser4.Scenes.Events.SHUTDOWN, onShutdown);
3132
- this.events.once(Phaser4.Scenes.Events.DESTROY, () => this.runCleanup());
3133
+ this.events.once(Phaser2.Scenes.Events.SHUTDOWN, onShutdown);
3134
+ this.events.once(Phaser2.Scenes.Events.DESTROY, () => this.runCleanup());
3133
3135
  }
3134
3136
  /** 执行全部清理:解绑所有 bind 的订阅 + 清空场景调度器,并重置登记表 */
3135
3137
  runCleanup() {
@@ -3213,11 +3215,18 @@ var DEFAULTS = {
3213
3215
  fontSize: 32,
3214
3216
  fontFamily: "sans-serif"
3215
3217
  };
3216
- var Button = class extends Phaser4.GameObjects.Container {
3218
+ var Button = class extends Phaser2.GameObjects.Container {
3217
3219
  constructor(scene, config) {
3218
3220
  super(scene, config.x ?? 0, config.y ?? 0);
3219
3221
  __publicField(this, "bg");
3220
3222
  __publicField(this, "label");
3223
+ /**
3224
+ * 透明输入命中层(Image,使用默认 frame 命中区)。
3225
+ * 不直接在容器上 setInteractive(自定义 Rectangle) 的原因:真机/高分屏 Phaser FIT
3226
+ * 非整数缩放时,容器自定义矩形命中区会随离中心距离产生偏移,小按钮点不准;
3227
+ * Image 的 frame 命中区不受此影响。故输入统一走这一层。
3228
+ */
3229
+ __publicField(this, "hit");
3221
3230
  __publicField(this, "style");
3222
3231
  __publicField(this, "onClick");
3223
3232
  /** 是否禁用 */
@@ -3254,15 +3263,10 @@ var Button = class extends Phaser4.GameObjects.Container {
3254
3263
  this.label.setOrigin(0.5, 0.5);
3255
3264
  this.add(this.label);
3256
3265
  this.setSize(this.style.width, this.style.height);
3257
- this.setInteractive(
3258
- new Phaser4.Geom.Rectangle(
3259
- -this.style.width / 2,
3260
- -this.style.height / 2,
3261
- this.style.width,
3262
- this.style.height
3263
- ),
3264
- Phaser4.Geom.Rectangle.Contains
3265
- );
3266
+ this.hit = scene.make.image({ x: 0, y: 0, key: "__WHITE" }, false);
3267
+ this.hit.setDisplaySize(this.style.width, this.style.height).setAlpha(1e-3);
3268
+ this.hit.setInteractive({ useHandCursor: true });
3269
+ this.add(this.hit);
3266
3270
  this.bindEvents();
3267
3271
  scene.add.existing(this);
3268
3272
  }
@@ -3276,12 +3280,12 @@ var Button = class extends Phaser4.GameObjects.Container {
3276
3280
  this._disabled = disabled;
3277
3281
  this.setAlpha(disabled ? 0.5 : 1);
3278
3282
  if (disabled) {
3279
- this.disableInteractive();
3283
+ this.hit.disableInteractive();
3280
3284
  this.pressed = false;
3281
3285
  this.drawBackground(this.style.backgroundColor);
3282
3286
  this.setScale(1);
3283
3287
  } else {
3284
- this.setInteractive();
3288
+ this.hit.setInteractive({ useHandCursor: true });
3285
3289
  }
3286
3290
  return this;
3287
3291
  }
@@ -3295,25 +3299,25 @@ var Button = class extends Phaser4.GameObjects.Container {
3295
3299
  this.bg.fillStyle(color, 1);
3296
3300
  this.bg.fillRoundedRect(-width / 2, -height / 2, width, height, radius);
3297
3301
  }
3298
- /** 绑定指针交互:悬停/按下/抬起,实现按下态与点击触发 */
3302
+ /** 绑定指针交互:悬停/按下/抬起,实现按下态与点击触发(事件挂在命中层 hit 上) */
3299
3303
  bindEvents() {
3300
- this.on(Phaser4.Input.Events.POINTER_OVER, () => {
3304
+ this.hit.on(Phaser2.Input.Events.POINTER_OVER, () => {
3301
3305
  if (this._disabled) return;
3302
3306
  this.drawBackground(this.style.backgroundColorActive);
3303
3307
  });
3304
- this.on(Phaser4.Input.Events.POINTER_OUT, () => {
3308
+ this.hit.on(Phaser2.Input.Events.POINTER_OUT, () => {
3305
3309
  if (this._disabled) return;
3306
3310
  this.pressed = false;
3307
3311
  this.drawBackground(this.style.backgroundColor);
3308
3312
  this.setScale(1);
3309
3313
  });
3310
- this.on(Phaser4.Input.Events.POINTER_DOWN, () => {
3314
+ this.hit.on(Phaser2.Input.Events.POINTER_DOWN, () => {
3311
3315
  if (this._disabled) return;
3312
3316
  this.pressed = true;
3313
3317
  this.drawBackground(this.style.backgroundColorActive);
3314
3318
  this.setScale(0.96);
3315
3319
  });
3316
- this.on(Phaser4.Input.Events.POINTER_UP, () => {
3320
+ this.hit.on(Phaser2.Input.Events.POINTER_UP, () => {
3317
3321
  if (this._disabled) return;
3318
3322
  this.setScale(1);
3319
3323
  this.drawBackground(this.style.backgroundColor);
@@ -3324,6 +3328,81 @@ var Button = class extends Phaser4.GameObjects.Container {
3324
3328
  });
3325
3329
  }
3326
3330
  };
3331
+ var DEFAULT_SIZE = 88;
3332
+ var DEFAULT_BG = 2305092;
3333
+ var IconButton = class extends Phaser2.GameObjects.Container {
3334
+ constructor(scene, config) {
3335
+ super(scene, config.x ?? 0, config.y ?? 0);
3336
+ __publicField(this, "icon");
3337
+ /** 透明命中层(frame 命中区,真机/高分屏可靠) */
3338
+ __publicField(this, "hit");
3339
+ __publicField(this, "onClick");
3340
+ __publicField(this, "_disabled", false);
3341
+ __publicField(this, "pressed", false);
3342
+ const size = config.size ?? DEFAULT_SIZE;
3343
+ this.onClick = config.onClick;
3344
+ if (config.bgColor !== null) {
3345
+ const bg = scene.make.graphics({}, false);
3346
+ bg.fillStyle(config.bgColor ?? DEFAULT_BG, config.bgAlpha ?? 1);
3347
+ bg.fillCircle(0, 0, size / 2);
3348
+ this.add(bg);
3349
+ }
3350
+ this.icon = scene.make.image({ x: 0, y: 0, key: config.texture, frame: config.frame }, false);
3351
+ const target = size * (config.iconScale ?? 0.56);
3352
+ this.icon.setScale(target / Math.max(this.icon.width, this.icon.height || 1));
3353
+ if (config.flipX) this.icon.setFlipX(true);
3354
+ if (config.iconTint !== void 0) this.icon.setTint(config.iconTint);
3355
+ this.add(this.icon);
3356
+ this.hit = scene.make.image({ x: 0, y: 0, key: "__WHITE" }, false);
3357
+ this.hit.setDisplaySize(size, size).setAlpha(1e-3);
3358
+ this.hit.setInteractive({ useHandCursor: true });
3359
+ this.add(this.hit);
3360
+ this.setSize(size, size);
3361
+ this.bindEvents();
3362
+ scene.add.existing(this);
3363
+ }
3364
+ /** 更新图标纹理 */
3365
+ setIcon(texture, frame) {
3366
+ this.icon.setTexture(texture, frame);
3367
+ return this;
3368
+ }
3369
+ /** 设置禁用态 */
3370
+ setDisabled(disabled) {
3371
+ this._disabled = disabled;
3372
+ this.setAlpha(disabled ? 0.5 : 1);
3373
+ if (disabled) {
3374
+ this.hit.disableInteractive();
3375
+ this.pressed = false;
3376
+ this.setScale(1);
3377
+ } else {
3378
+ this.hit.setInteractive({ useHandCursor: true });
3379
+ }
3380
+ return this;
3381
+ }
3382
+ get disabled() {
3383
+ return this._disabled;
3384
+ }
3385
+ bindEvents() {
3386
+ this.hit.on(Phaser2.Input.Events.POINTER_DOWN, () => {
3387
+ if (this._disabled) return;
3388
+ this.pressed = true;
3389
+ this.setScale(0.92);
3390
+ });
3391
+ this.hit.on(Phaser2.Input.Events.POINTER_OUT, () => {
3392
+ if (this._disabled) return;
3393
+ this.pressed = false;
3394
+ this.setScale(1);
3395
+ });
3396
+ this.hit.on(Phaser2.Input.Events.POINTER_UP, () => {
3397
+ if (this._disabled) return;
3398
+ this.setScale(1);
3399
+ if (this.pressed) {
3400
+ this.pressed = false;
3401
+ this.onClick?.();
3402
+ }
3403
+ });
3404
+ }
3405
+ };
3327
3406
 
3328
3407
  // src/store/Store.ts
3329
3408
  function deepClone2(value) {
@@ -3812,4 +3891,4 @@ var MessageChannel = class {
3812
3891
  }
3813
3892
  };
3814
3893
 
3815
- export { App, BaseModule, BasePanel, BaseScene, Button, ConfigTable, ConfigTableManager, ErrorCode, FrameworkError, HttpClient, HttpError, I18n, JsonCodec, KcpClient, Layers, LogLevel, MessageChannel, MessageError, ModuleRegistry, NetManager, ObjectPool, PanelManager, PlatformContext, SaveManager, Scheduler, TypedEventBus, WebSocketClient, createStore, createTypedEventBus, err, isFrameworkError, normalizeLocale, ok, startGame };
3894
+ export { App, BaseModule, BasePanel, BaseScene, Button, ConfigTable, ConfigTableManager, ErrorCode, FrameworkError, HttpClient, HttpError, I18n, IconButton, JsonCodec, KcpClient, Layers, LogLevel, MessageChannel, MessageError, ModuleRegistry, NetManager, ObjectPool, PanelManager, PlatformContext, SaveManager, Scheduler, TypedEventBus, WebSocketClient, createStore, createTypedEventBus, err, isFrameworkError, normalizeLocale, ok, startGame };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@maoyugames/phaser-framework",
3
- "version": "1.0.4",
3
+ "version": "1.0.6",
4
4
  "description": "多平台 Phaser 游戏框架:业务/底层分离,HTTP/WebSocket/KCP,Web/TikTok/微信/Facebook/App 隔离打包",
5
5
  "type": "module",
6
6
  "license": "MIT",