2025-11-21 10:03:18 +08:00
|
|
|
|
//! Texture loading and management.
|
|
|
|
|
|
//! 纹理加载和管理。
|
|
|
|
|
|
|
2025-12-16 12:46:14 +08:00
|
|
|
|
use std::cell::RefCell;
|
2025-11-21 10:03:18 +08:00
|
|
|
|
use std::collections::HashMap;
|
2025-12-16 12:46:14 +08:00
|
|
|
|
use std::rc::Rc;
|
2025-11-21 10:03:18 +08:00
|
|
|
|
use wasm_bindgen::prelude::*;
|
|
|
|
|
|
use wasm_bindgen::JsCast;
|
|
|
|
|
|
use web_sys::{HtmlImageElement, WebGl2RenderingContext, WebGlTexture};
|
|
|
|
|
|
|
|
|
|
|
|
use crate::core::error::{EngineError, Result};
|
2025-12-19 22:46:33 +08:00
|
|
|
|
use crate::backend::WebGL2Backend;
|
2025-11-21 10:03:18 +08:00
|
|
|
|
use super::Texture;
|
|
|
|
|
|
|
2025-12-16 12:46:14 +08:00
|
|
|
|
/// 纹理加载状态
|
|
|
|
|
|
/// Texture loading state
|
|
|
|
|
|
#[derive(Debug, Clone, PartialEq)]
|
|
|
|
|
|
pub enum TextureState {
|
|
|
|
|
|
/// 正在加载中
|
|
|
|
|
|
/// Loading in progress
|
|
|
|
|
|
Loading,
|
|
|
|
|
|
/// 加载完成,可以使用
|
|
|
|
|
|
/// Loaded and ready to use
|
|
|
|
|
|
Ready,
|
|
|
|
|
|
/// 加载失败
|
|
|
|
|
|
/// Load failed
|
|
|
|
|
|
Failed(String),
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
/// Texture manager for loading and caching textures.
|
|
|
|
|
|
/// 用于加载和缓存纹理的纹理管理器。
|
|
|
|
|
|
pub struct TextureManager {
|
|
|
|
|
|
/// WebGL context.
|
|
|
|
|
|
/// WebGL上下文。
|
|
|
|
|
|
gl: WebGl2RenderingContext,
|
|
|
|
|
|
|
|
|
|
|
|
/// Loaded textures.
|
|
|
|
|
|
/// 已加载的纹理。
|
|
|
|
|
|
textures: HashMap<u32, Texture>,
|
|
|
|
|
|
|
2025-11-23 14:49:37 +08:00
|
|
|
|
/// Path to texture ID mapping.
|
|
|
|
|
|
/// 路径到纹理ID的映射。
|
|
|
|
|
|
path_to_id: HashMap<String, u32>,
|
|
|
|
|
|
|
|
|
|
|
|
/// Next texture ID for auto-assignment.
|
|
|
|
|
|
/// 下一个自动分配的纹理ID。
|
|
|
|
|
|
next_id: u32,
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
/// Default white texture for untextured rendering.
|
|
|
|
|
|
/// 用于无纹理渲染的默认白色纹理。
|
|
|
|
|
|
default_texture: Option<WebGlTexture>,
|
2025-12-16 12:46:14 +08:00
|
|
|
|
|
|
|
|
|
|
/// 纹理加载状态(使用 Rc<RefCell<>> 以便闭包可以修改)
|
|
|
|
|
|
/// Texture loading states (using Rc<RefCell<>> so closures can modify)
|
|
|
|
|
|
texture_states: Rc<RefCell<HashMap<u32, TextureState>>>,
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
|
|
|
|
|
|
/// 纹理尺寸缓存(使用 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)>>>,
|
2025-11-21 10:03:18 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
impl TextureManager {
|
|
|
|
|
|
/// Create a new texture manager.
|
|
|
|
|
|
/// 创建新的纹理管理器。
|
|
|
|
|
|
pub fn new(gl: WebGl2RenderingContext) -> Self {
|
|
|
|
|
|
let mut manager = Self {
|
|
|
|
|
|
gl,
|
|
|
|
|
|
textures: HashMap::new(),
|
2025-11-23 14:49:37 +08:00
|
|
|
|
path_to_id: HashMap::new(),
|
|
|
|
|
|
next_id: 1, // Start from 1, 0 is reserved for default
|
2025-11-21 10:03:18 +08:00
|
|
|
|
default_texture: None,
|
2025-12-16 12:46:14 +08:00
|
|
|
|
texture_states: Rc::new(RefCell::new(HashMap::new())),
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
texture_dimensions: Rc::new(RefCell::new(HashMap::new())),
|
2025-11-21 10:03:18 +08:00
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
// Create default white texture | 创建默认白色纹理
|
|
|
|
|
|
manager.create_default_texture();
|
|
|
|
|
|
|
|
|
|
|
|
manager
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Create a 1x1 white texture as default.
|
|
|
|
|
|
/// 创建1x1白色纹理作为默认纹理。
|
|
|
|
|
|
fn create_default_texture(&mut self) {
|
|
|
|
|
|
let texture = self.gl.create_texture();
|
|
|
|
|
|
if let Some(tex) = &texture {
|
|
|
|
|
|
self.gl.bind_texture(WebGl2RenderingContext::TEXTURE_2D, Some(tex));
|
|
|
|
|
|
|
|
|
|
|
|
let white_pixel: [u8; 4] = [255, 255, 255, 255];
|
|
|
|
|
|
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,
|
|
|
|
|
|
1,
|
|
|
|
|
|
1,
|
|
|
|
|
|
0,
|
|
|
|
|
|
WebGl2RenderingContext::RGBA,
|
|
|
|
|
|
WebGl2RenderingContext::UNSIGNED_BYTE,
|
|
|
|
|
|
Some(&white_pixel),
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
self.gl.tex_parameteri(
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_2D,
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_MIN_FILTER,
|
|
|
|
|
|
WebGl2RenderingContext::NEAREST as i32,
|
|
|
|
|
|
);
|
|
|
|
|
|
self.gl.tex_parameteri(
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_2D,
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_MAG_FILTER,
|
|
|
|
|
|
WebGl2RenderingContext::NEAREST as i32,
|
|
|
|
|
|
);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
self.default_texture = texture;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Load a texture from URL.
|
|
|
|
|
|
/// 从URL加载纹理。
|
|
|
|
|
|
///
|
|
|
|
|
|
/// Note: This is an async operation. The texture will be available
|
2025-12-16 12:46:14 +08:00
|
|
|
|
/// after the image loads. Use `get_texture_state` to check loading status.
|
|
|
|
|
|
/// 注意:这是一个异步操作。纹理在图片加载后可用。使用 `get_texture_state` 检查加载状态。
|
2025-11-21 10:03:18 +08:00
|
|
|
|
pub fn load_texture(&mut self, id: u32, url: &str) -> Result<()> {
|
2025-12-16 12:46:14 +08:00
|
|
|
|
// 设置初始状态为 Loading | Set initial state to Loading
|
|
|
|
|
|
self.texture_states.borrow_mut().insert(id, TextureState::Loading);
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
// Create placeholder texture | 创建占位纹理
|
|
|
|
|
|
let texture = self.gl
|
|
|
|
|
|
.create_texture()
|
|
|
|
|
|
.ok_or_else(|| EngineError::TextureLoadFailed("Failed to create texture".into()))?;
|
|
|
|
|
|
|
2025-12-16 12:46:14 +08:00
|
|
|
|
// Set up temporary 1x1 transparent texture | 设置临时1x1透明纹理
|
|
|
|
|
|
// 使用透明而非灰色,这样未加载完成时不会显示奇怪的颜色
|
|
|
|
|
|
// Use transparent instead of gray, so incomplete textures don't show strange colors
|
2025-11-21 10:03:18 +08:00
|
|
|
|
self.gl.bind_texture(WebGl2RenderingContext::TEXTURE_2D, Some(&texture));
|
2025-12-16 12:46:14 +08:00
|
|
|
|
let placeholder: [u8; 4] = [0, 0, 0, 0];
|
2025-11-21 10:03:18 +08:00
|
|
|
|
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,
|
|
|
|
|
|
1,
|
|
|
|
|
|
1,
|
|
|
|
|
|
0,
|
|
|
|
|
|
WebGl2RenderingContext::RGBA,
|
|
|
|
|
|
WebGl2RenderingContext::UNSIGNED_BYTE,
|
|
|
|
|
|
Some(&placeholder),
|
|
|
|
|
|
);
|
|
|
|
|
|
|
2025-11-23 14:49:37 +08:00
|
|
|
|
// Clone texture handle for async loading before storing | 在存储前克隆纹理句柄用于异步加载
|
|
|
|
|
|
let texture_for_closure = texture.clone();
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
// Store texture with placeholder size | 存储带占位符尺寸的纹理
|
2025-11-23 14:49:37 +08:00
|
|
|
|
self.textures.insert(id, Texture::new(texture, 1, 1));
|
2025-11-21 10:03:18 +08:00
|
|
|
|
|
2025-12-16 12:46:14 +08:00
|
|
|
|
// Clone state map for closures | 克隆状态映射用于闭包
|
|
|
|
|
|
let states_for_onload = Rc::clone(&self.texture_states);
|
|
|
|
|
|
let states_for_onerror = Rc::clone(&self.texture_states);
|
|
|
|
|
|
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
// Clone dimensions map for closure | 克隆尺寸映射用于闭包
|
|
|
|
|
|
let dimensions_for_onload = Rc::clone(&self.texture_dimensions);
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
// Load actual image asynchronously | 异步加载实际图片
|
|
|
|
|
|
let gl = self.gl.clone();
|
|
|
|
|
|
|
|
|
|
|
|
let image = HtmlImageElement::new()
|
|
|
|
|
|
.map_err(|_| EngineError::TextureLoadFailed("Failed to create image element".into()))?;
|
|
|
|
|
|
|
2025-11-23 14:49:37 +08:00
|
|
|
|
// Set crossOrigin for CORS support | 设置crossOrigin以支持CORS
|
|
|
|
|
|
image.set_cross_origin(Some("anonymous"));
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
// Clone image for use in closure | 克隆图片用于闭包
|
|
|
|
|
|
let image_clone = image.clone();
|
2025-12-16 12:46:14 +08:00
|
|
|
|
let texture_id = id;
|
2025-11-21 10:03:18 +08:00
|
|
|
|
|
|
|
|
|
|
// Set up load callback | 设置加载回调
|
|
|
|
|
|
let onload = Closure::wrap(Box::new(move || {
|
2025-11-23 14:49:37 +08:00
|
|
|
|
gl.bind_texture(WebGl2RenderingContext::TEXTURE_2D, Some(&texture_for_closure));
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
// Use the captured image element | 使用捕获的图片元素
|
2025-11-23 14:49:37 +08:00
|
|
|
|
let result = gl.tex_image_2d_with_u32_and_u32_and_html_image_element(
|
2025-11-21 10:03:18 +08:00
|
|
|
|
WebGl2RenderingContext::TEXTURE_2D,
|
|
|
|
|
|
0,
|
|
|
|
|
|
WebGl2RenderingContext::RGBA as i32,
|
|
|
|
|
|
WebGl2RenderingContext::RGBA,
|
|
|
|
|
|
WebGl2RenderingContext::UNSIGNED_BYTE,
|
|
|
|
|
|
&image_clone,
|
|
|
|
|
|
);
|
|
|
|
|
|
|
2025-11-23 14:49:37 +08:00
|
|
|
|
if let Err(e) = result {
|
2025-12-16 12:46:14 +08:00
|
|
|
|
log::error!("Failed to upload texture {}: {:?} | 纹理 {} 上传失败: {:?}", texture_id, e, texture_id, e);
|
|
|
|
|
|
states_for_onload.borrow_mut().insert(texture_id, TextureState::Failed(format!("{:?}", e)));
|
|
|
|
|
|
return;
|
2025-11-23 14:49:37 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
// Set texture parameters | 设置纹理参数
|
|
|
|
|
|
gl.tex_parameteri(
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_2D,
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_WRAP_S,
|
|
|
|
|
|
WebGl2RenderingContext::CLAMP_TO_EDGE as i32,
|
|
|
|
|
|
);
|
|
|
|
|
|
gl.tex_parameteri(
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_2D,
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_WRAP_T,
|
|
|
|
|
|
WebGl2RenderingContext::CLAMP_TO_EDGE as i32,
|
|
|
|
|
|
);
|
|
|
|
|
|
gl.tex_parameteri(
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_2D,
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_MIN_FILTER,
|
|
|
|
|
|
WebGl2RenderingContext::LINEAR as i32,
|
|
|
|
|
|
);
|
|
|
|
|
|
gl.tex_parameteri(
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_2D,
|
|
|
|
|
|
WebGl2RenderingContext::TEXTURE_MAG_FILTER,
|
|
|
|
|
|
WebGl2RenderingContext::LINEAR as i32,
|
|
|
|
|
|
);
|
|
|
|
|
|
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
// 存储纹理尺寸(从加载的图片获取)
|
|
|
|
|
|
// 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));
|
|
|
|
|
|
|
2025-12-16 12:46:14 +08:00
|
|
|
|
// 标记为就绪 | Mark as ready
|
|
|
|
|
|
states_for_onload.borrow_mut().insert(texture_id, TextureState::Ready);
|
|
|
|
|
|
|
|
|
|
|
|
}) as Box<dyn Fn()>);
|
|
|
|
|
|
|
|
|
|
|
|
// Set up error callback | 设置错误回调
|
|
|
|
|
|
let url_for_error = url.to_string();
|
|
|
|
|
|
let onerror = Closure::wrap(Box::new(move || {
|
|
|
|
|
|
let error_msg = format!("Failed to load image: {}", url_for_error);
|
|
|
|
|
|
states_for_onerror.borrow_mut().insert(texture_id, TextureState::Failed(error_msg));
|
2025-11-21 10:03:18 +08:00
|
|
|
|
}) as Box<dyn Fn()>);
|
|
|
|
|
|
|
|
|
|
|
|
image.set_onload(Some(onload.as_ref().unchecked_ref()));
|
2025-12-16 12:46:14 +08:00
|
|
|
|
image.set_onerror(Some(onerror.as_ref().unchecked_ref()));
|
2025-11-21 10:03:18 +08:00
|
|
|
|
onload.forget(); // Prevent closure from being dropped | 防止闭包被销毁
|
2025-12-16 12:46:14 +08:00
|
|
|
|
onerror.forget();
|
2025-11-21 10:03:18 +08:00
|
|
|
|
|
|
|
|
|
|
image.set_src(url);
|
|
|
|
|
|
|
|
|
|
|
|
Ok(())
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Get texture by ID.
|
|
|
|
|
|
/// 按ID获取纹理。
|
|
|
|
|
|
#[inline]
|
|
|
|
|
|
pub fn get_texture(&self, id: u32) -> Option<&Texture> {
|
|
|
|
|
|
self.textures.get(&id)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Get texture size by ID.
|
|
|
|
|
|
/// 按ID获取纹理尺寸。
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
///
|
|
|
|
|
|
/// First checks the dimensions cache (updated when texture loads),
|
|
|
|
|
|
/// then falls back to the Texture struct.
|
|
|
|
|
|
/// 首先检查尺寸缓存(在纹理加载时更新),
|
|
|
|
|
|
/// 然后回退到 Texture 结构体。
|
2025-11-21 10:03:18 +08:00
|
|
|
|
#[inline]
|
|
|
|
|
|
pub fn get_texture_size(&self, id: u32) -> Option<(f32, f32)> {
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
// 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)
|
|
|
|
|
|
// 回退到纹理结构体(可能是占位符尺寸)
|
2025-11-21 10:03:18 +08:00
|
|
|
|
self.textures
|
|
|
|
|
|
.get(&id)
|
|
|
|
|
|
.map(|t| (t.width as f32, t.height as f32))
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Bind texture for rendering.
|
|
|
|
|
|
/// 绑定纹理用于渲染。
|
|
|
|
|
|
pub fn bind_texture(&self, id: u32, slot: u32) {
|
|
|
|
|
|
self.gl.active_texture(WebGl2RenderingContext::TEXTURE0 + slot);
|
|
|
|
|
|
|
|
|
|
|
|
if let Some(texture) = self.textures.get(&id) {
|
|
|
|
|
|
self.gl.bind_texture(WebGl2RenderingContext::TEXTURE_2D, Some(&texture.handle));
|
|
|
|
|
|
} else if let Some(default) = &self.default_texture {
|
2025-11-23 14:49:37 +08:00
|
|
|
|
if id != 0 {
|
|
|
|
|
|
log::warn!("Texture {} not found, using default | 未找到纹理 {},使用默认纹理", id, id);
|
|
|
|
|
|
}
|
2025-11-21 10:03:18 +08:00
|
|
|
|
self.gl.bind_texture(WebGl2RenderingContext::TEXTURE_2D, Some(default));
|
2025-11-23 14:49:37 +08:00
|
|
|
|
} else {
|
|
|
|
|
|
log::error!("Texture {} not found and no default texture! | 未找到纹理 {} 且没有默认纹理!", id, id);
|
2025-11-21 10:03:18 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-12-19 22:46:33 +08:00
|
|
|
|
/// Bind texture via backend.
|
|
|
|
|
|
/// 通过后端绑定纹理。
|
|
|
|
|
|
pub fn bind_texture_via_backend(&self, backend: &WebGL2Backend, id: u32, slot: u32) {
|
|
|
|
|
|
let texture = if let Some(tex) = self.textures.get(&id) {
|
|
|
|
|
|
Some(&tex.handle)
|
|
|
|
|
|
} else {
|
|
|
|
|
|
if id != 0 {
|
|
|
|
|
|
log::warn!("Texture {} not found, using default | 未找到纹理 {},使用默认纹理", id, id);
|
|
|
|
|
|
}
|
|
|
|
|
|
self.default_texture.as_ref()
|
|
|
|
|
|
};
|
|
|
|
|
|
backend.bind_texture_raw(texture, slot);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
/// Check if texture is loaded.
|
|
|
|
|
|
/// 检查纹理是否已加载。
|
|
|
|
|
|
#[inline]
|
|
|
|
|
|
pub fn has_texture(&self, id: u32) -> bool {
|
|
|
|
|
|
self.textures.contains_key(&id)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-12-16 12:46:14 +08:00
|
|
|
|
/// 获取纹理加载状态
|
|
|
|
|
|
/// Get texture loading state
|
|
|
|
|
|
///
|
|
|
|
|
|
/// 返回纹理的当前加载状态:Loading、Ready 或 Failed。
|
|
|
|
|
|
/// Returns the current loading state of the texture: Loading, Ready, or Failed.
|
|
|
|
|
|
#[inline]
|
|
|
|
|
|
pub fn get_texture_state(&self, id: u32) -> TextureState {
|
|
|
|
|
|
// ID 0 是默认纹理,始终就绪
|
|
|
|
|
|
// ID 0 is default texture, always ready
|
|
|
|
|
|
if id == 0 {
|
|
|
|
|
|
return TextureState::Ready;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
self.texture_states
|
|
|
|
|
|
.borrow()
|
|
|
|
|
|
.get(&id)
|
|
|
|
|
|
.cloned()
|
|
|
|
|
|
.unwrap_or(TextureState::Failed("Texture not found".to_string()))
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// 检查纹理是否已就绪可用
|
|
|
|
|
|
/// Check if texture is ready to use
|
|
|
|
|
|
///
|
|
|
|
|
|
/// 这是 `get_texture_state() == TextureState::Ready` 的便捷方法。
|
|
|
|
|
|
/// This is a convenience method for `get_texture_state() == TextureState::Ready`.
|
|
|
|
|
|
#[inline]
|
|
|
|
|
|
pub fn is_texture_ready(&self, id: u32) -> bool {
|
|
|
|
|
|
// ID 0 是默认纹理,始终就绪
|
|
|
|
|
|
// ID 0 is default texture, always ready
|
|
|
|
|
|
if id == 0 {
|
|
|
|
|
|
return true;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
matches!(
|
|
|
|
|
|
self.texture_states.borrow().get(&id),
|
|
|
|
|
|
Some(TextureState::Ready)
|
|
|
|
|
|
)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// 获取正在加载中的纹理数量
|
|
|
|
|
|
/// Get the number of textures currently loading
|
|
|
|
|
|
#[inline]
|
|
|
|
|
|
pub fn get_loading_count(&self) -> u32 {
|
|
|
|
|
|
self.texture_states
|
|
|
|
|
|
.borrow()
|
|
|
|
|
|
.values()
|
|
|
|
|
|
.filter(|s| matches!(s, TextureState::Loading))
|
|
|
|
|
|
.count() as u32
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-11-21 10:03:18 +08:00
|
|
|
|
/// Remove texture.
|
|
|
|
|
|
/// 移除纹理。
|
|
|
|
|
|
pub fn remove_texture(&mut self, id: u32) {
|
|
|
|
|
|
if let Some(texture) = self.textures.remove(&id) {
|
|
|
|
|
|
self.gl.delete_texture(Some(&texture.handle));
|
|
|
|
|
|
}
|
2025-11-23 14:49:37 +08:00
|
|
|
|
// Also remove from path mapping | 同时从路径映射中移除
|
|
|
|
|
|
self.path_to_id.retain(|_, &mut v| v != id);
|
2025-12-16 12:46:14 +08:00
|
|
|
|
// Remove state | 移除状态
|
|
|
|
|
|
self.texture_states.borrow_mut().remove(&id);
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
// Remove dimensions | 移除尺寸
|
|
|
|
|
|
self.texture_dimensions.borrow_mut().remove(&id);
|
2025-11-23 14:49:37 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Load texture by path, returning texture ID.
|
|
|
|
|
|
/// 按路径加载纹理,返回纹理ID。
|
|
|
|
|
|
///
|
|
|
|
|
|
/// If the texture is already loaded, returns existing ID.
|
|
|
|
|
|
/// 如果纹理已加载,返回现有ID。
|
|
|
|
|
|
pub fn load_texture_by_path(&mut self, path: &str) -> Result<u32> {
|
|
|
|
|
|
// Check if already loaded | 检查是否已加载
|
|
|
|
|
|
if let Some(&id) = self.path_to_id.get(path) {
|
|
|
|
|
|
return Ok(id);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// Assign new ID and load | 分配新ID并加载
|
|
|
|
|
|
let id = self.next_id;
|
|
|
|
|
|
self.next_id += 1;
|
|
|
|
|
|
|
|
|
|
|
|
// Store path mapping first | 先存储路径映射
|
|
|
|
|
|
self.path_to_id.insert(path.to_string(), id);
|
|
|
|
|
|
|
|
|
|
|
|
// Load texture with assigned ID | 用分配的ID加载纹理
|
|
|
|
|
|
self.load_texture(id, path)?;
|
|
|
|
|
|
|
|
|
|
|
|
Ok(id)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Get texture ID by path.
|
|
|
|
|
|
/// 按路径获取纹理ID。
|
|
|
|
|
|
///
|
|
|
|
|
|
/// Returns None if texture is not loaded.
|
|
|
|
|
|
/// 如果纹理未加载,返回None。
|
|
|
|
|
|
#[inline]
|
|
|
|
|
|
pub fn get_texture_id_by_path(&self, path: &str) -> Option<u32> {
|
|
|
|
|
|
self.path_to_id.get(path).copied()
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Get or load texture by path.
|
|
|
|
|
|
/// 按路径获取或加载纹理。
|
|
|
|
|
|
///
|
|
|
|
|
|
/// If texture is already loaded, returns existing ID.
|
|
|
|
|
|
/// If not loaded, loads it and returns new ID.
|
|
|
|
|
|
/// 如果纹理已加载,返回现有ID。
|
|
|
|
|
|
/// 如果未加载,加载它并返回新ID。
|
|
|
|
|
|
pub fn get_or_load_by_path(&mut self, path: &str) -> Result<u32> {
|
|
|
|
|
|
// Empty path means default texture | 空路径表示默认纹理
|
|
|
|
|
|
if path.is_empty() {
|
|
|
|
|
|
return Ok(0);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
self.load_texture_by_path(path)
|
2025-11-21 10:03:18 +08:00
|
|
|
|
}
|
2025-12-13 19:44:08 +08:00
|
|
|
|
|
|
|
|
|
|
/// Clear the path-to-ID cache.
|
|
|
|
|
|
/// 清除路径到ID的缓存映射。
|
|
|
|
|
|
///
|
|
|
|
|
|
/// This should be called when restoring scene snapshots to ensure
|
|
|
|
|
|
/// textures are reloaded with correct IDs.
|
|
|
|
|
|
/// 在恢复场景快照时应调用此方法,以确保纹理使用正确的ID重新加载。
|
|
|
|
|
|
pub fn clear_path_cache(&mut self) {
|
|
|
|
|
|
self.path_to_id.clear();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/// Clear all textures and reset state.
|
|
|
|
|
|
/// 清除所有纹理并重置状态。
|
|
|
|
|
|
///
|
|
|
|
|
|
/// This removes all loaded textures from GPU memory and resets
|
|
|
|
|
|
/// the ID counter. The default texture is preserved.
|
|
|
|
|
|
/// 这会从GPU内存中移除所有已加载的纹理并重置ID计数器。默认纹理会被保留。
|
|
|
|
|
|
pub fn clear_all(&mut self) {
|
|
|
|
|
|
// Delete all textures from GPU | 从GPU删除所有纹理
|
|
|
|
|
|
for (_, texture) in self.textures.drain() {
|
|
|
|
|
|
self.gl.delete_texture(Some(&texture.handle));
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// Clear path mapping | 清除路径映射
|
|
|
|
|
|
self.path_to_id.clear();
|
|
|
|
|
|
|
2025-12-16 12:46:14 +08:00
|
|
|
|
// Clear texture states | 清除纹理状态
|
|
|
|
|
|
self.texture_states.borrow_mut().clear();
|
|
|
|
|
|
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
// Clear texture dimensions | 清除纹理尺寸
|
|
|
|
|
|
self.texture_dimensions.borrow_mut().clear();
|
|
|
|
|
|
|
2025-12-13 19:44:08 +08:00
|
|
|
|
// Reset ID counter (1 is reserved for first texture, 0 for default)
|
|
|
|
|
|
// 重置ID计数器(1保留给第一个纹理,0给默认纹理)
|
|
|
|
|
|
self.next_id = 1;
|
|
|
|
|
|
}
|
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 的位置和锚点值映射
2025-12-19 15:33:36 +08:00
|
|
|
|
|
|
|
|
|
|
/// 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(())
|
|
|
|
|
|
}
|
2025-11-21 10:03:18 +08:00
|
|
|
|
}
|