From 7fa64b95d0c63b243f50b23c5551a7e04fe90c30 Mon Sep 17 00:00:00 2001 From: Jaakko Keränen Date: Sat, 6 Mar 2021 10:52:37 +0200 Subject: Mobile: Dialog styling for phones --- src/ui/color.c | 4 ++++ src/ui/inputwidget.c | 4 ++-- src/ui/util.c | 55 +++++++++++++++++++++++++++++++++++++++------------- src/ui/widget.c | 19 ++++++++++++------ src/ui/widget.h | 1 + 5 files changed, 61 insertions(+), 22 deletions(-) (limited to 'src/ui') diff --git a/src/ui/color.c b/src/ui/color.c index 02ee59d6..3c504c14 100644 --- a/src/ui/color.c +++ b/src/ui/color.c @@ -299,6 +299,10 @@ void setThemePalette_Color(enum iColorTheme theme) { 0.4f)); palette_[uiMarked_ColorId].a = 128; palette_[uiMatching_ColorId].a = 128; + if (deviceType_App() == phone_AppDeviceType) { + copy_(uiInputBackground_ColorId, uiBackgroundSidebar_ColorId); + copy_(uiInputFrame_ColorId, uiBackgroundSidebar_ColorId); + } } iColor get_Color(int color) { diff --git a/src/ui/inputwidget.c b/src/ui/inputwidget.c index 267ccdf7..3f178fc5 100644 --- a/src/ui/inputwidget.c +++ b/src/ui/inputwidget.c @@ -117,8 +117,8 @@ static void invalidateBuffered_InputWidget_(iInputWidget *d) { static void updateMetrics_InputWidget_(iInputWidget *d) { iWidget *w = as_Widget(d); /* Caller must arrange the width, but the height is fixed. */ - w->rect.size.y = lineHeight_Text(default_FontId) + 2 * gap_UI; -#if defined (iPlatformAppleMobile) + w->rect.size.y = lineHeight_Text(d->font) * 1.3f; +#if defined (iPlatformMobile) w->rect.size.y += 2 * gap_UI; #endif invalidateBuffered_InputWidget_(d); diff --git a/src/ui/util.c b/src/ui/util.c index 29ac04a3..ad72a11e 100644 --- a/src/ui/util.c +++ b/src/ui/util.c @@ -455,19 +455,22 @@ static iWidget *makeMenuSeparator_(void) { iWidget *makeMenu_Widget(iWidget *parent, const iMenuItem *items, size_t n) { iWidget *menu = new_Widget(); - setFrameColor_Widget(menu, uiSeparator_ColorId); setBackgroundColor_Widget(menu, uiBackground_ColorId); if (deviceType_App() != desktop_AppDeviceType) { setPadding1_Widget(menu, 2 * gap_UI); } + const iBool isPortraitPhone = (deviceType_App() == phone_AppDeviceType && isPortrait_App()); + int64_t itemFlags = (deviceType_App() != desktop_AppDeviceType ? 0 : 0) | + (isPortraitPhone ? extraPadding_WidgetFlag : 0); setFlags_Widget(menu, keepOnTop_WidgetFlag | collapse_WidgetFlag | hidden_WidgetFlag | arrangeVertical_WidgetFlag | arrangeSize_WidgetFlag | - resizeChildrenToWidestChild_WidgetFlag | overflowScrollable_WidgetFlag, + resizeChildrenToWidestChild_WidgetFlag | overflowScrollable_WidgetFlag | + (isPortraitPhone ? drawBackgroundToVerticalSafeArea_WidgetFlag : 0), iTrue); - const iBool isPortraitPhone = (deviceType_App() == phone_AppDeviceType && isPortrait_App()); - int64_t itemFlags = (deviceType_App() != desktop_AppDeviceType ? 0 : 0) | - (isPortraitPhone ? extraPadding_WidgetFlag : 0); + if (!isPortraitPhone) { + setFrameColor_Widget(menu, uiSeparator_ColorId); + } iBool haveIcons = iFalse; for (size_t i = 0; i < n; ++i) { const iMenuItem *item = &items[i]; @@ -478,7 +481,8 @@ iWidget *makeMenu_Widget(iWidget *parent, const iMenuItem *items, size_t n) { iLabelWidget *label = addChildFlags_Widget( menu, iClob(newKeyMods_LabelWidget(item->label, item->key, item->kmods, item->command)), - noBackground_WidgetFlag | frameless_WidgetFlag | alignLeft_WidgetFlag | drawKey_WidgetFlag | itemFlags); + noBackground_WidgetFlag | frameless_WidgetFlag | alignLeft_WidgetFlag | + drawKey_WidgetFlag | itemFlags); haveIcons |= checkIcon_LabelWidget(label); updateSize_LabelWidget(label); /* drawKey was set */ } @@ -487,7 +491,8 @@ iWidget *makeMenu_Widget(iWidget *parent, const iMenuItem *items, size_t n) { addChild_Widget(menu, iClob(makeMenuSeparator_())); addChildFlags_Widget(menu, iClob(new_LabelWidget("Cancel", "cancel")), - itemFlags | frameless_WidgetFlag | alignLeft_WidgetFlag); + itemFlags | noBackground_WidgetFlag | frameless_WidgetFlag | + alignLeft_WidgetFlag); } if (haveIcons) { /* All items must have icons if at least one of them has. */ @@ -953,7 +958,8 @@ void finalizeSheet_Widget(iWidget *sheet) { /* Toggles have the button on the right. */ if (valueLabel && cmp_String(command_LabelWidget(valueLabel), "toggle") == 0) { iWidget *div = new_Widget(); - setFrameColor_Widget(div, uiSeparator_ColorId); + setBackgroundColor_Widget(div, uiBackgroundSidebar_ColorId); +// setFrameColor_Widget(div, uiSeparator_ColorId); setPadding_Widget(div, gap_UI, gap_UI, 4 * gap_UI, gap_UI); addChildFlags_Widget(div, iClob(heading), 0); setFont_LabelWidget((iLabelWidget *) heading, defaultBig_FontId); @@ -961,7 +967,7 @@ void finalizeSheet_Widget(iWidget *sheet) { addChild_Widget(div, iClob(value)); addChildFlags_Widget(sheet, iClob(div), - arrangeHeight_WidgetFlag | + borderBottom_WidgetFlag | arrangeHeight_WidgetFlag | resizeWidthOfChildren_WidgetFlag | arrangeHorizontal_WidgetFlag); } @@ -969,27 +975,48 @@ void finalizeSheet_Widget(iWidget *sheet) { if (valueLabel && isEmpty_String(text_LabelWidget(valueLabel))) { /* Subheading padding goes above. */ addChild_Widget(sheet, iClob(value)); - addChild_Widget(sheet, iClob(heading)); + addChildFlags_Widget(sheet, iClob(heading), 0); setFont_LabelWidget(headingLabel, uiLabelBold_FontId); } else { - addChild_Widget(sheet, iClob(heading)); + addChildFlags_Widget(sheet, iClob(heading), borderBottom_WidgetFlag); if (headingLabel) { setTextColor_LabelWidget(headingLabel, uiSubheading_ColorId); setText_LabelWidget(headingLabel, collect_String(upper_String(text_LabelWidget(headingLabel)))); } - addChild_Widget(sheet, iClob(value)); + const iBool isMenuButton = findChild_Widget(value, "menu") != NULL; + if (isMenuButton) { + setFlags_Widget(value, noBackground_WidgetFlag | frameless_WidgetFlag, iTrue); + } + if (valueInput || isMenuButton) { + setFlags_Widget(value, borderBottom_WidgetFlag, iFalse); + iWidget *pad = new_Widget(); + setBackgroundColor_Widget(pad, uiBackgroundSidebar_ColorId); + setPadding_Widget(pad, 0, 1 * gap_UI, 0, 1 * gap_UI); + addChild_Widget(pad, iClob(value)); + addChildFlags_Widget(sheet, iClob(pad), borderBottom_WidgetFlag | + arrangeVertical_WidgetFlag | + resizeToParentWidth_WidgetFlag | + resizeWidthOfChildren_WidgetFlag | + arrangeHeight_WidgetFlag); + } + else { + addChild_Widget(sheet, iClob(value)); + } /* Align radio buttons to the right. */ - if (childCount_Widget(value)) { + if (childCount_Widget(value) >= 2) { + setBackgroundColor_Widget(value, uiBackgroundSidebar_ColorId); + setPadding_Widget(value, 4 * gap_UI, 2 * gap_UI, 4 * gap_UI, 2 * gap_UI); setFlags_Widget(value, + borderBottom_WidgetFlag | resizeToParentWidth_WidgetFlag | resizeWidthOfChildren_WidgetFlag, iTrue); iForEach(ObjectList, sub, children_Widget(value)) { if (isInstance_Object(sub.object, &Class_LabelWidget)) { iLabelWidget *opt = sub.object; - setFont_LabelWidget(opt, defaultBig_FontId); + setFont_LabelWidget(opt, defaultMedium_FontId); } } } diff --git a/src/ui/widget.c b/src/ui/widget.c index bb5431eb..c54ea444 100644 --- a/src/ui/widget.c +++ b/src/ui/widget.c @@ -680,12 +680,6 @@ void drawBackground_Widget(const iWidget *d) { if (d->flags & (hidden_WidgetFlag | noBackground_WidgetFlag)) { return; } - if (d->flags & borderTop_WidgetFlag) { - const iRect rect = bounds_Widget(d); - iPaint p; - init_Paint(&p); - drawHLine_Paint(&p, topLeft_Rect(rect), width_Rect(rect), uiBackgroundFramelessHover_ColorId); - } /* Popup menus have a shadowed border. */ const iBool shadowBorder = (d->flags & keepOnTop_WidgetFlag && ~d->flags & mouseModal_WidgetFlag) != 0; @@ -757,6 +751,19 @@ void drawBackground_Widget(const iWidget *d) { drawRectThickness_Paint(&p, rect, gap_UI / 4, d->frameColor); } } + if (d->flags & (borderTop_WidgetFlag | borderBottom_WidgetFlag)) { + const iRect rect = bounds_Widget(d); + iPaint p; + init_Paint(&p); + if (d->flags & borderTop_WidgetFlag) { + drawHLine_Paint(&p, topLeft_Rect(rect), width_Rect(rect), + uiBackgroundFramelessHover_ColorId); + } + if (d->flags & borderBottom_WidgetFlag) { + drawHLine_Paint(&p, addY_I2(bottomLeft_Rect(rect), -1), width_Rect(rect), + uiBackgroundFramelessHover_ColorId); + } + } } iLocalDef iBool isDrawn_Widget_(const iWidget *d) { diff --git a/src/ui/widget.h b/src/ui/widget.h index 48070158..b1ee8c73 100644 --- a/src/ui/widget.h +++ b/src/ui/widget.h @@ -102,6 +102,7 @@ enum iWidgetFlag { #define noTopFrame_WidgetFlag iBit64(47) #define unpadded_WidgetFlag iBit64(48) /* ignore parent's padding */ #define extraPadding_WidgetFlag iBit64(49) +#define borderBottom_WidgetFlag iBit64(50) enum iWidgetAddPos { back_WidgetAddPos, -- cgit v1.2.3