Slight readability improvements to GUI
This commit is contained in:
parent
49d72e384c
commit
30f7856815
8 changed files with 37 additions and 19 deletions
|
|
@ -192,7 +192,7 @@ void DrawingProgram::toolbar_gui() {
|
|||
.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIT(0)},
|
||||
.padding = CLAY_PADDING_ALL(t.io->theme->padding1),
|
||||
.childGap = t.io->theme->childGap1,
|
||||
.childGap = static_cast<uint16_t>(t.io->theme->childGap1 / 2),
|
||||
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_TOP},
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM
|
||||
},
|
||||
|
|
|
|||
|
|
@ -26,8 +26,8 @@ namespace GUIStuff {
|
|||
theme->fillColor2 = {0.31f, 0.31f, 0.48f, 1.0f};
|
||||
theme->backColor1 = {0.156f, 0.156f, 0.18f, 1.0f};
|
||||
theme->backColor2 = {0.24f, 0.24f, 0.29f, 1.0f};
|
||||
theme->frontColor1 = {0.9f, 0.9f, 0.9f, 1.0f};
|
||||
theme->frontColor2 = {0.8f, 0.8f, 0.8f, 1.0f};
|
||||
theme->frontColor1 = {0.87f, 0.87f, 0.87f, 1.0f};
|
||||
theme->frontColor2 = {0.64f, 0.64f, 0.64f, 1.0f};
|
||||
return theme;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ struct Theme {
|
|||
SkColor4f warningColor = {1.0f, 1.0f, 0.0f, 1.0f};
|
||||
|
||||
float hoverExpandTime = 0.1f;
|
||||
uint16_t childGap1 = 8;
|
||||
uint16_t childGap1 = 10;
|
||||
uint16_t padding1 = 8;
|
||||
float windowCorners1 = 8;
|
||||
uint16_t windowBorders1 = 0;
|
||||
|
|
@ -108,7 +108,7 @@ struct UpdateInputData {
|
|||
|
||||
SkFont get_font(float fSize) const;
|
||||
|
||||
uint16_t fontSize = 14;
|
||||
uint16_t fontSize = 16;
|
||||
sk_sp<SkTypeface> textTypeface;
|
||||
|
||||
sk_sp<skia::textlayout::FontCollection> fontCollection;
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ void MovableTabList::update(UpdateInputData& io, const std::vector<std::pair<std
|
|||
CLAY({.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0)},
|
||||
.padding = CLAY_PADDING_ALL(0),
|
||||
.childGap = 0,
|
||||
.childGap = 4,
|
||||
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_CENTER },
|
||||
.layoutDirection = CLAY_LEFT_TO_RIGHT
|
||||
}
|
||||
|
|
|
|||
|
|
@ -115,6 +115,7 @@ void GUIManager::draw(SkCanvas* canvas) {
|
|||
skia::textlayout::TextStyle tStyle;
|
||||
tStyle.setFontSize(config->fontSize);
|
||||
tStyle.setFontFamilies({SkString{"Roboto"}});
|
||||
tStyle.setColor(convert_vec4<SkColor4f>(config->textColor).toSkColor());
|
||||
pStyle.setTextStyle(tStyle);
|
||||
|
||||
skia::textlayout::ParagraphBuilderImpl a(pStyle, io->fontCollection, SkUnicodes::ICU::Make());
|
||||
|
|
@ -272,6 +273,10 @@ void GUIManager::text_label_color(const std::string& val, const SkColor4f& color
|
|||
CLAY_TEXT(strArena.std_str_to_clay_str(val), CLAY_TEXT_CONFIG({.textColor = convert_vec4<Clay_Color>(color), .fontSize = io->fontSize }));
|
||||
}
|
||||
|
||||
void GUIManager::text_label_light(const std::string& val) {
|
||||
CLAY_TEXT(strArena.std_str_to_clay_str(val), CLAY_TEXT_CONFIG({.textColor = convert_vec4<Clay_Color>(io->theme->frontColor2), .fontSize = io->fontSize }));
|
||||
}
|
||||
|
||||
void GUIManager::text_label(const std::string& val) {
|
||||
CLAY_TEXT(strArena.std_str_to_clay_str(val), CLAY_TEXT_CONFIG({.textColor = convert_vec4<Clay_Color>(io->theme->frontColor1), .fontSize = io->fontSize }));
|
||||
}
|
||||
|
|
@ -287,6 +292,17 @@ void GUIManager::text_label_centered(const std::string& val) {
|
|||
}
|
||||
}
|
||||
|
||||
void GUIManager::text_label_light_centered(const std::string& val) {
|
||||
CLAY({
|
||||
.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
|
||||
.childAlignment = {.x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_CENTER},
|
||||
}
|
||||
}) {
|
||||
CLAY_TEXT(strArena.std_str_to_clay_str(val), CLAY_TEXT_CONFIG({.textColor = convert_vec4<Clay_Color>(io->theme->frontColor2), .fontSize = io->fontSize }));
|
||||
}
|
||||
}
|
||||
|
||||
bool GUIManager::radio_button(const std::string& id, bool val, const std::function<void()>& elemUpdate) {
|
||||
push_id(id);
|
||||
RadioButton* e = insert_element<RadioButton>();
|
||||
|
|
|
|||
|
|
@ -52,7 +52,9 @@ class GUIManager {
|
|||
void text_paragraph(const std::string& id, std::unique_ptr<skia::textlayout::Paragraph> paragraph, float width, const std::function<void()>& elemUpdate = nullptr);
|
||||
void text_label_color(const std::string& val, const SkColor4f& color);
|
||||
void text_label_size(const std::string& val, float modifier);
|
||||
void text_label_light(const std::string& val);
|
||||
void text_label(const std::string& val);
|
||||
void text_label_light_centered(const std::string& val);
|
||||
void text_label_centered(const std::string& val);
|
||||
bool text_button_left_transparent(const std::string& id, const std::string& text, bool isSelected = false, const std::function<void()>& elemUpdate = nullptr);
|
||||
bool text_button(const std::string& id, const std::string& text, bool isSelected = false, const std::function<void()>& elemUpdate = nullptr);
|
||||
|
|
|
|||
|
|
@ -463,7 +463,7 @@ void RichTextBox::rebuild() {
|
|||
pData.pStyle.setTextAlign(skia::textlayout::TextAlign::kLeft);
|
||||
pData.pStyle.setTextDirection(skia::textlayout::TextDirection::kLtr);
|
||||
skia::textlayout::TextStyle tStyle;
|
||||
tStyle.setFontSize(14.0f);
|
||||
tStyle.setFontSize(16.0f);
|
||||
tStyle.setFontFamilies({SkString{"Roboto"}});
|
||||
pData.pStyle.setTextStyle(tStyle);
|
||||
|
||||
|
|
|
|||
|
|
@ -405,7 +405,7 @@ void Toolbar::top_toolbar() {
|
|||
.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
|
||||
.padding = CLAY_PADDING_ALL(io->theme->padding1),
|
||||
.childGap = io->theme->childGap1,
|
||||
.childGap = static_cast<uint16_t>(io->theme->childGap1 / 2),
|
||||
.childAlignment = { .x = CLAY_ALIGN_X_LEFT, .y = CLAY_ALIGN_Y_CENTER},
|
||||
.layoutDirection = CLAY_LEFT_TO_RIGHT
|
||||
},
|
||||
|
|
@ -428,7 +428,7 @@ void Toolbar::top_toolbar() {
|
|||
tabNames.emplace_back(main.worlds[i]->network_being_used() ? "data/icons/network.svg" : "", main.worlds[i]->name);
|
||||
std::optional<size_t> closedTab;
|
||||
gui.tab_list("file tab list", tabNames, main.worldIndex, closedTab);
|
||||
if(main.world->network_being_used() && gui.svg_icon_button("Player List Toggle Button", "data/icons/list.svg", playerMenuOpen))
|
||||
if(main.world->network_being_used() && gui.svg_icon_button_transparent("Player List Toggle Button", "data/icons/list.svg", playerMenuOpen))
|
||||
playerMenuOpen = !playerMenuOpen;
|
||||
if(gui.svg_icon_button_transparent("Menu Undo Button", "data/icons/undo.svg"))
|
||||
main.world->undo_with_checks();
|
||||
|
|
@ -1407,7 +1407,7 @@ void Toolbar::options_menu() {
|
|||
gui.push_id("general settings");
|
||||
gui.input_text_field("display name input", "Display Name", &main.displayName);
|
||||
main.update_display_names();
|
||||
gui.text_label("Note: Changes in display name dont affect canvases that are connected online");
|
||||
gui.text_label_light("Note: Changes in display name dont affect canvases that are connected online");
|
||||
SkColor4f newBackColor{main.defaultCanvasBackgroundColor.x(), main.defaultCanvasBackgroundColor.y(), main.defaultCanvasBackgroundColor.z(), 1.0f};
|
||||
gui.color_picker_button_field("defaultCanvasBackgroundColor", "Default canvas background color", &newBackColor, false);
|
||||
main.defaultCanvasBackgroundColor = convert_vec3<Vector3f>(newBackColor);
|
||||
|
|
@ -1492,7 +1492,7 @@ void Toolbar::options_menu() {
|
|||
});
|
||||
}
|
||||
gui.text_label("Edit theme:");
|
||||
gui.text_label("Note: Changes only remain if theme is saved");
|
||||
gui.text_label_light("Note: Changes only remain if theme is saved");
|
||||
gui.color_picker_button_field("fillColor1", "Fill Color 1", &io->theme->fillColor1, true);
|
||||
gui.color_picker_button_field("fillColor2", "Fill Color 2", &io->theme->fillColor2, true);
|
||||
gui.color_picker_button_field("backColor1", "Back Color 1", &io->theme->backColor1, true);
|
||||
|
|
@ -1533,7 +1533,7 @@ void Toolbar::options_menu() {
|
|||
CLAY({
|
||||
.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
|
||||
.padding = CLAY_PADDING_ALL(4),
|
||||
.padding = CLAY_PADDING_ALL(0),
|
||||
.childGap = io->theme->childGap1,
|
||||
.childAlignment = { .x = CLAY_ALIGN_X_LEFT, .y = CLAY_ALIGN_Y_CENTER},
|
||||
.layoutDirection = CLAY_LEFT_TO_RIGHT
|
||||
|
|
@ -1695,7 +1695,7 @@ void Toolbar::about_menu_gui() {
|
|||
.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_FIT(200), .height = CLAY_SIZING_FIT(0) },
|
||||
.padding = CLAY_PADDING_ALL(io->theme->padding1),
|
||||
.childGap = io->theme->childGap1,
|
||||
.childGap = 1,
|
||||
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_TOP},
|
||||
.layoutDirection = CLAY_TOP_TO_BOTTOM
|
||||
}
|
||||
|
|
@ -1704,19 +1704,19 @@ void Toolbar::about_menu_gui() {
|
|||
CLAY({
|
||||
.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
|
||||
.padding = CLAY_PADDING_ALL(io->theme->padding1),
|
||||
.childGap = io->theme->childGap1,
|
||||
.padding = CLAY_PADDING_ALL(0),
|
||||
.childGap = 1,
|
||||
}
|
||||
}) {
|
||||
if(gui.text_button_left_transparent("infinipaintnoticebutton", "InfiniPaint", selectedLicense == -1)) selectedLicense = -1;
|
||||
}
|
||||
gui.text_label_centered("Third Party Libraries");
|
||||
gui.text_label_light_centered("Third Party Libraries");
|
||||
for(int i = 0; i < static_cast<int>(thirdPartyLicenses.size()); i++) {
|
||||
CLAY({
|
||||
.layout = {
|
||||
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
|
||||
.padding = CLAY_PADDING_ALL(io->theme->padding1),
|
||||
.childGap = io->theme->childGap1,
|
||||
.padding = CLAY_PADDING_ALL(0),
|
||||
.childGap = 1,
|
||||
}
|
||||
}) {
|
||||
gui.push_id(i);
|
||||
|
|
@ -1956,7 +1956,7 @@ float Toolbar::final_gui_scale() {
|
|||
}
|
||||
|
||||
void Toolbar::calculate_final_gui_scale() {
|
||||
Vector2f maxWindowSizeBeforeForcedFit = final_gui_scale_not_fit() * Vector2f{800.0f, 880.0f};
|
||||
Vector2f maxWindowSizeBeforeForcedFit = final_gui_scale_not_fit() * Vector2f{700.0f, 700.0f};
|
||||
Vector2f fitRatio = {main.window.size.x() / maxWindowSizeBeforeForcedFit.x(), main.window.size.y() / maxWindowSizeBeforeForcedFit.y()};
|
||||
finalCalculatedGuiScale = final_gui_scale_not_fit() * std::min(std::min(fitRatio.x(), fitRatio.y()), 1.0f);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue