2023 年 2 月 18 日

最終效果：

之前雖然已經(jīng)做好了 Level UI，但確實很簡陋，作者比我想的還早（看來也是對視覺效果有追求的），直接就說要優(yōu)化下樣式。

在 Theme 中新增 Button 樣式，添加 Normal 狀態(tài)的材質(zhì)樣式，用點九切圖的方式添加一個按鈕的切圖。

接著是一波設(shè)置：

• 按鈕常態(tài)、Hover 態(tài)、按下態(tài)的 texture 樣式、文字樣式，Hover 態(tài)用黃色的按鈕背景，按下態(tài)復制棕色背景并且唯一化，然后改變明度變成一半，文字也加深。

• 添加 PanelContainer，給文字添加背景。這個和我之前想的不一樣，我就會直接放一個 Panel 在后面然后設(shè)置成半透黑，而他是用這個 PanelContainer 容器的 Theme 樣式來直接改變通用效果，并且把其他的 UI 控件都包裹進去。

想要調(diào)整外層的間距，則是如上圖在 MarginContainer 的 Theme Overrides/Constants 中設(shè)置 Margin 即可。

今天學會了一招，所有樣式都可以在 theme 這里新增，比如今天就新增了 Button、PanelContainer 的樣式，之前 Font 的樣式也是在這里設(shè)置的。

右側(cè)點擊 + 添加類型，然后點全部覆蓋，把需要設(shè)置的屬性都放到 theme 的 Inspector 里面來修改。

設(shè)置完后，可以在預覽窗口中看效果。

最后，作者還做了一點小優(yōu)化，把字體上面的空隙給去掉了，是在 font 資源的 Extra Spacing 這里設(shè)置。