feat(canvas):画布 - 相机控制(虚拟摄影机) (#473)

* refactor(canvas): 重构相机控制UI,拆分独立组件并调整位置

将原图像设置弹窗中的相机控制功能抽离为独立组件,调整相机控制按钮到图像设置前的布局,简化原弹窗组件代码

* refactor(canvas-toolbar): 调整光影工具分组与渲染逻辑

将原视角分组中的光影工具拆分到独立lighting分组,更新类型定义与工具栏渲染逻辑,让工具分组更贴合功能场景

---------

Co-authored-by: bensharp <bensharp@qq.com>
This commit is contained in:
zhangerheo
2026-09-10 11:33:18 +08:00
committed by GitHub
parent 76054462f1
commit 2276ab750e
5 changed files with 71 additions and 61 deletions

View File

@@ -280,7 +280,8 @@ export function CanvasNodeToolbar({
const primaryTools = narrow ? primary.slice(0, 1) : primary;
const portraitTools = compact ? [] : inGroup("portrait");
const viewpointTools = compact ? [] : inGroup("viewpoint");
const processTools = compact ? [...inGroup("portrait"), ...inGroup("viewpoint"), ...inGroup("process")] : inGroup("process");
const lightingTools = compact ? [] : inGroup("lighting");
const processTools = compact ? [...inGroup("portrait"), ...inGroup("viewpoint"), ...inGroup("lighting"), ...inGroup("process")] : inGroup("process");
const workspaceTools = narrow ? [] : inGroup("workspace");
const utilityTools = inGroup("utility");
const moreTools = [...(narrow ? [...primary.slice(1), ...inGroup("workspace")] : []), ...inGroup("more")];
@@ -315,6 +316,7 @@ export function CanvasNodeToolbar({
{primaryTools.map((tool) => <NodeDockToolButton key={tool.id} tool={tool} />)}
{portraitTools.length ? <NodeDockMenuButton menuId="portrait" label="人像调整" icon={<UserRound className="size-3.5" />} tools={portraitTools} openMenuId={openMenuId} onOpenChange={handleMenuOpenChange} /> : null}
{viewpointTools.map((tool) => <NodeDockToolButton key={tool.id} tool={tool} />)}
{lightingTools.map((tool) => <NodeDockToolButton key={tool.id} tool={tool} />)}
{processTools.length ? <NodeDockMenuButton menuId="process" label={processMenuLabel} icon={isVideo ? <Images className="size-3.5" /> : <SlidersHorizontal className="size-3.5" />} tools={processTools} openMenuId={openMenuId} onOpenChange={handleMenuOpenChange} /> : null}
{workspaceTools.length ? <span aria-hidden className="aceternity-dock-separator mx-1 h-5 w-px shrink-0" /> : null}
{workspaceTools.map((tool) => <NodeDockToolButton key={tool.id} tool={tool} />)}