跟着官方demo 学flame 之 word 坐标系以及Camera的一些属性

ini 复制代码
//计算放大比例 让试图充满宽或者高
final zoomLevel = min(
  canvasSize.x / trackSize.x,
  canvasSize.y / trackSize.y,
);
startCamera = CameraComponent(world: world)
  ..viewfinder.position = Vector2(0, 0) //指定相机瞄准的坐标
  ..viewfinder.anchor = Anchor.bottomLeft //指定瞄准的位置在屏幕的位置
  ..viewfinder.zoom = zoomLevel - 0.2;//指定放大的倍数
add(startCamera);

前情提要:1 word 的世界是以左下角为(0,0) 向右 向下 为正。

2 这里的视图内容是一个(0,0)-(500,500)的区域

js 复制代码
 ..viewfinder.position = Vector2(0, 0) //指定相机瞄准的坐标
 ..viewfinder.anchor = Anchor.bottomLeft //指定瞄准的位置在屏幕的位置

指定相机瞄准(0,0),且相机位于左下角。效果图如下

js 复制代码
 ..viewfinder.position = Vector2(0, 0) //指定相机瞄准的坐标
 ..viewfinder.anchor = Anchor.center //指定瞄准的位置在屏幕的位置

指定相机瞄准(0,0),且相机居中(也就是相机瞄准的(0,0)位于屏幕中央)。效果图如下

ini 复制代码
..viewfinder.position = Vector2(250, 250)
..viewfinder.anchor = Anchor.center

指定相机瞄准(250,250),且相机居中(也就是相机瞄准的(250,250)位于屏幕中央,内容中心居中)。效果图如下:

相关推荐
QQ129584550413 小时前
错误解决:Flutter找不到合适的Visual Studio 工具链
flutter·visual studio
程序员老刘13 小时前
Flutter版本选择指南:避坑3.27 | 2025年9月
flutter·客户端
清风细雨_林木木17 小时前
flutter 里面的渐变色设置
前端·flutter
猪哥帅过吴彦祖18 小时前
Flutter 系列教程:布局基础 (下) - Stack 绝对定位和 Expanded 弹性布局
前端·flutter·ios
小林的技术分享19 小时前
Flutter 创建一个插件(FFI)
flutter
木易 士心1 天前
Flutter - dart 语言从入门到精通
flutter
文阿花2 天前
flutter 3.22+ Android集成高德Flutter地图自定义Marker显示
android·flutter
猪哥帅过吴彦祖2 天前
Flutter 系列教程:布局基础 (上) - `Container`, `Row`, `Column`, `Flex`
前端·flutter·ios
星海浮沉2 天前
flutter AudioPlayer的使用问题及处理
flutter
-晨-风-2 天前
Flutter 运行IOS真机,提示无法打开“****”
flutter·ios