Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions packages/parser/src/config/scriptConfig.ts
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ export const SCRIPT_CONFIG = [
{ scriptString: 'applyStyle', scriptType: commandType.applyStyle },
{ scriptString: 'wait', scriptType: commandType.wait },
{ scriptString: 'callSteam', scriptType: commandType.callSteam },
{ scriptString: 'setStatusBar', scriptType: commandType.setStatusBar },
];
export const ADD_NEXT_ARG_LIST = [
commandType.bgm,
Expand Down
1 change: 1 addition & 0 deletions packages/parser/src/interface/sceneInterface.ts
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ export enum commandType {
applyStyle,
wait,
callSteam, // 调用Steam功能
setStatusBar, // 设置顶部状态框
}

/**
Expand Down
2 changes: 2 additions & 0 deletions packages/webgal/public/game/scene/demo_zh_cn.txt
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
bgm:s_Title.mp3 -volume=80 -enter=3000;
unlockBgm:s_Title.mp3 -name=雲を追いかけて;
intro:你好|欢迎来到 {egine} 的世界;
setStatusBar:Chapter 0 欢迎来到 {egine};
changeBg:WebGalEnter.webp -next;
setTransition: -target=bg-main -exit=shockwaveOut;
:你好|欢迎来到 {egine} 的世界;
Expand All @@ -23,6 +24,7 @@ pixiPerform:snow;
比如,这个下起小雪的特效。 -v6.wav;
除此以外,分支选择的功能也必不可少。 -v7.wav;
pixiInit;
setStatusBar:none;
WebGAL:接下来介绍一些新版本功能!
WebGAL:比如这个[注](zhù)[音](yīn)功能,可以为游戏带来更好的体验!
WebGAL:我们也支持了[文本拓展语法](style=color:#B5495B\;),可以为[文](wen)[本](ben)带来[富文本支持](style-alltext=font-style:italic\; style=color:#66327C\;)、交互等特性。
Expand Down
2 changes: 2 additions & 0 deletions packages/webgal/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import Menu from '@/UI/Menu/Menu';
import GlobalDialog from '@/UI/GlobalDialog/GlobalDialog';
import PanicOverlay from '@/UI/PanicOverlay/PanicOverlay';
import DevPanel from '@/UI/DevPanel/DevPanel';
import { StatusBar } from '@/UI/StatusBar/StatusBar';

export default function App() {
useEffect(() => {
Expand All @@ -31,6 +32,7 @@ export default function App() {
<GlobalDialog />
<PanicOverlay />
<DevPanel />
<StatusBar />
</div>
);
}
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ export enum commandType {
applyStyle,
wait,
callSteam, // 调用Steam功能
setStatusBar, // 设置顶部状态框
}

/**
Expand Down
2 changes: 2 additions & 0 deletions packages/webgal/src/Core/parser/sceneParser.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ import { showVars } from '../gameScripts/showVars';
import { defineScripts, IConfigInterface, ScriptConfig, ScriptFunction, scriptRegistry } from './utils';
import { applyStyle } from '@/Core/gameScripts/applyStyle';
import { wait } from '@/Core/gameScripts/wait';
import { setStatusBar } from '@/Core/gameScripts/setStatusBar';

export const SCRIPT_TAG_MAP = defineScripts({
say: ScriptConfig(commandType.say, say),
Expand Down Expand Up @@ -74,6 +75,7 @@ export const SCRIPT_TAG_MAP = defineScripts({
applyStyle: ScriptConfig(commandType.applyStyle, applyStyle, { next: true }),
wait: ScriptConfig(commandType.wait, wait),
callSteam: ScriptConfig(commandType.callSteam, callSteam, { next: true }),
setStatusBar: ScriptConfig(commandType.setStatusBar, setStatusBar, { next: true }),
});

export const SCRIPT_CONFIG: IConfigInterface[] = Object.values(SCRIPT_TAG_MAP);
Expand Down
27 changes: 27 additions & 0 deletions packages/webgal/src/UI/StatusBar/StatusBar.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
.status-bar {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 10vh;
min-height: 50px;
Comment on lines +6 to +7
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

状态栏高度设置为 10vh(在 1080p 屏幕上约为 108px),对于一个仅显示单行文本的状态栏来说可能占据了过多的垂直空间。建议考虑减小高度,例如使用固定的像素值或更小的 vh 值。

background: linear-gradient(180deg, rgba(200, 220, 240, 0.85) 0%, rgba(180, 200, 230, 0.75) 100%);
z-index: 8;
display: flex;
align-items: center;
justify-content: center;
pointer-events: none;
user-select: none;
}

.status-bar-content {
color: #2c3e50;
font-size: 3rem;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

font-size: 3rem 对于状态栏文本来说可能过大,通常状态栏建议使用较小的字体以保持界面简洁。建议将其调整为更合适的尺寸,例如 1.2rem1.5rem 之间。

Suggested change
font-size: 3rem;
font-size: 1.5rem;

font-weight: 500;
text-align: center;
padding: 0 20px;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
21 changes: 21 additions & 0 deletions packages/webgal/src/UI/StatusBar/StatusBar.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import { useSelector } from 'react-redux';
import { RootState } from '@/store/store';
import './StatusBar.scss';

export function StatusBar() {
const statusBarText = useSelector((state: RootState) => state.stage.statusBarText);
const showTitle = useSelector((state: RootState) => state.GUI.showTitle);
const showMenuPanel = useSelector((state: RootState) => state.GUI.showMenuPanel);
const showExtra = useSelector((state: RootState) => state.GUI.showExtra);

// 在标题、菜单、鉴赏模式时不显示状态框
if (showTitle || showMenuPanel || showExtra || !statusBarText) {
return null;
}

return (
<div className="status-bar">
<div className="status-bar-content">{statusBarText}</div>
</div>
);
}
1 change: 1 addition & 0 deletions packages/webgal/src/store/stageInterface.ts
Original file line number Diff line number Diff line change
Expand Up @@ -237,6 +237,7 @@ export interface IStageState {
isDisableTextbox: boolean;
replacedUIlable: Record<string, string>;
figureMetaData: figureMetaData;
statusBarText: string; // 顶部状态框文本
}

/**
Expand Down
1 change: 1 addition & 0 deletions packages/webgal/src/store/stageReducer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,7 @@ export const initState: IStageState = {
isDisableTextbox: false,
replacedUIlable: {},
figureMetaData: {},
statusBarText: '',
};

/**
Expand Down