fix: 修复迁移后的基础UI显示问题
This commit is contained in:
cancerai committed
1 parent
18017f819a
commit
a93e06f60c
68 files changed
+2293
-8404
No files matched your search
@@ -0,0 +1,299 @@
|
||||
// 触屏手柄布局编辑器：独立全屏页，从「设置 → 自定义按键」进入。
|
||||
// 背景保持透明，透出下面的实时游戏画布（标题星空 + 刺地带动画），
|
||||
// 编辑体验与正常玩游戏时完全一致（同样的全屏沉浸、同样的按钮渲染）。
|
||||
//
|
||||
// 布局即改即存（每次拖动/缩放都写回存档），返回时无需再点「确定」。
|
||||
// 位置/大小与真实手柄同一套换算（cx/cy 百分比 + size×k），所见即所得。
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:iwbtc/src/core/save.dart' show Save;
|
||||
import 'package:iwbtc/src/game/world.dart' show W;
|
||||
import 'package:iwbtc/src/ui/touch_layout.dart'
|
||||
show BUTTONS, TouchBtn, metaSettings;
|
||||
|
||||
/// 读取某按键当前布局（cx/cy/size）。
|
||||
Map<String, double> touchLayoutOf(String key) {
|
||||
final t = metaSettings()['touch'] as Map;
|
||||
final m = (t[key] as Map?) ?? const <String, dynamic>{};
|
||||
return <String, double>{
|
||||
'cx': double.tryParse(m['cx'].toString()) ?? 50,
|
||||
'cy': double.tryParse(m['cy'].toString()) ?? 50,
|
||||
'size': double.tryParse(m['size'].toString()) ?? 60,
|
||||
};
|
||||
}
|
||||
|
||||
void writeTouchLayout(String key, Map<String, double> p) {
|
||||
(metaSettings()['touch'] as Map)[key] = <String, dynamic>{
|
||||
'cx': p['cx'],
|
||||
'cy': p['cy'],
|
||||
'size': p['size'],
|
||||
};
|
||||
// 即改即存：布局写回存档，返回/切后台都不会丢。
|
||||
Save.flush();
|
||||
}
|
||||
|
||||
class TouchLayoutEditor extends StatefulWidget {
|
||||
final VoidCallback onDone; // 仅负责返回设置页（布局已即改即存）
|
||||
const TouchLayoutEditor({super.key, required this.onDone});
|
||||
@override
|
||||
State<TouchLayoutEditor> createState() => _TouchLayoutEditorState();
|
||||
}
|
||||
|
||||
class _TouchLayoutEditorState extends State<TouchLayoutEditor> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
// 背景保持透明：透出下面的实时游戏画布（标题星空+刺地），
|
||||
// 编辑体验与正常游戏完全一致（全屏沉浸）。
|
||||
return Stack(
|
||||
children: <Widget>[
|
||||
// 按钮编辑层（铺满全屏，与真实手柄同一坐标系）
|
||||
Positioned.fill(
|
||||
child: LayoutBuilder(
|
||||
builder: (BuildContext _, BoxConstraints cons) {
|
||||
final double w = cons.maxWidth;
|
||||
final double h = cons.maxHeight;
|
||||
// 与 _TouchButton 完全一致的缩放系数，保证编辑所见 = 游戏所得
|
||||
final double k = (w / W).clamp(0.6, 2.6);
|
||||
return Stack(
|
||||
children: <Widget>[
|
||||
for (final b in BUTTONS) ...<Widget>[
|
||||
_EditBtn(
|
||||
b: b,
|
||||
k: k,
|
||||
screenW: w,
|
||||
screenH: h,
|
||||
onChanged: () => setState(() {}),
|
||||
),
|
||||
_ResizeHandle(
|
||||
b: b,
|
||||
k: k,
|
||||
screenW: w,
|
||||
screenH: h,
|
||||
onChanged: () => setState(() {}),
|
||||
),
|
||||
],
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
// 顶部操作行：恢复默认 / 返回
|
||||
Positioned(
|
||||
top: 10,
|
||||
right: 12,
|
||||
child: Row(
|
||||
children: <Widget>[
|
||||
ElevatedButton(
|
||||
onPressed: () {
|
||||
final t = metaSettings()['touch'] as Map;
|
||||
t.clear();
|
||||
for (final b in BUTTONS) {
|
||||
t[b.key] = <String, dynamic>{
|
||||
'cx': b.cx,
|
||||
'cy': b.cy,
|
||||
'size': b.size,
|
||||
};
|
||||
}
|
||||
Save.flush();
|
||||
setState(() {});
|
||||
},
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: const Color(0x991a1a26),
|
||||
foregroundColor: const Color(0xffffffff),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 12,
|
||||
vertical: 6,
|
||||
),
|
||||
minimumSize: Size.zero,
|
||||
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
||||
visualDensity: VisualDensity.compact,
|
||||
),
|
||||
child: const Text('恢复默认', style: TextStyle(fontSize: 13)),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
ElevatedButton(
|
||||
onPressed: widget.onDone,
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: const Color(0x995a3a7a),
|
||||
foregroundColor: const Color(0xffffffff),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 14,
|
||||
vertical: 6,
|
||||
),
|
||||
minimumSize: Size.zero,
|
||||
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
||||
visualDensity: VisualDensity.compact,
|
||||
),
|
||||
child: const Text('返回', style: TextStyle(fontSize: 13)),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
// 底部提示
|
||||
const Positioned(
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 8,
|
||||
child: Center(
|
||||
child: Text(
|
||||
'点选按钮后可拖动位置 · 拖右下角黄点调整大小（改动即时保存）',
|
||||
style: TextStyle(color: Color(0x88ffffff), fontSize: 12),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _EditBtn extends StatefulWidget {
|
||||
final TouchBtn b;
|
||||
final double k; // 真实手柄同款缩放系数
|
||||
final double screenW;
|
||||
final double screenH;
|
||||
final VoidCallback onChanged;
|
||||
const _EditBtn({
|
||||
required this.b,
|
||||
required this.k,
|
||||
required this.screenW,
|
||||
required this.screenH,
|
||||
required this.onChanged,
|
||||
});
|
||||
@override
|
||||
State<_EditBtn> createState() => _EditBtnState();
|
||||
}
|
||||
|
||||
class _EditBtnState extends State<_EditBtn> {
|
||||
bool _selected = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final p = touchLayoutOf(widget.b.key);
|
||||
final double sz = p['size']! * widget.k;
|
||||
final double left = p['cx']! / 100 * widget.screenW - sz / 2;
|
||||
final double top = p['cy']! / 100 * widget.screenH - sz / 2;
|
||||
final isJump = widget.b.shape == 'jump';
|
||||
return Positioned(
|
||||
left: left,
|
||||
top: top,
|
||||
width: sz,
|
||||
height: sz,
|
||||
child: GestureDetector(
|
||||
behavior: HitTestBehavior.opaque,
|
||||
onTap: () => setState(() => _selected = !_selected),
|
||||
onPanStart: (_) => setState(() => _selected = true),
|
||||
onPanUpdate: (d) {
|
||||
final np = touchLayoutOf(widget.b.key);
|
||||
np['cx'] = (np['cx']! + d.delta.dx / widget.screenW * 100).clamp(
|
||||
3.0,
|
||||
97.0,
|
||||
);
|
||||
np['cy'] = (np['cy']! + d.delta.dy / widget.screenH * 100).clamp(
|
||||
4.0,
|
||||
96.0,
|
||||
);
|
||||
writeTouchLayout(widget.b.key, np);
|
||||
widget.onChanged();
|
||||
},
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: _selected
|
||||
? const Color(0x88ffffff)
|
||||
: const Color(0x444a5a7a),
|
||||
shape: isJump ? BoxShape.circle : BoxShape.rectangle,
|
||||
borderRadius: isJump ? null : BorderRadius.circular(sz * 0.3),
|
||||
border: Border.all(
|
||||
color: _selected
|
||||
? const Color(0xffffd23a)
|
||||
: const Color(0xff7ae0ff),
|
||||
width: 2,
|
||||
),
|
||||
),
|
||||
child: Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
widget.b.label,
|
||||
style: TextStyle(
|
||||
color: const Color(0xffffffff),
|
||||
fontSize: sz * 0.3,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
if (widget.b.label2 != null)
|
||||
Text(
|
||||
widget.b.label2!,
|
||||
style: TextStyle(
|
||||
color: const Color(0xffcfe8ff),
|
||||
fontSize: sz * 0.15,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// 缩放手柄：选中按钮后显示在其右下角的小黄点，拖动改变按钮大小。
|
||||
/// 单独一层 Positioned（在按钮之后 = 绘制在上层），不吃按钮本体的手势。
|
||||
class _ResizeHandle extends StatefulWidget {
|
||||
final TouchBtn b;
|
||||
final double k;
|
||||
final double screenW;
|
||||
final double screenH;
|
||||
final VoidCallback onChanged;
|
||||
const _ResizeHandle({
|
||||
required this.b,
|
||||
required this.k,
|
||||
required this.screenW,
|
||||
required this.screenH,
|
||||
required this.onChanged,
|
||||
});
|
||||
@override
|
||||
State<_ResizeHandle> createState() => _ResizeHandleState();
|
||||
}
|
||||
|
||||
class _ResizeHandleState extends State<_ResizeHandle> {
|
||||
bool _active = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final p = touchLayoutOf(widget.b.key);
|
||||
final double sz = p['size']! * widget.k;
|
||||
final double left = p['cx']! / 100 * widget.screenW + sz / 2 - 14;
|
||||
final double top = p['cy']! / 100 * widget.screenH + sz / 2 - 14;
|
||||
return Positioned(
|
||||
left: left,
|
||||
top: top,
|
||||
width: 26,
|
||||
height: 26,
|
||||
child: GestureDetector(
|
||||
behavior: HitTestBehavior.opaque,
|
||||
onPanStart: (_) => setState(() => _active = true),
|
||||
onPanEnd: (_) => setState(() => _active = false),
|
||||
onPanCancel: () => setState(() => _active = false),
|
||||
onPanUpdate: (d) {
|
||||
final np = touchLayoutOf(widget.b.key);
|
||||
// 向右/向下拖 = 变大，换算回虚拟 size 单位
|
||||
final double dSize = (d.delta.dx + d.delta.dy) / widget.k;
|
||||
np['size'] = (np['size']! + dSize).clamp(30.0, 180.0);
|
||||
writeTouchLayout(widget.b.key, np);
|
||||
widget.onChanged();
|
||||
},
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: _active ? const Color(0xffffd23a) : const Color(0xccffd23a),
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(color: const Color(0xff2a2a3a), width: 1.5),
|
||||
),
|
||||
child: const Center(
|
||||
child: Icon(Icons.open_in_full, size: 14, color: Colors.black87),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user