copilot/infinipaint
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions 1

Color picker element size corrected

Browse source
This commit is contained in:
Yousef Khadadeh 2026-05-03 11:36:32 +03:00
parent b5d4c38024
commit b465f73e09
4 changed files with 66 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/GUIStuff/ElementHelpers/ColorPickerItemsHelpers.hpp
View file

@ -18,7 +18,14 @@ template <typename T> void color_picker_items(GUIManager& gui, const char* id, T
if(oE) oE();
gui.set_to_layout();
};
gui.element<ColorPicker<T>>("c", val, options.hasAlpha, ColorPickerData{ .onChange = fullOnEdit, .onHold = options.onSelect, .onRelease = options.onDeselect });
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0)}
},
.aspectRatio = {1.0f}
}) {
gui.element<ColorPicker<T>>("c", val, options.hasAlpha, ColorPickerData{ .onChange = fullOnEdit, .onHold = options.onSelect, .onRelease = options.onDeselect });
}
left_to_right_line_layout(gui, [&]() {
text_label(gui, "R");
input_color_component_255(gui, "r", &(*val)[0], { .onEdit = fullOnEdit, .onSelect = options.onSelect, .onDeselect = options.onDeselect });

4
src/GUIStuff/Elements/ColorPicker.impl.hpp
View file

@ -49,7 +49,7 @@ template <typename T> void ColorPicker<T>::layout(const Clay_ElementId& id, T* d
});
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_FIT(BAR_WIDTH), .height = CLAY_SIZING_GROW(0)}
.sizing = {.width = CLAY_SIZING_GROW(0, BAR_WIDTH), .height = CLAY_SIZING_GROW(0)}
},
}) {
gui.element<HueVerticalSlider>("hue slider", HueVerticalSliderData{
@ -62,7 +62,7 @@ template <typename T> void ColorPicker<T>::layout(const Clay_ElementId& id, T* d
}
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(BAR_WIDTH)}
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0, BAR_WIDTH)}
},
}) {
gui.element<AlphaSlider>("alpha slider", AlphaSliderData{

95
src/Screens/PhoneDrawingProgramScreen.cpp
View file

@ -108,24 +108,29 @@ void PhoneDrawingProgramScreen::bottom_toolbar() {
.layoutDirection = CLAY_LEFT_TO_RIGHT
}
}) {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
}
}) {}
switch(settingsMenuPopup) {
case SettingsMenuPopup::NONE:
reset_color_picker_popup_data();
break;
case SettingsMenuPopup::SETTINGS:
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
}
}) {}
reset_color_picker_popup_data();
tool_settings_popup();
break;
case SettingsMenuPopup::FG_COLOR:
color_settings_popup(&main.toolConfig.globalConf.foregroundColor);
break;
case SettingsMenuPopup::BG_COLOR:
color_settings_popup(&main.toolConfig.globalConf.backgroundColor);
if(!colorPickerPopupData.extraSettingsOpen) {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0) },
}
}) {}
}
color_settings_popup(settingsMenuPopup == SettingsMenuPopup::FG_COLOR ? &main.toolConfig.globalConf.foregroundColor : &main.toolConfig.globalConf.backgroundColor);
break;
}
}
@ -249,12 +254,13 @@ void PhoneDrawingProgramScreen::color_settings_popup(Vector4f* color) {
auto& gui = main.g.gui;
auto& palette = main.conf.palettes[colorPickerPopupData.selectedPalette];
bool extraColorButtons = colorPickerPopupData.extraSettingsOpen && colorPickerPopupData.selectedPalette != 0;
auto paletteColorPickerGrid = [&] {
gui.element<GridScrollArea>("color selector grid", GridScrollArea::Options{
.entryWidth = BIG_BUTTON_SIZE,
.childAlignmentX = CLAY_ALIGN_X_CENTER,
.entryHeight = BIG_BUTTON_SIZE,
.entryCount = palette.colors.size() + 1,
.entryCount = palette.colors.size() + (extraColorButtons ? 3 : 1),
.scrollbar = ScrollArea::ScrollbarType::NORMAL,
.elementContent = [&](size_t i) {
if(i < palette.colors.size()) {
@ -271,13 +277,43 @@ void PhoneDrawingProgramScreen::color_settings_popup(Vector4f* color) {
});
}
else {
svg_icon_button(gui, "extra color settings", "data/icons/RemixIcon/more-fill.svg", {
.drawType = SelectableButton::DrawType::TRANSPARENT_ALL,
.isSelected = colorPickerPopupData.extraSettingsOpen,
.onClick = [&] {
colorPickerPopupData.extraSettingsOpen = !colorPickerPopupData.extraSettingsOpen;
if(extraColorButtons) {
switch(i - palette.colors.size()) {
case 0:
svg_icon_button(gui, "addcolor", "data/icons/plus.svg", {
.onClick = [&, color] {
std::erase(palette.colors, Vector3f{color->x(), color->y(), color->z()});
palette.colors.emplace_back(color->x(), color->y(), color->z());
}
});
break;
case 1:
svg_icon_button(gui, "deletecolor", "data/icons/close.svg", {
.onClick = [&, color] {
std::erase(palette.colors, Vector3f{color->x(), color->y(), color->z()});
}
});
break;
case 2:
svg_icon_button(gui, "extra color settings", "data/icons/RemixIcon/more-fill.svg", {
.drawType = SelectableButton::DrawType::TRANSPARENT_ALL,
.isSelected = colorPickerPopupData.extraSettingsOpen,
.onClick = [&] {
colorPickerPopupData.extraSettingsOpen = !colorPickerPopupData.extraSettingsOpen;
}
});
break;
}
});
}
else {
svg_icon_button(gui, "extra color settings", "data/icons/RemixIcon/more-fill.svg", {
.drawType = SelectableButton::DrawType::TRANSPARENT_ALL,
.isSelected = colorPickerPopupData.extraSettingsOpen,
.onClick = [&] {
colorPickerPopupData.extraSettingsOpen = !colorPickerPopupData.extraSettingsOpen;
}
});
}
}
}
});
@ -286,10 +322,11 @@ void PhoneDrawingProgramScreen::color_settings_popup(Vector4f* color) {
auto paletteColorPickerExtras = [&] {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_FIT(200), .height = CLAY_SIZING_FIT(200)},
.sizing = {.width = CLAY_SIZING_FIT(200), .height = CLAY_SIZING_GROW(0)},
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_CENTER},
.layoutDirection = CLAY_LEFT_TO_RIGHT
}
},
.aspectRatio = {1.0f}
}) {
gui.element<ColorPicker<Vector4f>>("color picker element", color, true);
}
@ -331,28 +368,6 @@ void PhoneDrawingProgramScreen::color_settings_popup(Vector4f* color) {
}
});
}
if(colorPickerPopupData.selectedPalette != 0) {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0)},
.childGap = gui.io.theme->childGap1,
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_CENTER},
.layoutDirection = CLAY_LEFT_TO_RIGHT
}
}) {
svg_icon_button(gui, "addcolor", "data/icons/plus.svg", {
.onClick = [&, color] {
std::erase(palette.colors, Vector3f{color->x(), color->y(), color->z()});
palette.colors.emplace_back(color->x(), color->y(), color->z());
}
});
svg_icon_button(gui, "deletecolor", "data/icons/close.svg", {
.onClick = [&, color] {
std::erase(palette.colors, Vector3f{color->x(), color->y(), color->z()});
}
});
}
}
};
gui.element<LayoutElement>("color settings popup", [&] (LayoutElement* l, const Clay_ElementId& lId) {
@ -369,7 +384,7 @@ void PhoneDrawingProgramScreen::color_settings_popup(Vector4f* color) {
if(colorPickerPopupData.extraSettingsOpen) {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIT(0)},
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0)},
.childGap = gui.io.theme->childGap1,
.layoutDirection = CLAY_TOP_TO_BOTTOM
},

2
src/Toolbar.cpp
View file

@ -1196,7 +1196,7 @@ void Toolbar::color_picker_window(const char* id, Vector4f** color, GUIStuff::El
.sizing = {.width = CLAY_SIZING_FIT(300), .height = CLAY_SIZING_FIT(0)},
.padding = CLAY_PADDING_ALL(gui.io.theme->padding1),
.childGap = gui.io.theme->childGap1,
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_TOP},
.childAlignment = { .x = CLAY_ALIGN_X_LEFT, .y = CLAY_ALIGN_Y_TOP},
.layoutDirection = CLAY_TOP_TO_BOTTOM
},
.backgroundColor = convert_vec4<Clay_Color>(gui.io.theme->backColor1),