Skip to content

Commit caf954d

Browse files
add all components to template
1 parent b37059d commit caf954d

File tree

22 files changed

+3713
-81
lines changed

22 files changed

+3713
-81
lines changed

packages/origine2/src/locales/en.po

Lines changed: 606 additions & 26 deletions
Large diffs are not rendered by default.

packages/origine2/src/locales/ja.po

Lines changed: 606 additions & 26 deletions
Large diffs are not rendered by default.

packages/origine2/src/locales/zhCn.po

Lines changed: 606 additions & 26 deletions
Large diffs are not rendered by default.

packages/origine2/src/pages/templateEditor/TemplateEditorSidebar/ComponentTree/ComponentTree.tsx

Lines changed: 300 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,11 @@ export const useComponentTreeTextbox = () => {
3838
// string 'miniavatarOff' is used by tabsSyncAction function in TemplateEditor.tsx
3939
{ name: t`文本框(小头像关闭时)`, class: 'TextBox_main_miniavatarOff' },
4040
{ name: t`文本框背景`, class: 'TextBox_Background' },
41+
{ name: t`文本元素(开始)`, class: 'TextBox_textElement_start' },
4142
{ name: t`外层文本`, class: 'outer' },
4243
{ name: t`内层文本`, class: 'inner' },
44+
{ name: t`文本占位`, class: 'zhanwei' },
45+
{ name: t`文本元素(完成)`, class: 'TextBox_textElement_Settled' },
4346
{ name: t`角色名文本框`, class: 'TextBox_showName' },
4447
{ name: t`角色名文本框背景`, class: 'TextBox_ShowName_Background' },
4548
{ name: t`小头像容器`, class: 'miniAvatarContainer' },
@@ -72,6 +75,286 @@ export const useComponentTreeChoose = () => {
7275
};
7376
};
7477

