🌐 完善设置界面一些组的标题

Author: Littlefean

app/src/locales/zh_CN.yml

@@ -731,6 +731,66 @@ startFilePanel:
     showAbsolutePath: 显示绝对路径
     showFileTime: 显示文件时间
 
+controlSettingsGroup:
+  mouse:
+    title: 鼠标设置
+  touchpad:
+    title: 触摸板设置
+  cameraMove:
+    title: 视野移动设置
+  cameraZoom:
+    title: 视野缩放设置
+  rectangleSelect:
+    title: 框选设置
+  textNode:
+    title: 文本节点设置
+  edge:
+    title: 连线设置
+  generateNode:
+    title: 通过键盘生长节点设置
+  gamepad:
+    title: 游戏手柄设置
+
+visualSettingsGroup:
+  basic:
+    title: 基础设置
+  background:
+    title: 背景设置
+  node:
+    title: 节点样式设置
+  edge:
+    title: 连线样式设置
+  section:
+    title: “框”的样式设置
+  entityDetails:
+    title: 实体详情设置
+  help:
+    title: 遇到问题时相关的设置
+  miniWindow:
+    title: 迷你窗口设置
+  testingFunctions:
+    title: 实验性功能
+    description: |
+      如果您不了解下面的设置，请不要修改它们。否则您会感觉出现灵异事件
+
+performanceSettingsGroup:
+  memory:
+    title: 内存相关性能设置
+    description: |
+      以下设置项和内存有关，建议根据您的计算机配置进行调整
+  cpu:
+    title: CPU相关性能设置
+    description: |
+      以下设置项和CPU有关，建议根据您的计算机配置进行调整
+  render:
+    title: 渲染相关性能设置
+    description: |
+      以下设置项和渲染有关，建议根据您的计算机配置进行调整
+  dev:
+    title: 还在开发中的功能
+    description: |
+      以下设置项还在开发，不建议修改
+
 effects:
   CircleChangeRadiusEffect:
     title: 圆形变换半径效果

app/src/pages/settings/control.tsx

@@ -29,11 +29,14 @@ import {
 } from "lucide-react";
 import { FieldGroup, SettingField } from "../../components/Field";
 import { isMac } from "../../utils/platform";
