refactor(ui): UI 系统架构重构 (#309)
* feat(ui): 动态图集系统与渲染调试增强 ## 核心功能 ### 动态图集系统 (Dynamic Atlas) - 新增 DynamicAtlasManager：运行时纹理打包，支持 MaxRects 算法 - 新增 DynamicAtlasService：自动纹理加载与图集管理 - 新增 BinPacker：高效矩形打包算法 - 支持动态/固定两种扩展策略 - 自动 UV 重映射，实现 UI 元素合批渲染 ### Frame Debugger 增强 - 新增合批分析面板，显示批次中断原因 - 新增 UI 元素层级信息（depth, worldOrderInLayer） - 新增实体高亮功能，点击可在场景中定位 - 新增动态图集可视化面板 - 改进渲染原语详情展示 ### 闪光效果 (Shiny Effect) - 新增 UIShinyEffectComponent：UI 闪光参数配置 - 新增 UIShinyEffectSystem：材质覆盖驱动的闪光动画 - 新增 ShinyEffectComponent/System（Sprite 版本） ## 引擎层改进 ### Rust 纹理管理扩展 - create_blank_texture：创建空白 GPU 纹理 - update_texture_region：局部纹理更新 - 支持动态图集的 GPU 端操作 ### 材质系统 - 新增 effects/ 目录：ShinyEffect 等效果实现 - 新增 interfaces/ 目录：IMaterial 等接口定义 - 新增 mixins/ 目录：可组合的材质功能 ### EngineBridge 扩展 - 新增 createBlankTexture/updateTextureRegion 方法 - 改进纹理加载回调机制 ## UI 渲染改进 - UIRenderCollector：支持合批调试信息 - 稳定排序：addIndex 保证渲染顺序一致性 - 九宫格渲染优化 - 材质覆盖支持 ## 其他改进 - 国际化：新增 Frame Debugger 相关翻译 - 编辑器：新增渲染调试入口 - 文档：新增架构设计文档目录 * refactor(ui): 引入新基础组件架构与渲染工具函数 Phase 1 重构 - 组件职责分离与代码复用： 新增基础组件层： - UIGraphicComponent: 所有可视 UI 元素的基类（颜色、透明度、raycast） - UIImageComponent: 纹理显示组件（支持简单、切片、平铺、填充模式） - UISelectableComponent: 可交互元素的基类（状态管理、颜色过渡） 新增渲染工具： - UIRenderUtils: 提取共享的坐标计算、边框渲染、阴影渲染等工具函数 - getUIRenderTransform: 统一的变换数据提取 - renderBorder/renderShadow: 复用的边框和阴影渲染逻辑 新增渲染系统： - UIGraphicRenderSystem: 处理新基础组件的统一渲染器 重构现有系统： - UIRectRenderSystem: 使用新工具函数，移除重复代码 - UIButtonRenderSystem: 使用新工具函数，移除重复代码 这些改动为后续统一渲染系统奠定基础。 * refactor(ui): UIProgressBarRenderSystem 使用渲染工具函数 - 使用 getUIRenderTransform 替代手动变换计算 - 使用 renderBorder 工具函数替代重复的边框渲染 - 使用 lerpColor 工具函数替代重复的颜色插值 - 简化方法签名，使用 UIRenderTransform 类型 - 移除约 135 行重复代码 * refactor(ui): Slider 和 ScrollView 渲染系统使用工具函数 - UISliderRenderSystem: 使用 getUIRenderTransform，简化方法签名 - UIScrollViewRenderSystem: 使用 getUIRenderTransform，简化方法签名 - 统一使用 UIRenderTransform 类型减少参数传递 - 消除重复的变换计算代码 * refactor(ui): 使用 UIWidgetMarker 消除硬编码组件依赖 - 新增 UIWidgetMarker 标记组件 - UIRectRenderSystem 改为检查标记而非硬编码4种组件类型 - 各 Widget 渲染系统自动添加标记组件 - 减少模块间耦合，提高可扩展性 * feat(ui): 实现 Canvas 隔离机制 - 新增 UICanvasComponent 定义 Canvas 渲染组 - UITransformComponent 添加 Canvas 相关字段：canvasEntityId, worldSortingLayer, pixelPerfect - UILayoutSystem 传播 Canvas 设置给子元素 - UIRenderUtils 使用 Canvas 继承的排序层 - 支持嵌套 Canvas 和不同渲染模式 * refactor(ui): 统一纹理管理工具函数 Phase 4: 纹理管理统一 新增: - UITextureUtils.ts: 统一的纹理描述符接口和验证函数 - UITextureDescriptor: 支持 GUID/textureId/path 多种纹理源 - isValidTextureGuid: GUID 验证 - getTextureKey: 获取用于合批的纹理键 - normalizeTextureDescriptor: 规范化各种输入格式 - utils/index.ts: 工具函数导出 修改: - UIGraphicRenderSystem: 使用新的纹理工具函数 - index.ts: 导出纹理工具类型和函数 * refactor(ui): 实现统一的脏标记机制 Phase 5: Dirty 标记机制 新增: - UIDirtyFlags.ts: 位标记枚举和追踪工具 - UIDirtyFlags: Visual/Layout/Transform/Material/Text 标记 - IDirtyTrackable: 脏追踪接口 - DirtyTracker: 辅助工具类 - 帧级别脏状态追踪 (markFrameDirty, isFrameDirty) 修改: - UIGraphicComponent: 实现 IDirtyTrackable - 属性 setter 自动设置脏标记 - 保留 setDirty/clearDirty 向后兼容 - UIImageComponent: 所有属性支持脏追踪 - textureGuid/imageType/fillAmount 等变化自动标记 - UIGraphicRenderSystem: 使用 clearDirtyFlags() 导出: - UIDirtyFlags, IDirtyTrackable, DirtyTracker - markFrameDirty, isFrameDirty, clearFrameDirty * refactor(ui): 移除过时的 dirty flag API 移除 UIGraphicComponent 中的兼容性 API: - 移除 _isDirty getter/setter - 移除 setDirty() 方法 - 移除 clearDirty() 方法 现在统一使用新的 dirty flag 系统: - isDirty() / hasDirtyFlag(flags) - markDirty(flags) / clearDirtyFlags() * fix(ui): 修复两个 TODO 功能 1. 滑块手柄命中测试 (UIInputSystem) - UISliderComponent 添加 getHandleBounds() 计算手柄边界 - UISliderComponent 添加 isPointInHandle() 精确命中测试 - UIInputSystem.handleSlider() 使用精确测试更新悬停状态 2. 径向填充渲染 (UIGraphicRenderSystem) - 实现 renderRadialFill() 方法 - 支持 radial90/radial180/radial360 三种模式 - 支持 fillOrigin (top/right/bottom/left) 和 fillClockwise - 使用多段矩形近似饼形填充效果 * feat(ui): 完善 UI 系统架构和九宫格渲染 * fix(ui): 修复文本渲染层级问题并清理调试代码 - 修复纹理就绪后调用 invalidateUIRenderCaches() 导致的无限循环 - 移除 UITextRenderSystem、UIButtonRenderSystem、UIRectRenderSystem 中的首帧调试输出 - 移除 UILayoutSystem 中的布局调试日志 - 清理所有 __UI_RENDER_DEBUG__ 条件日志 * refactor(ui): 优化渲染批处理和输入框组件 渲染系统: - 修复 RenderBatcher 保持渲染顺序 - 优化 Rust SpriteBatch 避免合并非连续精灵 - 增强 EngineRenderSystem 纹理就绪检测 输入框组件: - 增强 UIInputFieldComponent 功能 - 改进 UIInputSystem 输入处理 - 新增 TextMeasureService 文本测量服务 * fix(ui): 修复九宫格首帧渲染和InputField输入问题 - 修复九宫格首帧 size=0x0 问题： - Viewport.tsx: 预览模式读取图片尺寸存储到 importSettings - AssetDatabase: ISpriteSettings 添加 width/height 字段 - AssetMetadataService: getTextureSpriteInfo 使用元数据尺寸作为后备 - UIRectRenderSystem: 当 atlasEntry 不存在时使用 spriteInfo 尺寸 - WebBuildPipeline: 构建时包含 importSettings - AssetManager: 从 catalog 初始化时复制 importSettings - AssetTypes: IAssetCatalogEntry 添加 importSettings 字段 - 修复 InputField 无法输入问题： - UIRuntimeModule: manifest 添加 pluginExport: 'UIPlugin' - 确保预览模式正确加载 UI 插件并绑定 UIInputSystem - 添加调试日志用于排查纹理加载问题 * fix(sprite): 修复类型导出错误 MaterialPropertyOverride 和 MaterialOverrides 应从 @esengine/material-system 导出 * fix(ui-editor): 补充 AnchorPreset 拉伸预设的映射 添加 StretchTop, StretchMiddle, StretchBottom, StretchLeft, StretchCenter, StretchRight 的位置和锚点值映射
This commit is contained in:
YHH
GitHub
@@ -349,6 +349,16 @@ impl Engine {
|
||||
self.texture_manager.get_texture_id_by_path(path)
|
||||
}
|
||||
|
||||
/// Get texture size by path.
|
||||
/// 按路径获取纹理尺寸。
|
||||
///
|
||||
/// Returns None if texture is not loaded or path not found.
|
||||
/// 如果纹理未加载或路径未找到，返回 None。
|
||||
pub fn get_texture_size_by_path(&self, path: &str) -> Option<(f32, f32)> {
|
||||
let id = self.texture_manager.get_texture_id_by_path(path)?;
|
||||
self.texture_manager.get_texture_size(id)
|
||||
}
|
||||
|
||||
/// Get or load texture by path.
|
||||
/// 按路径获取或加载纹理。
|
||||
pub fn get_or_load_by_path(&mut self, path: &str) -> Result<u32> {
|
||||
@@ -374,6 +384,32 @@ impl Engine {
|
||||
self.texture_manager.clear_all();
|
||||
}
|
||||
|
||||
/// Create a blank texture for dynamic atlas.
|
||||
/// 为动态图集创建空白纹理。
|
||||
///
|
||||
/// This creates a texture that can be filled later using `update_texture_region`.
|
||||
/// 创建一个可以稍后使用 `update_texture_region` 填充的纹理。
|
||||
pub fn create_blank_texture(&mut self, width: u32, height: u32) -> Result<u32> {
|
||||
self.texture_manager.create_blank_texture(width, height)
|
||||
}
|
||||
|
||||
/// Update a region of an existing texture.
|
||||
/// 更新现有纹理的区域。
|
||||
///
|
||||
/// Used for dynamic atlas to copy textures into the atlas.
|
||||
/// 用于动态图集将纹理复制到图集中。
|
||||
pub fn update_texture_region(
|
||||
&self,
|
||||
id: u32,
|
||||
x: u32,
|
||||
y: u32,
|
||||
width: u32,
|
||||
height: u32,
|
||||
pixels: &[u8],
|
||||
) -> Result<()> {
|
||||
self.texture_manager.update_texture_region(id, x, y, width, height, pixels)
|
||||
}
|
||||
|
||||
/// 获取纹理加载状态
|
||||
/// Get texture loading state
|
||||
pub fn get_texture_state(&self, id: u32) -> crate::renderer::texture::TextureState {
|
||||
|
||||
@@ -212,6 +212,24 @@ impl GameEngine {
|
||||
self.engine.get_texture_id_by_path(path)
|
||||
}
|
||||
|
||||
/// Get texture size by path.
|
||||
/// 按路径获取纹理尺寸。
|
||||
///
|
||||
/// Returns an array [width, height] or null if not found.
|
||||
/// 返回数组 [width, height]，如果未找到则返回 null。
|
||||
///
|
||||
/// # Arguments | 参数
|
||||
/// * `path` - Image path to lookup | 要查找的图片路径
|
||||
#[wasm_bindgen(js_name = getTextureSizeByPath)]
|
||||
pub fn get_texture_size_by_path(&self, path: &str) -> Option<js_sys::Float32Array> {
|
||||
self.engine.get_texture_size_by_path(path).map(|(w, h)| {
|
||||
let arr = js_sys::Float32Array::new_with_length(2);
|
||||
arr.set_index(0, w);
|
||||
arr.set_index(1, h);
|
||||
arr
|
||||
})
|
||||
}
|
||||
|
||||
/// Get or load texture by path.
|
||||
/// 按路径获取或加载纹理。
|
||||
///
|
||||
@@ -722,4 +740,60 @@ impl GameEngine {
|
||||
pub fn clear_all_textures(&mut self) {
|
||||
self.engine.clear_all_textures();
|
||||
}
|
||||
|
||||
// ===== Dynamic Atlas API =====
|
||||
// ===== 动态图集 API =====
|
||||
|
||||
/// Create a blank texture for dynamic atlas.
|
||||
/// 为动态图集创建空白纹理。
|
||||
///
|
||||
/// This creates a texture that can be filled later using `updateTextureRegion`.
|
||||
/// Used for runtime atlas generation to batch UI elements with different textures.
|
||||
/// 创建一个可以稍后使用 `updateTextureRegion` 填充的纹理。
|
||||
/// 用于运行时图集生成，以批处理使用不同纹理的 UI 元素。
|
||||
///
|
||||
/// # Arguments | 参数
|
||||
/// * `width` - Texture width in pixels (recommended: 2048) | 纹理宽度（推荐：2048）
|
||||
/// * `height` - Texture height in pixels (recommended: 2048) | 纹理高度（推荐：2048）
|
||||
///
|
||||
/// # Returns | 返回
|
||||
/// The texture ID for the created blank texture | 创建的空白纹理ID
|
||||
#[wasm_bindgen(js_name = createBlankTexture)]
|
||||
pub fn create_blank_texture(
|
||||
&mut self,
|
||||
width: u32,
|
||||
height: u32,
|
||||
) -> std::result::Result<u32, JsValue> {
|
||||
self.engine
|
||||
.create_blank_texture(width, height)
|
||||
.map_err(|e| JsValue::from_str(&e.to_string()))
|
||||
}
|
||||
|
||||
/// Update a region of an existing texture with pixel data.
|
||||
/// 使用像素数据更新现有纹理的区域。
|
||||
///
|
||||
/// This is used for dynamic atlas to copy individual textures into the atlas.
|
||||
/// 用于动态图集将单个纹理复制到图集纹理中。
|
||||
///
|
||||
/// # Arguments | 参数
|
||||
/// * `id` - The texture ID to update | 要更新的纹理ID
|
||||
/// * `x` - X offset in the texture | 纹理中的X偏移
|
||||
/// * `y` - Y offset in the texture | 纹理中的Y偏移
|
||||
/// * `width` - Width of the region to update | 要更新的区域宽度
|
||||
/// * `height` - Height of the region to update | 要更新的区域高度
|
||||
/// * `pixels` - RGBA pixel data (Uint8Array, 4 bytes per pixel) | RGBA像素数据（每像素4字节）
|
||||
#[wasm_bindgen(js_name = updateTextureRegion)]
|
||||
pub fn update_texture_region(
|
||||
&self,
|
||||
id: u32,
|
||||
x: u32,
|
||||
y: u32,
|
||||
width: u32,
|
||||
height: u32,
|
||||
pixels: &[u8],
|
||||
) -> std::result::Result<(), JsValue> {
|
||||
self.engine
|
||||
.update_texture_region(id, x, y, width, height, pixels)
|
||||
.map_err(|e| JsValue::from_str(&e.to_string()))
|
||||
}
|
||||
}
|
||||
|
||||
@@ -82,15 +82,22 @@ impl Transform2D {
|
||||
///
|
||||
/// The matrix is constructed as: T * R * S (translate, rotate, scale).
|
||||
/// 矩阵构造顺序为：T * R * S（平移、旋转、缩放）。
|
||||
///
|
||||
/// Uses left-hand coordinate system convention:
|
||||
/// 使用左手坐标系约定：
|
||||
/// - Positive rotation = clockwise (when viewed from +Z)
|
||||
/// - 正旋转 = 顺时针（从 +Z 方向观察时）
|
||||
pub fn to_matrix(&self) -> Mat3 {
|
||||
let cos = self.rotation.cos();
|
||||
let sin = self.rotation.sin();
|
||||
|
||||
// Construct TRS matrix directly for performance
|
||||
// 直接构造TRS矩阵以提高性能
|
||||
// Clockwise rotation: [cos, -sin; sin, cos] (column-major)
|
||||
// 顺时针旋转矩阵
|
||||
Mat3::from_cols(
|
||||
glam::Vec3::new(cos * self.scale.x, sin * self.scale.x, 0.0),
|
||||
glam::Vec3::new(-sin * self.scale.y, cos * self.scale.y, 0.0),
|
||||
glam::Vec3::new(cos * self.scale.x, -sin * self.scale.x, 0.0),
|
||||
glam::Vec3::new(sin * self.scale.y, cos * self.scale.y, 0.0),
|
||||
glam::Vec3::new(self.position.x, self.position.y, 1.0),
|
||||
)
|
||||
}
|
||||
@@ -101,6 +108,9 @@ impl Transform2D {
|
||||
/// # Arguments | 参数
|
||||
/// * `width` - Sprite width | 精灵宽度
|
||||
/// * `height` - Sprite height | 精灵高度
|
||||
///
|
||||
/// Uses left-hand coordinate system (clockwise positive rotation).
|
||||
/// 使用左手坐标系（顺时针正旋转）。
|
||||
pub fn to_matrix_with_origin(&self, width: f32, height: f32) -> Mat3 {
|
||||
let ox = -self.origin.x * width * self.scale.x;
|
||||
let oy = -self.origin.y * height * self.scale.y;
|
||||
@@ -108,14 +118,16 @@ impl Transform2D {
|
||||
let cos = self.rotation.cos();
|
||||
let sin = self.rotation.sin();
|
||||
|
||||
// Apply origin offset after rotation
|
||||
// 在旋转后应用原点偏移
|
||||
let tx = self.position.x + ox * cos - oy * sin;
|
||||
let ty = self.position.y + ox * sin + oy * cos;
|
||||
// Apply origin offset after rotation (clockwise rotation)
|
||||
// 在旋转后应用原点偏移（顺时针旋转）
|
||||
let tx = self.position.x + ox * cos + oy * sin;
|
||||
let ty = self.position.y - ox * sin + oy * cos;
|
||||
|
||||
// Clockwise rotation matrix
|
||||
// 顺时针旋转矩阵
|
||||
Mat3::from_cols(
|
||||
glam::Vec3::new(cos * self.scale.x, sin * self.scale.x, 0.0),
|
||||
glam::Vec3::new(-sin * self.scale.y, cos * self.scale.y, 0.0),
|
||||
glam::Vec3::new(cos * self.scale.x, -sin * self.scale.x, 0.0),
|
||||
glam::Vec3::new(sin * self.scale.y, cos * self.scale.y, 0.0),
|
||||
glam::Vec3::new(tx, ty, 1.0),
|
||||
)
|
||||
}
|
||||
|
||||
@@ -113,13 +113,20 @@ impl Vec2 {
|
||||
|
||||
/// Rotate the vector by an angle (in radians).
|
||||
/// 按角度旋转向量（弧度）。
|
||||
///
|
||||
/// Uses left-hand coordinate system convention:
|
||||
/// 使用左手坐标系约定：
|
||||
/// - Positive angle = clockwise rotation (when viewed from +Z)
|
||||
/// - 正角度 = 顺时针旋转（从 +Z 方向观察时）
|
||||
#[inline]
|
||||
pub fn rotate(&self, angle: f32) -> Self {
|
||||
let cos = angle.cos();
|
||||
let sin = angle.sin();
|
||||
// Clockwise rotation matrix: [cos, sin; -sin, cos]
|
||||
// 顺时针旋转矩阵
|
||||
Self {
|
||||
x: self.x * cos - self.y * sin,
|
||||
y: self.x * sin + self.y * cos,
|
||||
x: self.x * cos + self.y * sin,
|
||||
y: -self.x * sin + self.y * cos,
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
//! Sprite batch renderer for efficient 2D rendering.
|
||||
//! 用于高效2D渲染的精灵批处理渲染器。
|
||||
|
||||
use indexmap::IndexMap;
|
||||
use web_sys::{
|
||||
WebGl2RenderingContext, WebGlBuffer, WebGlVertexArrayObject,
|
||||
};
|
||||
@@ -66,17 +65,23 @@ pub struct SpriteBatch {
|
||||
/// 最大精灵数。
|
||||
max_sprites: usize,
|
||||
|
||||
/// Per-material-texture vertex data buffers (insertion-ordered).
|
||||
/// 按材质和纹理分组的顶点数据缓冲区（保持插入顺序）。
|
||||
/// Batches stored as (key, vertices) pairs in submission order.
|
||||
/// 按提交顺序存储的批次（键，顶点）对。
|
||||
///
|
||||
/// Uses IndexMap to preserve render order - sprites submitted first
|
||||
/// are rendered first (appear behind later sprites).
|
||||
/// 使用 IndexMap 保持渲染顺序 - 先提交的精灵先渲染（显示在后面）。
|
||||
batches: IndexMap<BatchKey, Vec<f32>>,
|
||||
/// Only consecutive sprites with the same BatchKey are batched together.
|
||||
/// Sprites with the same key but separated by different keys are kept in separate batches
|
||||
/// to preserve correct render order.
|
||||
/// 只有连续的相同 BatchKey 的 sprites 才会合批。
|
||||
/// 相同 key 但被其他 key 分隔的 sprites 保持在独立批次中以保证正确的渲染顺序。
|
||||
batches: Vec<(BatchKey, Vec<f32>)>,
|
||||
|
||||
/// Total sprite count across all batches.
|
||||
/// 所有批次的总精灵数。
|
||||
sprite_count: usize,
|
||||
|
||||
/// Last batch key used, for determining if we can merge into the last batch.
|
||||
/// 上一个使用的批次键，用于判断是否可以合并到最后一个批次。
|
||||
last_batch_key: Option<BatchKey>,
|
||||
}
|
||||
|
||||
impl SpriteBatch {
|
||||
@@ -140,8 +145,9 @@ impl SpriteBatch {
|
||||
vbo,
|
||||
ibo,
|
||||
max_sprites,
|
||||
batches: IndexMap::new(),
|
||||
batches: Vec::new(),
|
||||
sprite_count: 0,
|
||||
last_batch_key: None,
|
||||
})
|
||||
}
|
||||
|
||||
@@ -168,8 +174,15 @@ impl SpriteBatch {
|
||||
|
||||
/// Set up vertex attribute pointers.
|
||||
/// 设置顶点属性指针。
|
||||
///
|
||||
/// Vertex layout (9 floats per vertex):
|
||||
/// 顶点布局（每顶点 9 个浮点数）:
|
||||
/// - location 0: position (2 floats) - offset 0
|
||||
/// - location 1: tex_coord (2 floats) - offset 8
|
||||
/// - location 2: color (4 floats) - offset 16
|
||||
/// - location 3: aspect_ratio (1 float) - offset 32
|
||||
fn setup_vertex_attributes(gl: &WebGl2RenderingContext) {
|
||||
let stride = (FLOATS_PER_VERTEX * 4) as i32;
|
||||
let stride = (FLOATS_PER_VERTEX * 4) as i32; // 9 * 4 = 36 bytes
|
||||
|
||||
// Position attribute (location = 0) | 位置属性
|
||||
gl.enable_vertex_attrib_array(0);
|
||||
@@ -203,15 +216,27 @@ impl SpriteBatch {
|
||||
stride,
|
||||
16, // 4 floats * 4 bytes
|
||||
);
|
||||
|
||||
// Aspect ratio attribute (location = 3) | 宽高比属性
|
||||
// Used by shaders for aspect-ratio-aware transformations
|
||||
// 用于着色器中的宽高比感知变换
|
||||
gl.enable_vertex_attrib_array(3);
|
||||
gl.vertex_attrib_pointer_with_i32(
|
||||
3,
|
||||
1,
|
||||
WebGl2RenderingContext::FLOAT,
|
||||
false,
|
||||
stride,
|
||||
32, // (2 + 2 + 4) floats * 4 bytes
|
||||
);
|
||||
}
|
||||
|
||||
/// Clear the batch for a new frame.
|
||||
/// 为新帧清空批处理。
|
||||
pub fn clear(&mut self) {
|
||||
for batch in self.batches.values_mut() {
|
||||
batch.clear();
|
||||
}
|
||||
self.batches.clear();
|
||||
self.sprite_count = 0;
|
||||
self.last_batch_key = None;
|
||||
}
|
||||
|
||||
/// Add sprites from batch data.
|
||||
@@ -302,21 +327,40 @@ impl SpriteBatch {
|
||||
let width = scale_x;
|
||||
let height = scale_y;
|
||||
|
||||
// Calculate aspect ratio (width / height), default 1.0 for degenerate cases
|
||||
// 计算宽高比（宽度/高度），退化情况下默认为 1.0
|
||||
let aspect_ratio = if height.abs() > 0.001 {
|
||||
width / height
|
||||
} else {
|
||||
1.0
|
||||
};
|
||||
|
||||
let batch_key = BatchKey {
|
||||
material_id: material_ids[i],
|
||||
texture_id: texture_ids[i],
|
||||
};
|
||||
|
||||
// Get or create batch for this material+texture combination | 获取或创建此材质+纹理组合的批次
|
||||
let batch = self.batches
|
||||
.entry(batch_key)
|
||||
.or_insert_with(Vec::new);
|
||||
// Only batch consecutive sprites with the same key to preserve render order
|
||||
// 只对连续相同 key 的 sprites 合批以保持渲染顺序
|
||||
let should_create_new_batch = match self.last_batch_key {
|
||||
Some(last_key) => batch_key != last_key,
|
||||
None => true,
|
||||
};
|
||||
|
||||
if should_create_new_batch {
|
||||
// Create a new batch | 创建新批次
|
||||
self.batches.push((batch_key, Vec::new()));
|
||||
self.last_batch_key = Some(batch_key);
|
||||
}
|
||||
|
||||
// Add to the last batch | 添加到最后一个批次
|
||||
let batch = &mut self.batches.last_mut().unwrap().1;
|
||||
|
||||
// Calculate transformed vertices and add to batch | 计算变换后的顶点并添加到批次
|
||||
Self::add_sprite_vertices_to_batch(
|
||||
batch,
|
||||
x, y, width, height, rotation, origin_x, origin_y,
|
||||
u0, v0, u1, v1, color_arr,
|
||||
u0, v0, u1, v1, color_arr, aspect_ratio,
|
||||
);
|
||||
}
|
||||
|
||||
@@ -326,6 +370,9 @@ impl SpriteBatch {
|
||||
|
||||
/// Add vertices for a single sprite to a batch.
|
||||
/// 为单个精灵添加顶点到批次。
|
||||
///
|
||||
/// Each vertex contains: position(2) + tex_coord(2) + color(4) + aspect_ratio(1) = 9 floats
|
||||
/// 每个顶点包含: 位置(2) + 纹理坐标(2) + 颜色(4) + 宽高比(1) = 9 个浮点数
|
||||
#[inline]
|
||||
fn add_sprite_vertices_to_batch(
|
||||
batch: &mut Vec<f32>,
|
||||
@@ -341,6 +388,7 @@ impl SpriteBatch {
|
||||
u1: f32,
|
||||
v1: f32,
|
||||
color: [f32; 4],
|
||||
aspect_ratio: f32,
|
||||
) {
|
||||
let cos = rotation.cos();
|
||||
let sin = rotation.sin();
|
||||
@@ -393,6 +441,10 @@ impl SpriteBatch {
|
||||
|
||||
// Color | 颜色
|
||||
batch.extend_from_slice(&color);
|
||||
|
||||
// Aspect ratio (same for all 4 vertices of a quad)
|
||||
// 宽高比（四边形的 4 个顶点相同）
|
||||
batch.push(aspect_ratio);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -432,16 +484,16 @@ impl SpriteBatch {
|
||||
gl.bind_vertex_array(None);
|
||||
}
|
||||
|
||||
/// Get all batches for rendering (in insertion order).
|
||||
/// 获取所有批次用于渲染（按插入顺序）。
|
||||
pub fn batches(&self) -> &IndexMap<BatchKey, Vec<f32>> {
|
||||
/// Get all batches for rendering (in submission order).
|
||||
/// 获取所有批次用于渲染（按提交顺序）。
|
||||
pub fn batches(&self) -> &[(BatchKey, Vec<f32>)] {
|
||||
&self.batches
|
||||
}
|
||||
|
||||
/// Flush a specific batch by key.
|
||||
/// 按键刷新特定批次。
|
||||
pub fn flush_for_batch(&self, gl: &WebGl2RenderingContext, key: &BatchKey) {
|
||||
if let Some(vertices) = self.batches.get(key) {
|
||||
/// Flush a specific batch by index.
|
||||
/// 按索引刷新特定批次。
|
||||
pub fn flush_batch_at(&self, gl: &WebGl2RenderingContext, index: usize) {
|
||||
if let Some((_, vertices)) = self.batches.get(index) {
|
||||
self.flush_batch(gl, vertices);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -9,13 +9,16 @@ pub const VERTEX_SIZE: usize = std::mem::size_of::<SpriteVertex>();
|
||||
|
||||
/// Number of floats per vertex.
|
||||
/// 每个顶点的浮点数数量。
|
||||
pub const FLOATS_PER_VERTEX: usize = 8;
|
||||
///
|
||||
/// Layout: position(2) + tex_coord(2) + color(4) + aspect_ratio(1) = 9
|
||||
/// 布局: 位置(2) + 纹理坐标(2) + 颜色(4) + 宽高比(1) = 9
|
||||
pub const FLOATS_PER_VERTEX: usize = 9;
|
||||
|
||||
/// Sprite vertex data.
|
||||
/// 精灵顶点数据。
|
||||
///
|
||||
/// Each sprite requires 4 vertices (quad), each with position, UV, and color.
|
||||
/// 每个精灵需要4个顶点（四边形），每个顶点包含位置、UV和颜色。
|
||||
/// Each sprite requires 4 vertices (quad), each with position, UV, color, and aspect ratio.
|
||||
/// 每个精灵需要4个顶点（四边形），每个顶点包含位置、UV、颜色和宽高比。
|
||||
#[derive(Debug, Clone, Copy, Pod, Zeroable)]
|
||||
#[repr(C)]
|
||||
pub struct SpriteVertex {
|
||||
@@ -30,6 +33,15 @@ pub struct SpriteVertex {
|
||||
/// Color (r, g, b, a).
|
||||
/// 颜色。
|
||||
pub color: [f32; 4],
|
||||
|
||||
/// Aspect ratio (width / height) for shader effects.
|
||||
/// 宽高比（宽度/高度），用于着色器效果。
|
||||
///
|
||||
/// This allows shaders to apply aspect-ratio-aware transformations
|
||||
/// (e.g., rotation in shiny effects) without per-instance uniforms.
|
||||
/// 这允许着色器应用宽高比感知的变换（如闪光效果中的旋转），
|
||||
/// 无需每实例 uniform。
|
||||
pub aspect_ratio: f32,
|
||||
}
|
||||
|
||||
impl SpriteVertex {
|
||||
@@ -40,11 +52,13 @@ impl SpriteVertex {
|
||||
position: [f32; 2],
|
||||
tex_coord: [f32; 2],
|
||||
color: [f32; 4],
|
||||
aspect_ratio: f32,
|
||||
) -> Self {
|
||||
Self {
|
||||
position,
|
||||
tex_coord,
|
||||
color,
|
||||
aspect_ratio,
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -55,6 +69,7 @@ impl Default for SpriteVertex {
|
||||
position: [0.0, 0.0],
|
||||
tex_coord: [0.0, 0.0],
|
||||
color: [1.0, 1.0, 1.0, 1.0],
|
||||
aspect_ratio: 1.0,
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
//! 2D camera implementation.
|
||||
//! 2D相机实现。
|
||||
//!
|
||||
//! Uses left-hand coordinate system convention:
|
||||
//! 使用左手坐标系约定：
|
||||
//! - X axis: positive to the right / X 轴：正方向向右
|
||||
//! - Y axis: positive upward (in world space) / Y 轴：正方向向上（世界空间）
|
||||
//! - Z axis: positive into the screen / Z 轴：正方向指向屏幕内
|
||||
//! - Positive rotation: clockwise (when viewed from +Z) / 正旋转：顺时针（从 +Z 观察）
|
||||
|
||||
use crate::math::Vec2;
|
||||
use glam::Mat3;
|
||||
@@ -67,6 +74,7 @@ impl Camera2D {
|
||||
/// - World: Y-up, origin at camera position | 世界坐标：Y向上，原点在相机位置
|
||||
/// - Screen: Y-down, origin at top-left | 屏幕坐标：Y向下，原点在左上角
|
||||
/// - NDC: Y-up, origin at center [-1, 1] | NDC：Y向上，原点在中心
|
||||
/// - Rotation: positive = clockwise | 旋转：正 = 顺时针
|
||||
///
|
||||
/// When zoom=1, 1 world unit = 1 screen pixel.
|
||||
/// 当zoom=1时，1个世界单位 = 1个屏幕像素。
|
||||
@@ -81,8 +89,8 @@ impl Camera2D {
|
||||
let sx = 2.0 / self.width * self.zoom;
|
||||
let sy = 2.0 / self.height * self.zoom;
|
||||
|
||||
// Handle rotation
|
||||
// 处理旋转
|
||||
// Handle rotation (clockwise positive)
|
||||
// 处理旋转（顺时针为正）
|
||||
let cos = self.rotation.cos();
|
||||
let sin = self.rotation.sin();
|
||||
|
||||
@@ -97,15 +105,17 @@ impl Camera2D {
|
||||
// 组合缩放、旋转和平移
|
||||
// Matrix = Scale * Rotation * Translation (applied right to left)
|
||||
// 矩阵 = 缩放 * 旋转 * 平移（从右到左应用）
|
||||
// Clockwise rotation: [cos, -sin; sin, cos]
|
||||
// 顺时针旋转矩阵
|
||||
if self.rotation != 0.0 {
|
||||
// With rotation: need to rotate the translation as well
|
||||
// 有旋转时：平移也需要旋转
|
||||
let rtx = tx * cos - ty * sin;
|
||||
let rty = tx * sin + ty * cos;
|
||||
// With rotation: need to rotate the translation as well (clockwise)
|
||||
// 有旋转时：平移也需要旋转（顺时针）
|
||||
let rtx = tx * cos + ty * sin;
|
||||
let rty = -tx * sin + ty * cos;
|
||||
|
||||
Mat3::from_cols(
|
||||
glam::Vec3::new(sx * cos, sx * sin, 0.0),
|
||||
glam::Vec3::new(-sy * sin, sy * cos, 0.0),
|
||||
glam::Vec3::new(sx * cos, -sx * sin, 0.0),
|
||||
glam::Vec3::new(sy * sin, sy * cos, 0.0),
|
||||
glam::Vec3::new(rtx, rty, 1.0),
|
||||
)
|
||||
} else {
|
||||
@@ -124,6 +134,7 @@ impl Camera2D {
|
||||
///
|
||||
/// Screen: (0,0) at top-left, Y-down | 屏幕：(0,0)在左上角，Y向下
|
||||
/// World: Y-up, camera at center | 世界：Y向上，相机在中心
|
||||
/// Rotation: positive = clockwise | 旋转：正 = 顺时针
|
||||
pub fn screen_to_world(&self, screen: Vec2) -> Vec2 {
|
||||
// Convert screen to NDC-like coordinates (centered, Y-up)
|
||||
// 将屏幕坐标转换为类NDC坐标（居中，Y向上）
|
||||
@@ -138,11 +149,15 @@ impl Camera2D {
|
||||
if self.rotation != 0.0 {
|
||||
// Apply inverse rotation around camera position
|
||||
// 围绕相机位置应用反向旋转
|
||||
// Inverse of clockwise θ is clockwise -θ
|
||||
// 顺时针 θ 的逆变换是顺时针 -θ
|
||||
let dx = world_x - self.position.x;
|
||||
let dy = world_y - self.position.y;
|
||||
let cos = (-self.rotation).cos();
|
||||
let sin = (-self.rotation).sin();
|
||||
let cos = self.rotation.cos(); // cos(-θ) = cos(θ)
|
||||
let sin = self.rotation.sin(); // for clockwise -θ: use -sin(θ)
|
||||
|
||||
// Clockwise rotation with -θ: x' = x*cos + y*(-sin), y' = -x*(-sin) + y*cos
|
||||
// 用 -θ 做顺时针旋转
|
||||
Vec2::new(
|
||||
dx * cos - dy * sin + self.position.x,
|
||||
dx * sin + dy * cos + self.position.y,
|
||||
@@ -157,14 +172,19 @@ impl Camera2D {
|
||||
///
|
||||
/// World: Y-up | 世界：Y向上
|
||||
/// Screen: (0,0) at top-left, Y-down | 屏幕：(0,0)在左上角，Y向下
|
||||
/// Rotation: positive = clockwise | 旋转：正 = 顺时针
|
||||
pub fn world_to_screen(&self, world: Vec2) -> Vec2 {
|
||||
let dx = world.x - self.position.x;
|
||||
let dy = world.y - self.position.y;
|
||||
|
||||
// Apply clockwise rotation
|
||||
// 应用顺时针旋转
|
||||
let (rx, ry) = if self.rotation != 0.0 {
|
||||
let cos = self.rotation.cos();
|
||||
let sin = self.rotation.sin();
|
||||
(dx * cos - dy * sin, dx * sin + dy * cos)
|
||||
// Clockwise: x' = x*cos + y*sin, y' = -x*sin + y*cos
|
||||
// 顺时针旋转公式
|
||||
(dx * cos + dy * sin, -dx * sin + dy * cos)
|
||||
} else {
|
||||
(dx, dy)
|
||||
};
|
||||
|
||||
@@ -116,19 +116,10 @@ impl Renderer2D {
|
||||
/// Render the current frame.
|
||||
/// 渲染当前帧。
|
||||
pub fn render(&mut self, gl: &WebGl2RenderingContext, texture_manager: &TextureManager) -> Result<()> {
|
||||
use super::batch::BatchKey;
|
||||
|
||||
if self.sprite_batch.sprite_count() == 0 {
|
||||
return Ok(());
|
||||
}
|
||||
|
||||
// Collect non-empty batch keys | 收集非空批次键
|
||||
let batch_keys: Vec<BatchKey> = self.sprite_batch.batches()
|
||||
.iter()
|
||||
.filter(|(_, vertices)| !vertices.is_empty())
|
||||
.map(|(key, _)| *key)
|
||||
.collect();
|
||||
|
||||
// Track current state to minimize state changes | 跟踪当前状态以最小化状态切换
|
||||
let mut current_material_id: u32 = u32::MAX;
|
||||
let mut current_texture_id: u32 = u32::MAX;
|
||||
@@ -136,7 +127,16 @@ impl Renderer2D {
|
||||
// Get projection matrix once | 一次性获取投影矩阵
|
||||
let projection = self.camera.projection_matrix();
|
||||
|
||||
for batch_key in batch_keys {
|
||||
// Iterate through batches in submission order (preserves render order)
|
||||
// 按提交顺序遍历批次（保持渲染顺序）
|
||||
for batch_idx in 0..self.sprite_batch.batches().len() {
|
||||
let (batch_key, vertices) = &self.sprite_batch.batches()[batch_idx];
|
||||
|
||||
// Skip empty batches | 跳过空批次
|
||||
if vertices.is_empty() {
|
||||
continue;
|
||||
}
|
||||
|
||||
// Switch material if needed | 如需切换材质
|
||||
if batch_key.material_id != current_material_id {
|
||||
current_material_id = batch_key.material_id;
|
||||
@@ -169,8 +169,8 @@ impl Renderer2D {
|
||||
texture_manager.bind_texture(batch_key.texture_id, 0);
|
||||
}
|
||||
|
||||
// Flush this batch | 刷新此批次
|
||||
self.sprite_batch.flush_for_batch(gl, &batch_key);
|
||||
// Flush this batch by index | 按索引刷新此批次
|
||||
self.sprite_batch.flush_batch_at(gl, batch_idx);
|
||||
}
|
||||
|
||||
// Clear batch for next frame | 清空批处理以供下一帧使用
|
||||
|
||||
@@ -52,6 +52,11 @@ pub struct TextureManager {
|
||||
/// 纹理加载状态（使用 Rc<RefCell<>> 以便闭包可以修改）
|
||||
/// Texture loading states (using Rc<RefCell<>> so closures can modify)
|
||||
texture_states: Rc<RefCell<HashMap<u32, TextureState>>>,
|
||||
|
||||
/// 纹理尺寸缓存（使用 Rc<RefCell<>> 以便闭包可以修改）
|
||||
/// Texture dimensions cache (using Rc<RefCell<>> so closures can modify)
|
||||
/// Key: texture ID, Value: (width, height)
|
||||
texture_dimensions: Rc<RefCell<HashMap<u32, (u32, u32)>>>,
|
||||
}
|
||||
|
||||
impl TextureManager {
|
||||
@@ -65,6 +70,7 @@ impl TextureManager {
|
||||
next_id: 1, // Start from 1, 0 is reserved for default
|
||||
default_texture: None,
|
||||
texture_states: Rc::new(RefCell::new(HashMap::new())),
|
||||
texture_dimensions: Rc::new(RefCell::new(HashMap::new())),
|
||||
};
|
||||
|
||||
// Create default white texture | 创建默认白色纹理
|
||||
@@ -150,6 +156,9 @@ impl TextureManager {
|
||||
let states_for_onload = Rc::clone(&self.texture_states);
|
||||
let states_for_onerror = Rc::clone(&self.texture_states);
|
||||
|
||||
// Clone dimensions map for closure | 克隆尺寸映射用于闭包
|
||||
let dimensions_for_onload = Rc::clone(&self.texture_dimensions);
|
||||
|
||||
// Load actual image asynchronously | 异步加载实际图片
|
||||
let gl = self.gl.clone();
|
||||
|
||||
@@ -205,6 +214,12 @@ impl TextureManager {
|
||||
WebGl2RenderingContext::LINEAR as i32,
|
||||
);
|
||||
|
||||
// 存储纹理尺寸（从加载的图片获取）
|
||||
// Store texture dimensions (from loaded image)
|
||||
let width = image_clone.width();
|
||||
let height = image_clone.height();
|
||||
dimensions_for_onload.borrow_mut().insert(texture_id, (width, height));
|
||||
|
||||
// 标记为就绪 | Mark as ready
|
||||
states_for_onload.borrow_mut().insert(texture_id, TextureState::Ready);
|
||||
|
||||
@@ -236,8 +251,21 @@ impl TextureManager {
|
||||
|
||||
/// Get texture size by ID.
|
||||
/// 按ID获取纹理尺寸。
|
||||
///
|
||||
/// First checks the dimensions cache (updated when texture loads),
|
||||
/// then falls back to the Texture struct.
|
||||
/// 首先检查尺寸缓存（在纹理加载时更新），
|
||||
/// 然后回退到 Texture 结构体。
|
||||
#[inline]
|
||||
pub fn get_texture_size(&self, id: u32) -> Option<(f32, f32)> {
|
||||
// Check dimensions cache first (has actual loaded dimensions)
|
||||
// 首先检查尺寸缓存（有实际加载的尺寸）
|
||||
if let Some(&(w, h)) = self.texture_dimensions.borrow().get(&id) {
|
||||
return Some((w as f32, h as f32));
|
||||
}
|
||||
|
||||
// Fall back to texture struct (may have placeholder dimensions)
|
||||
// 回退到纹理结构体（可能是占位符尺寸）
|
||||
self.textures
|
||||
.get(&id)
|
||||
.map(|t| (t.width as f32, t.height as f32))
|
||||
@@ -329,6 +357,8 @@ impl TextureManager {
|
||||
self.path_to_id.retain(|_, &mut v| v != id);
|
||||
// Remove state | 移除状态
|
||||
self.texture_states.borrow_mut().remove(&id);
|
||||
// Remove dimensions | 移除尺寸
|
||||
self.texture_dimensions.borrow_mut().remove(&id);
|
||||
}
|
||||
|
||||
/// Load texture by path, returning texture ID.
|
||||
@@ -409,8 +439,144 @@ impl TextureManager {
|
||||
// Clear texture states | 清除纹理状态
|
||||
self.texture_states.borrow_mut().clear();
|
||||
|
||||
// Clear texture dimensions | 清除纹理尺寸
|
||||
self.texture_dimensions.borrow_mut().clear();
|
||||
|
||||
// Reset ID counter (1 is reserved for first texture, 0 for default)
|
||||
// 重置ID计数器（1保留给第一个纹理，0给默认纹理）
|
||||
self.next_id = 1;
|
||||
}
|
||||
|
||||
/// Create a blank texture with specified dimensions.
|
||||
/// 创建具有指定尺寸的空白纹理。
|
||||
///
|
||||
/// This is used for dynamic atlas creation where textures
|
||||
/// are later filled with content using `update_texture_region`.
|
||||
/// 用于动态图集创建，之后使用 `update_texture_region` 填充内容。
|
||||
///
|
||||
/// # Arguments | 参数
|
||||
/// * `width` - Texture width in pixels | 纹理宽度（像素）
|
||||
/// * `height` - Texture height in pixels | 纹理高度（像素）
|
||||
///
|
||||
/// # Returns | 返回
|
||||
/// The texture ID for the created texture | 创建的纹理ID
|
||||
pub fn create_blank_texture(&mut self, width: u32, height: u32) -> Result<u32> {
|
||||
let texture = self.gl
|
||||
.create_texture()
|
||||
.ok_or_else(|| EngineError::TextureLoadFailed("Failed to create blank texture".into()))?;
|
||||
|
||||
self.gl.bind_texture(WebGl2RenderingContext::TEXTURE_2D, Some(&texture));
|
||||
|
||||
// Initialize with transparent pixels
|
||||
// 使用透明像素初始化
|
||||
let _ = self.gl.tex_image_2d_with_i32_and_i32_and_i32_and_format_and_type_and_opt_u8_array(
|
||||
WebGl2RenderingContext::TEXTURE_2D,
|
||||
0,
|
||||
WebGl2RenderingContext::RGBA as i32,
|
||||
width as i32,
|
||||
height as i32,
|
||||
0,
|
||||
WebGl2RenderingContext::RGBA,
|
||||
WebGl2RenderingContext::UNSIGNED_BYTE,
|
||||
None, // NULL data - allocate but don't fill
|
||||
);
|
||||
|
||||
// Set texture parameters for atlas use
|
||||
// 设置图集使用的纹理参数
|
||||
self.gl.tex_parameteri(
|
||||
WebGl2RenderingContext::TEXTURE_2D,
|
||||
WebGl2RenderingContext::TEXTURE_WRAP_S,
|
||||
WebGl2RenderingContext::CLAMP_TO_EDGE as i32,
|
||||
);
|
||||
self.gl.tex_parameteri(
|
||||
WebGl2RenderingContext::TEXTURE_2D,
|
||||
WebGl2RenderingContext::TEXTURE_WRAP_T,
|
||||
WebGl2RenderingContext::CLAMP_TO_EDGE as i32,
|
||||
);
|
||||
self.gl.tex_parameteri(
|
||||
WebGl2RenderingContext::TEXTURE_2D,
|
||||
WebGl2RenderingContext::TEXTURE_MIN_FILTER,
|
||||
WebGl2RenderingContext::LINEAR as i32,
|
||||
);
|
||||
self.gl.tex_parameteri(
|
||||
WebGl2RenderingContext::TEXTURE_2D,
|
||||
WebGl2RenderingContext::TEXTURE_MAG_FILTER,
|
||||
WebGl2RenderingContext::LINEAR as i32,
|
||||
);
|
||||
|
||||
// Assign ID and store
|
||||
// 分配ID并存储
|
||||
let id = self.next_id;
|
||||
self.next_id += 1;
|
||||
|
||||
self.textures.insert(id, Texture::new(texture, width, height));
|
||||
self.texture_states.borrow_mut().insert(id, TextureState::Ready);
|
||||
self.texture_dimensions.borrow_mut().insert(id, (width, height));
|
||||
|
||||
log::debug!("Created blank texture {} ({}x{}) | 创建空白纹理 {} ({}x{})", id, width, height, id, width, height);
|
||||
|
||||
Ok(id)
|
||||
}
|
||||
|
||||
/// Update a region of an existing texture with pixel data.
|
||||
/// 使用像素数据更新现有纹理的区域。
|
||||
///
|
||||
/// This is used for dynamic atlas to copy individual textures
|
||||
/// into the atlas texture.
|
||||
/// 用于动态图集将单个纹理复制到图集纹理中。
|
||||
///
|
||||
/// # Arguments | 参数
|
||||
/// * `id` - The texture ID to update | 要更新的纹理ID
|
||||
/// * `x` - X offset in the texture | 纹理中的X偏移
|
||||
/// * `y` - Y offset in the texture | 纹理中的Y偏移
|
||||
/// * `width` - Width of the region to update | 要更新的区域宽度
|
||||
/// * `height` - Height of the region to update | 要更新的区域高度
|
||||
/// * `pixels` - RGBA pixel data (4 bytes per pixel) | RGBA像素数据（每像素4字节）
|
||||
///
|
||||
/// # Returns | 返回
|
||||
/// Ok(()) on success, Err if texture not found or update failed
|
||||
/// 成功时返回 Ok(())，纹理未找到或更新失败时返回 Err
|
||||
pub fn update_texture_region(
|
||||
&self,
|
||||
id: u32,
|
||||
x: u32,
|
||||
y: u32,
|
||||
width: u32,
|
||||
height: u32,
|
||||
pixels: &[u8],
|
||||
) -> Result<()> {
|
||||
let texture = self.textures.get(&id)
|
||||
.ok_or_else(|| EngineError::TextureLoadFailed(format!("Texture {} not found", id)))?;
|
||||
|
||||
// Validate pixel data size
|
||||
// 验证像素数据大小
|
||||
let expected_size = (width * height * 4) as usize;
|
||||
if pixels.len() != expected_size {
|
||||
return Err(EngineError::TextureLoadFailed(format!(
|
||||
"Pixel data size mismatch: expected {}, got {} | 像素数据大小不匹配：预期 {}，实际 {}",
|
||||
expected_size, pixels.len(), expected_size, pixels.len()
|
||||
)));
|
||||
}
|
||||
|
||||
self.gl.bind_texture(WebGl2RenderingContext::TEXTURE_2D, Some(&texture.handle));
|
||||
|
||||
// Use texSubImage2D to update a region
|
||||
// 使用 texSubImage2D 更新区域
|
||||
self.gl.tex_sub_image_2d_with_i32_and_i32_and_u32_and_type_and_opt_u8_array(
|
||||
WebGl2RenderingContext::TEXTURE_2D,
|
||||
0,
|
||||
x as i32,
|
||||
y as i32,
|
||||
width as i32,
|
||||
height as i32,
|
||||
WebGl2RenderingContext::RGBA,
|
||||
WebGl2RenderingContext::UNSIGNED_BYTE,
|
||||
Some(pixels),
|
||||
).map_err(|e| EngineError::TextureLoadFailed(format!("texSubImage2D failed: {:?}", e)))?;
|
||||
|
||||
log::trace!("Updated texture {} region ({},{}) {}x{} | 更新纹理 {} 区域 ({},{}) {}x{}",
|
||||
id, x, y, width, height, id, x, y, width, height);
|
||||
|
||||
Ok(())
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user