78+
export const useComponentTreeBacklog = () => {
79+
return {
80+
name: t`回想`,
81+
path: `UI/Backlog/backlog.scss`,
82+
nodes: [
83+
{ name: t`回想主界面`, class: 'Backlog_main' },
84+
{ name: t`回想主界面(退出)`, class: 'Backlog_main_out' },
85+
{ name: t`回想主界面(隐藏层级)`, class: 'Backlog_main_out_IndexHide' },
86+
{ name: t`回想主界面(禁用滚动)`, class: 'Backlog_main_DisableScroll' },
87+
{ name: t`回想顶部区域`, class: 'backlog_top' },
88+
{ name: t`回想顶部图标`, class: 'backlog_top_icon' },
89+
{ name: t`回想标题`, class: 'backlog_title' },
90+
{ name: t`回想内容区`, class: 'backlog_content' },
91+
{ name: t`回想条目`, class: 'backlog_item' },
92+
{ name: t`回想条目(退出)`, class: 'backlog_item_out' },
93+
{ name: t`回想条目功能区`, class: 'backlog_func_area' },
94+
{ name: t`回想条目角色名`, class: 'backlog_item_content_name' },
95+
{ name: t`回想条目内容容器`, class: 'backlog_item_content' },
96+
{ name: t`回想条目按钮列表`, class: 'backlog_item_button_list' },
97+
{ name: t`回想条目按钮`, class: 'backlog_item_button_element' },
98+
{ name: t`回想条目文本`, class: 'backlog_item_content_text' },
99+
],
100+
};
101+
};
102+
103+
export const useComponentTreeBottomControlPanel = () => {
104+
return {
105+
name: t`底部控制栏`,
106+
path: `UI/BottomControlPanel/bottomControlPanel.scss`,
107+
nodes: [
108+
{ name: t`控制栏主体`, class: 'main' },
109+
{ name: t`控制栏按钮`, class: 'button' },
110+
{ name: t`按钮文字`, class: 'button_text' },
111+
{ name: t`按钮(开启)`, class: 'button_on' },
112+
{ name: t`单个按钮`, class: 'singleButton' },
113+
{ name: t`单个按钮(激活)`, class: 'singleButton_active' },
114+
{ name: t`快存读预览`, class: 'fastSlPreview' },
115+
{ name: t`预览主体`, class: 'slPreviewMain' },
116+
{ name: t`预览图片容器`, class: 'imgContainer' },
117+
{ name: t`预览文本容器`, class: 'textContainer' },
118+
],
119+
};
120+
};
121+
122+
export const useComponentTreeBottomControlPanelFilm = () => {
123+
return {
124+
name: t`底部控制栏(电影模式)`,
125+
path: `UI/BottomControlPanel/bottomControlPanelFilm.scss`,
126+
nodes: [
127+
{ name: t`标签`, class: 'tag' },
128+
{ name: t`面板容器`, class: 'container' },
129+
{ name: t`面板单个按钮`, class: 'singleButton' },
130+
{ name: t`面板按钮文字`, class: 'button_text' },
131+
],
132+
};
133+
};
134+
135+
export const useComponentTreeDevPanel = () => {
136+
return {
137+
name: t`开发者面板`,
138+
path: `UI/DevPanel/devPanel.scss`,
139+
nodes: [
140+
{ name: t`面板主体`, class: 'devPanelMain' },
141+
{ name: t`面板开关`, class: 'devPanelOpener' },
142+
],
143+
};
144+
};
145+
146+
export const useComponentTreeExtra = () => {
147+
return {
148+
name: t`Extra`,
149+
path: `UI/Extra/extra.scss`,
150+
nodes: [
151+
{ name: t`Extra 主界面`, class: 'extra' },
152+
{ name: t`Extra 顶部区域`, class: 'extra_top' },
153+
{ name: t`Extra 顶部图标`, class: 'extra_top_icon' },
154+
{ name: t`Extra 标题`, class: 'extra_title' },
155+
{ name: t`Extra 主容器`, class: 'mainContainer' },
156+
{ name: t`BGM 容器`, class: 'bgmContainer' },
157+
{ name: t`BGM 列表容器`, class: 'bgmListContainer' },
158+
{ name: t`BGM 播放器`, class: 'bgmPlayerMain' },
159+
{ name: t`BGM 控制按钮`, class: 'bgmControlButton' },
160+
{ name: t`BGM 名称`, class: 'bgmName' },
161+
{ name: t`BGM 条目`, class: 'bgmElement' },
162+
{ name: t`BGM 条目(激活)`, class: 'bgmElement_active' },
163+
{ name: t`CG 主区`, class: 'cgMain' },
164+
{ name: t`CG 容器`, class: 'cgContainer' },
165+
{ name: t`CG 条目`, class: 'cgElement' },
166+
{ name: t`CG 展示区`, class: 'cgShowDiv' },
167+
{ name: t`CG 展示区外层`, class: 'cgShowDivWarpper' },
168+
{ name: t`CG 导航`, class: 'cgNav' },
169+
{ name: t`CG 导航(激活)`, class: 'cgNav_active' },
170+
{ name: t`全屏展示容器`, class: 'showFullContainer' },
171+
{ name: t`全屏 CG 主体`, class: 'showFullCgMain' },
172+
],
173+
};
174+
};
175+
176+
export const useComponentTreeGlobalDialog = () => {
177+
return {
178+
name: t`全局对话框`,
179+
path: `UI/GlobalDialog/globalDialog.scss`,
180+
nodes: [
181+
{ name: t`对话框主体`, class: 'GlobalDialog_main' },
182+
{ name: t`对话框内层容器`, class: 'glabalDialog_container_inner' },
183+
{ name: t`对话框容器`, class: 'glabalDialog_container' },
184+
{ name: t`对话框标题`, class: 'title' },
185+
{ name: t`对话框按钮列表`, class: 'button_list' },
186+
{ name: t`对话框按钮`, class: 'button' },
187+
],
188+
};
189+
};
190+
191+
export const useComponentTreeLogo = () => {
192+
return {
193+
name: t`Logo`,
194+
path: `UI/Logo/logo.scss`,
195+
nodes: [
196+
{ name: t`Logo 主体`, class: 'Logo_main' },
197+
{ name: t`Logo 背景`, class: 'Logo_Back' },
198+
{ name: t`Logo 动画激活`, class: 'animationActive' },
199+
],
200+
};
201+
};
202+
203+
export const useComponentTreeMenu = () => {
204+
return {
205+
name: t`菜单`,
206+
path: `UI/Menu/menu.scss`,
207+
nodes: [
208+
{ name: t`菜单主界面`, class: 'Menu_main' },
209+
{ name: t`菜单标签内容`, class: 'Menu_TagContent' },
210+
],
211+
};
212+
};
213+
214+
export const useComponentTreeMenuPanel = () => {
215+
return {
216+
name: t`菜单面板`,
217+
path: `UI/Menu/menuPanel.scss`,
218+
nodes: [
219+
{ name: t`菜单面板主体`, class: 'MenuPanel_main' },
220+
{ name: t`菜单面板按钮`, class: 'MenuPanel_button' },
221+
{ name: t`菜单面板按钮图标`, class: 'MenuPanel_button_icon' },
222+
{ name: t`菜单面板按钮高亮`, class: 'MenuPanel_button_hl' },
223+
],
224+
};
225+
};
226+
227+
export const useComponentTreeNormalButton = () => {
228+
return {
229+
name: t`普通按钮`,
230+
path: `UI/Menu/normalButton.scss`,
231+
nodes: [
232+
{ name: t`普通按钮`, class: 'NormalButton' },
233+
{ name: t`普通按钮(选中)`, class: 'NormalButtonChecked' },
234+
],
235+
};
236+
};
237+
238+
export const useComponentTreeNormalOption = () => {
239+
return {
240+
name: t`普通选项`,
241+
path: `UI/Menu/normalOption.scss`,
242+
nodes: [
243+
{ name: t`普通选项容器`, class: 'NormalOption' },
244+
{ name: t`普通选项标题`, class: 'NormalOption_title' },
245+
{ name: t`普通选项标题描边`, class: 'NormalOption_title_bef' },
246+
{ name: t`普通选项标题阴影`, class: 'NormalOption_title_sd' },
247+
{ name: t`普通选项按钮列表`, class: 'NormalOption_buttonList' },
248+
],
249+
};
250+
};
251+
252+
export const useComponentTreeOptions = () => {
253+
return {
254+
name: t`选项设置`,
255+
path: `UI/Menu/options.scss`,
256+
nodes: [
257+
{ name: t`选项主界面`, class: 'Options_main' },
258+
{ name: t`选项顶部`, class: 'Options_top' },
259+
{ name: t`选项标题`, class: 'Options_title' },
260+
{ name: t`选项标题文字`, class: 'Option_title_text' },
261+
{ name: t`选项标题描边`, class: 'Option_title_text_shadow' },
262+
{ name: t`选项标题投影`, class: 'Option_title_text_ts' },
263+
{ name: t`选项内容区`, class: 'Options_main_content' },
264+
{ name: t`选项内容列`, class: 'Options_main_content_half' },
265+
{ name: t`关于入口标题`, class: 'About_title_text' },
266+
{ name: t`关于入口文字`, class: 'About_text' },
267+
{ name: t`选项分页容器`, class: 'Options_page_container' },
268+
{ name: t`选项分页按钮列表`, class: 'Options_button_list' },
269+
{ name: t`选项分页按钮`, class: 'Options_page_button' },
270+
{ name: t`选项分页按钮(激活)`, class: 'Options_page_button_active' },
271+
],
272+
};
273+
};
274+
275+
export const useComponentTreeSaveAndLoad = () => {
276+
return {
277+
name: t`存读档`,
278+
path: `UI/Menu/saveAndLoad.scss`,
279+
nodes: [
280+
{ name: t`存读主界面`, class: 'Save_Load_main' },
281+
{ name: t`存读顶部`, class: 'Save_Load_top' },
282+
{ name: t`存读标题背景`, class: 'Save_Load_title' },
283+
{ name: t`存档标题文字`, class: 'Save_title_text' },
284+
{ name: t`读档标题文字`, class: 'Load_title_text' },
285+
{ name: t`存读顶部按钮列表`, class: 'Save_Load_top_buttonList' },
286+
{ name: t`存读顶部按钮`, class: 'Save_Load_top_button' },
287+
{ name: t`存读顶部按钮文字`, class: 'Save_Load_top_button_text' },
288+
{ name: t`存读顶部按钮(选中)`, class: 'Save_Load_top_button_on' },
289+
{ name: t`读档顶部按钮(选中)`, class: 'Load_top_button_on' },
290+
{ name: t`存读内容区`, class: 'Save_Load_content' },
291+
{ name: t`存读条目`, class: 'Save_Load_content_element' },
292+
{ name: t`存读条目顶部`, class: 'Save_Load_content_element_top' },
293+
{ name: t`存读条目序号`, class: 'Save_Load_content_element_top_index' },
294+
{ name: t`读档条目序号`, class: 'Load_content_elememt_top_index' },
295+
{ name: t`存读条目日期`, class: 'Save_Load_content_element_top_date' },
296+
{ name: t`读档条目日期`, class: 'Load_content_element_top_date' },
297+
{ name: t`存读条目文本`, class: 'Save_Load_content_text' },
298+
{ name: t`存读条目文本内边距`, class: 'Save_Load_content_text_padding' },
299+
{ name: t`存读条目角色名`, class: 'Save_Load_content_speaker' },
300+
{ name: t`读档条目角色名`, class: 'Load_content_speaker' },
301+
{ name: t`读档条目文本`, class: 'Load_content_text' },
302+
{ name: t`存读小立绘`, class: 'Save_Load_content_miniRen' },
303+
{ name: t`存读小立绘背景`, class: 'Save_Load_content_miniRen_bg' },
304+
{ name: t`存读小立绘角色`, class: 'Save_Load_content_miniRen_figure' },
305+
{ name: t`存读小立绘(左)`, class: 'Save_Load_content_miniRen_figLeft' },
306+
{ name: t`存读小立绘(右)`, class: 'Save_Load_content_miniRen_figRight' },
307+
],
308+
};
309+
};
310+
311+
export const useComponentTreeSlider = () => {
312+
return {
313+
name: t`滑块`,
314+
path: `UI/Menu/slider.scss`,
315+
nodes: [
316+
{ name: t`选项滑块`, class: 'Option_WebGAL_slider' },
317+
{ name: t`滑块气泡`, class: 'bubble' },
318+
],
319+
};
320+
};
321+
322+
export const useComponentTreeAbout = () => {
323+
return {
324+
name: t`关于`,
325+
path: `UI/Menu/about.scss`,
326+
nodes: [
327+
{ name: t`返回按钮`, class: 'backButton' },
328+
{ name: t`关于内容`, class: 'about' },
329+
{ name: t`图标`, class: 'icon' },
330+
{ name: t`标题`, class: 'title' },
331+
{ name: t`文本`, class: 'text' },
332+
{ name: t`贡献者`, class: 'contributor' },
333+
],
334+
};
335+
};
336+
337+
export const useComponentTreeTextPreview = () => {
338+
return {
339+
name: t`文本预览`,
340+
path: `UI/Menu/textPreview.scss`,
341+
nodes: [
342+
{ name: t`文本预览主体`, class: 'textPreviewMain' },
343+
{ name: t`预览文本框`, class: 'textbox' },
344+
],
345+
};
346+
};
347+
348+
export const useComponentTreePanicOverlay = () => {
349+
return {
350+
name: t`紧急遮罩`,
351+
path: `UI/PanicOverlay/panicOverlay.scss`,
352+
nodes: [
353+
{ name: t`紧急遮罩主体`, class: 'panic_overlay_main' },
354+
],
355+
};
356+
};
357+
75358
export default function ComponentTree() {
76359

77360
useLingui();
@@ -83,8 +366,25 @@ export default function ComponentTree() {
83366

84367
const componentTree: IComponentNode[] = [
85368
useComponentTreeTitle(),
369+
useComponentTreeLogo(),
86370
useComponentTreeTextbox(),
87371
useComponentTreeChoose(),
372+
useComponentTreeBacklog(),
373+
useComponentTreeBottomControlPanel(),
374+
useComponentTreeBottomControlPanelFilm(),
375+
useComponentTreeDevPanel(),
376+
useComponentTreeExtra(),
377+
useComponentTreeGlobalDialog(),
378+
useComponentTreeMenu(),
379+
useComponentTreeMenuPanel(),
380+
useComponentTreeNormalButton(),
381+
useComponentTreeNormalOption(),
382+
useComponentTreeOptions(),
383+
useComponentTreeSaveAndLoad(),
384+
useComponentTreeSlider(),
385+
useComponentTreeAbout(),
386+
useComponentTreeTextPreview(),
387+
useComponentTreePanicOverlay(),
88388
];
89389

90390
const templateDir = useEditorStore.use.subPage();

0 commit comments

Comments
 (0)