+import { useTranslation } from "react-i18next";
 
 export default function Control() {
+  const { t } = useTranslation("controlSettingsGroup");
+
   return (
     <>
-      <FieldGroup title="Mouse 鼠标设定" icon={<Mouse />}>
+      <FieldGroup title={t("mouse.title")} icon={<Mouse />}>
         <SettingField icon={<MousePointerClick />} settingKey="mouseRightDragBackground" type="select" />
         <SettingField icon={<AlignStartVertical />} settingKey="enableDragAutoAlign" type="switch" />
         <SettingField icon={<Mouse />} settingKey="mouseWheelMode" type="select" />
@@ -44,7 +47,7 @@ export default function Control() {
         <SettingField icon={<Grab />} settingKey="mouseSideWheelMode" type="select" />
         {isMac && <SettingField icon={<Mouse />} settingKey="macMouseWheelIsSmoothed" type="switch" />}
       </FieldGroup>
-      <FieldGroup title="TouchPad 触摸板设定" icon={<Touchpad />}>
+      <FieldGroup title={t("touchpad.title")} icon={<Touchpad />}>
         <SettingField icon={<Hand />} settingKey="enableWindowsTouchPad" type="switch" />
         {isMac && <SettingField icon={<Hand />} settingKey="macTrackpadAndMouseWheelDifference" type="select" />}
         {isMac && (
@@ -58,14 +61,14 @@ export default function Control() {
           />
         )}
       </FieldGroup>
-      <FieldGroup title="Camera Move 摄像机/视野 移动" icon={<Fullscreen />}>
+      <FieldGroup title={t("cameraMove.title")} icon={<Fullscreen />}>
         <SettingField icon={<Keyboard />} settingKey="allowMoveCameraByWSAD" type="switch" />
         <SettingField icon={<Crosshair />} settingKey="cameraFollowsSelectedNodeOnArrowKeys" type="switch" />
         <SettingField icon={<Keyboard />} settingKey="cameraKeyboardMoveReverse" type="switch" />
         <SettingField icon={<Move />} settingKey="moveAmplitude" type="slider" min={0} max={10} step={0.1} />
         <SettingField icon={<Move />} settingKey="moveFriction" type="slider" min={0} max={1} step={0.01} />
       </FieldGroup>
-      <FieldGroup title="Camera Scale 摄像机/视野 缩放" icon={<Scaling />}>
+      <FieldGroup title={t("cameraZoom.title")} icon={<Scaling />}>
         <SettingField icon={<ScanEye />} settingKey="scaleExponent" type="slider" min={0} max={1} step={0.01} />
         <SettingField
           icon={<Fullscreen />}
@@ -85,12 +88,12 @@ export default function Control() {
           step={0.1}
         />
       </FieldGroup>
-      <FieldGroup title="RectangleSelect 框选" icon={<SquareDashedMousePointer />}>
+      <FieldGroup title={t("rectangleSelect.title")} icon={<SquareDashedMousePointer />}>
         <SettingField icon={<SquareArrowDownRight />} settingKey="rectangleSelectWhenRight" type="select" />
         <SettingField icon={<SquareArrowUpLeft />} settingKey="rectangleSelectWhenLeft" type="select" />
       </FieldGroup>
 
-      <FieldGroup title="TextNode 文本节点" icon={<TextSelect />}>
+      <FieldGroup title={t("textNode.title")} icon={<TextSelect />}>
         <SettingField icon={<ListRestart />} settingKey="textNodeStartEditMode" type="select" />
         <SettingField icon={<ListEnd />} settingKey="textNodeContentLineBreak" type="select" />
         <SettingField icon={<ListCheck />} settingKey="textNodeExitEditMode" type="select" />
@@ -102,14 +105,14 @@ export default function Control() {
         <SettingField icon={<TextCursorInput />} settingKey="textNodeSelectAllWhenStartEditByKeyboard" type="switch" />
       </FieldGroup>
 
-      <FieldGroup title="Edge 连线" icon={<GitCompareArrows />}>
+      <FieldGroup title={t("edge.title")} icon={<GitCompareArrows />}>
         <SettingField icon={<RotateCw />} settingKey="allowAddCycleEdge" type="switch" />
       </FieldGroup>
-      <FieldGroup title="GenerateNode 通过键盘生长节点" icon={<Network className="-rotate-90" />}>
+      <FieldGroup title={t("generateNode.title")} icon={<Network className="-rotate-90" />}>
         <SettingField icon={<ListTree />} settingKey="autoLayoutWhenTreeGenerate" type="switch" />
       </FieldGroup>
 
-      <FieldGroup title="Gamepad 手柄相关" icon={<Gamepad2 />}>
+      <FieldGroup title={t("gamepad.title")} icon={<Gamepad2 />}>
         <SettingField icon={<Skull />} settingKey="gamepadDeadzone" type="slider" min={0} max={1} step={0.01} />
       </FieldGroup>
       {/* 已经有快捷键专栏了，这里不再显示快捷键相关 */}

app/src/pages/settings/performance.tsx

@@ -14,12 +14,15 @@ import {
   Ungroup,
 } from "lucide-react";
 import { FieldGroup, SettingField } from "../../components/Field";
+import { useTranslation } from "react-i18next";
 
 export default function Performance() {
+  const { t } = useTranslation("performanceSettingsGroup");
+
   return (
     <>
-      <FieldGroup title="Memory 内存" description="以下选项和设备内存相关" icon={<MemoryStick />}>
-        <SettingField icon={<Undo />} settingKey="historySize" type="slider" min={10} max={1000} step={10} />
+      <FieldGroup title={t("memory.title")} description={t("memory.description")} icon={<MemoryStick />}>
+        <SettingField icon={<Undo />} settingKey="historySize" type="slider" min={1} max={1000} step={5} />
         <SettingField icon={<ImageMinus />} settingKey="compressPastedImages" type="switch" />
         <SettingField
           icon={<ImageUpscale />}
@@ -31,10 +34,10 @@ export default function Performance() {
         />
       </FieldGroup>
 
-      <FieldGroup title="CPU 处理器" description="以下选项和设备处理器相关" icon={<Cpu />}>
+      <FieldGroup title={t("cpu.title")} description={t("cpu.description")} icon={<Cpu />}>
         <SettingField icon={<RefreshCcwDot />} settingKey="autoRefreshStageByMouseAction" type="switch" />
       </FieldGroup>
-      <FieldGroup title="Render 画面渲染" description="以下选项和设备的显卡/核显/屏幕刷新率相关" icon={<MonitorPlay />}>
+      <FieldGroup title={t("render.title")} description={t("render.description")} icon={<MonitorPlay />}>
         <SettingField icon={<Hourglass />} settingKey="isPauseRenderWhenManipulateOvertime" type="switch" />
         <SettingField
           icon={<Hourglass />}
@@ -58,11 +61,7 @@ export default function Performance() {
         />
       </FieldGroup>
 
-      <FieldGroup
-        title="开发中 Developing..."
-        description="功能正在开发中，可能存在一些问题，请谨慎使用。"
-        icon={<Hourglass />}
-      >
+      <FieldGroup title={t("dev.title")} description={t("dev.description")} icon={<Hourglass />}>
         <SettingField icon={<Turtle />} settingKey="compatibilityMode" type="switch" />
         <SettingField icon={<Ungroup />} settingKey="isEnableEntityCollision" type="switch" />
       </FieldGroup>

app/src/pages/settings/visual.tsx

@@ -31,33 +31,38 @@ import {
   Workflow,
 } from "lucide-react";
 import { FieldGroup, SettingField } from "../../components/Field";
+import { useTranslation } from "react-i18next";
 
 export default function Visual() {
+  const { t } = useTranslation("visualSettingsGroup");
+
   return (
     <>
-      <FieldGroup title="Basic Settings 基础设置" icon={<Settings />}>
+      <FieldGroup title={t("basic.title")} icon={<Settings />}>
         <SettingField icon={<Languages />} settingKey="language" type="select" />
         <SettingField icon={<AppWindow />} settingKey="showTipsOnUI" type="switch" />
         <SettingField icon={<AppWindowMac />} settingKey="useNativeTitleBar" type="switch" />
         <SettingField icon={<Presentation />} settingKey="isClassroomMode" type="switch" />
         <SettingField icon={<Blend />} settingKey="windowBackgroundAlpha" type="slider" min={0} max={1} step={0.01} />
       </FieldGroup>
-      <FieldGroup title="Background 背景设置" icon={<Grip />}>
+      <FieldGroup title={t("background.title")} icon={<Grip />}>
         <SettingField icon={<Crosshair />} settingKey="isRenderCenterPointer" type="switch" />
         <SettingField icon={<Rows4 />} settingKey="showBackgroundHorizontalLines" type="switch" />
         <SettingField icon={<Columns4 />} settingKey="showBackgroundVerticalLines" type="switch" />
         <SettingField icon={<Grip />} settingKey="showBackgroundDots" type="switch" />
         <SettingField icon={<Move3d />} settingKey="showBackgroundCartesian" type="switch" />
       </FieldGroup>
 
-      <FieldGroup title="Node & Edge 节点与连线样式" icon={<Workflow />}>
-        <SettingField icon={<Spline />} settingKey="lineStyle" type="select" />
+      <FieldGroup title={t("node.title")} icon={<Workflow />}>
         <SettingField icon={<Tag />} settingKey="enableTagTextNodesBigDisplay" type="switch" />
       </FieldGroup>
-      <FieldGroup title="Section 框" icon={<Square />}>
+      <FieldGroup title={t("edge.title")} icon={<Workflow />}>
+        <SettingField icon={<Spline />} settingKey="lineStyle" type="select" />
+      </FieldGroup>
+      <FieldGroup title={t("section.title")} icon={<Square />}>
         <SettingField icon={<SquareM />} settingKey="sectionBitTitleRenderType" type="select" />
       </FieldGroup>
-      <FieldGroup title="节点详情" icon={<ReceiptText />}>
+      <FieldGroup title={t("entityDetails.title")} icon={<ReceiptText />}>
         <SettingField icon={<AppWindow />} settingKey="nodeDetailsPanel" type="select" />
         <SettingField icon={<ListCollapse />} settingKey="alwaysShowDetails" type="switch" />
         <SettingField
@@ -85,18 +90,18 @@ export default function Visual() {
           step={100}
         />
       </FieldGroup>
-      <FieldGroup title="Help 遇到问题时相关的设置" icon={<MessageCircleQuestion />}>
+      <FieldGroup title={t("help.title")} icon={<MessageCircleQuestion />}>
         <SettingField icon={<Bug />} settingKey="showDebug" type="switch" />
         <SettingField icon={<VenetianMask />} settingKey="protectingPrivacy" type="switch" />
       </FieldGroup>
-      <FieldGroup title="Mini Window 迷你窗口" icon={<PictureInPicture />}>
+      <FieldGroup title={t("miniWindow.title")} icon={<PictureInPicture />}>
         <SettingField icon={<MoveHorizontal />} settingKey="windowCollapsingWidth" type="slider" min={50} max={2000} />
         <SettingField icon={<MoveVertical />} settingKey="windowCollapsingHeight" type="slider" min={25} max={2000} />
       </FieldGroup>
 
       <FieldGroup
-        title="Testing Functions 实验性功能"
-        description="如果您不了解下面的设置，请不要修改它们。否则您会感觉出现灵异事件"
+        title={t("testingFunctions.title")}
+        description={t("testingFunctions.description")}
         icon={<FlaskConical />}
       >
         <SettingField icon={<Ratio />} settingKey="limitCameraInCycleSpace" type="switch" />