Theming: Add alignment section

This commit removes the IsTitleCenter property and replaces it with
the TitleAlignment property that supports "Left", "Right" & "Center".

Base/res/themes/Basalt.ini

@@ -72,9 +72,11 @@ TooltipText=white
 Tray=#171717
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=true
-IsTitleCenter=false
 
 [Metrics]
 TitleHeight=24

Base/res/themes/Coffee.ini

@@ -68,9 +68,11 @@ TooltipText=black
 Tray=#9397a5
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Paths]
 TitleButtonIcons=/res/icons/themes/Coffee/16x16/

Base/res/themes/Cupertino.ini

@@ -69,9 +69,11 @@ TooltipText=white
 Tray=#212121
 TrayText=#fcfcfc
 
+[Alignments]
+TitleAlignment=Center
+
 [Flags]
 IsDark=true
-IsTitleCenter=true
 
 [Metrics]
 BorderRadius=8

Base/res/themes/Dark.ini

@@ -64,6 +64,8 @@ TooltipText=white
 Tray=#323232
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=true
-IsTitleCenter=false

Base/res/themes/Default.ini

@@ -72,9 +72,11 @@ TooltipText=black
 Tray=#808080
 TrayText=#ffffff
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Metrics]
 BorderThickness=4

Base/res/themes/Desert.ini

@@ -72,9 +72,11 @@ TooltipText=black
 Tray=#a28d68
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Metrics]
 TitleHeight=19

Base/res/themes/Faux Pas.ini

@@ -64,6 +64,8 @@ TooltipText=black
 Tray=#282828
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false

Base/res/themes/Light.ini

@@ -72,9 +72,11 @@ TooltipText=#4b4b4b
 Tray=#3b3b3b
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Paths]
 MenuShadow=/res/icons/themes/Redmond/menu-shadow.png

Base/res/themes/Nord.ini

@@ -64,6 +64,8 @@ TooltipText=white
 Tray=#3b4252
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=true
-IsTitleCenter=false

Base/res/themes/Plum.ini

@@ -72,9 +72,11 @@ TooltipText=black
 Tray=#808080
 TrayText=#ffffff
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Metrics]
 TitleHeight=19

Base/res/themes/Redmond 2000.ini

@@ -68,9 +68,11 @@ TooltipText=black
 Tray=#808080
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Metrics]
 TitleButtonWidth=17

Base/res/themes/Redmond.ini

@@ -68,9 +68,11 @@ TooltipText=black
 Tray=#808080
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Metrics]
 TitleButtonWidth=17

Base/res/themes/Silver.ini

@@ -64,9 +64,11 @@ TooltipText=black
 Tray=#3b3b3b
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Paths]
 TitleButtonIcons=/res/icons/themes/Silver/16x16/

Base/res/themes/Sunshine.ini

@@ -68,9 +68,11 @@ TooltipText=black
 Tray=#9397a5
 TrayText=white
 
+[Alignments]
+TitleAlignment=Left
+
 [Flags]
 IsDark=false
-IsTitleCenter=false
 
 [Paths]
 TitleButtonIcons=/res/icons/themes/Sunshine/16x16/

Userland/Libraries/LibGUI/Variant.cpp

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
+ * Copyright (c) 2022, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -48,6 +49,8 @@ const char* to_string(Variant::Type type)
         return "TextAlignment";
     case Variant::Type::ColorRole:
         return "ColorRole";
+    case Variant::Type::AlignmentRole:
+        return "AlignmentRole";
     case Variant::Type::FlagRole:
         return "FlagRole";
     case Variant::Type::MetricRole:
@@ -99,6 +102,12 @@ Variant::Variant(Gfx::ColorRole value)
     m_value.as_color_role = value;
 }
 
+Variant::Variant(Gfx::AlignmentRole value)
+    : m_type(Type::AlignmentRole)
+{
+    m_value.as_alignment_role = value;
+}
+
 Variant::Variant(Gfx::FlagRole value)
     : m_type(Type::FlagRole)
 {
@@ -355,6 +364,9 @@ void Variant::copy_from(const Variant& other)
     case Type::ColorRole:
         m_value.as_color_role = other.m_value.as_color_role;
         break;
+    case Type::AlignmentRole:
+        m_value.as_alignment_role = other.m_value.as_alignment_role;
+        break;
     case Type::FlagRole:
         m_value.as_flag_role = other.m_value.as_flag_role;
         break;
@@ -406,6 +418,8 @@ bool Variant::operator==(const Variant& other) const
         return m_value.as_text_alignment == other.m_value.as_text_alignment;
     case Type::ColorRole:
         return m_value.as_color_role == other.m_value.as_color_role;
+    case Type::AlignmentRole:
+        return m_value.as_alignment_role == other.m_value.as_alignment_role;
     case Type::FlagRole:
         return m_value.as_flag_role == other.m_value.as_flag_role;
     case Type::MetricRole:
@@ -451,6 +465,7 @@ bool Variant::operator<(const Variant& other) const
     case Type::Font:
     case Type::TextAlignment:
     case Type::ColorRole:
+    case Type::AlignmentRole:
     case Type::FlagRole:
     case Type::MetricRole:
     case Type::PathRole:
@@ -512,6 +527,8 @@ String Variant::to_string() const
     }
     case Type::ColorRole:
         return String::formatted("Gfx::ColorRole::{}", Gfx::to_string(m_value.as_color_role));
+    case Type::AlignmentRole:
+        return String::formatted("Gfx::AlignmentRole::{}", Gfx::to_string(m_value.as_alignment_role));
     case Type::FlagRole:
         return String::formatted("Gfx::FlagRole::{}", Gfx::to_string(m_value.as_flag_role));
     case Type::MetricRole:

Userland/Libraries/LibGUI/Variant.h

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
+ * Copyright (c) 2022, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -35,6 +36,7 @@ public:
     Variant(const Gfx::Font&);
     Variant(const Gfx::TextAlignment);
     Variant(const Gfx::ColorRole);
+    Variant(const Gfx::AlignmentRole);
     Variant(const Gfx::FlagRole);
     Variant(const Gfx::MetricRole);
     Variant(const Gfx::PathRole);
@@ -68,6 +70,7 @@ public:
         Font,
         TextAlignment,
         ColorRole,
+        AlignmentRole,
         FlagRole,
         MetricRole,
         PathRole,
@@ -90,6 +93,7 @@ public:
     bool is_font() const { return m_type == Type::Font; }
     bool is_text_alignment() const { return m_type == Type::TextAlignment; }
     bool is_color_role() const { return m_type == Type::ColorRole; }
+    bool is_alignment_role() const { return m_type == Type::AlignmentRole; }
     bool is_flag_role() const { return m_type == Type::FlagRole; }
     bool is_metric_role() const { return m_type == Type::MetricRole; }
     bool is_path_role() const { return m_type == Type::PathRole; }
@@ -254,6 +258,13 @@ public:
         return m_value.as_color_role;
     }
 
+    Gfx::AlignmentRole to_alignment_role() const
+    {
+        if (type() != Type::AlignmentRole)
+            return Gfx::AlignmentRole::NoRole;
+        return m_value.as_alignment_role;
+    }
+
     Gfx::FlagRole to_flag_role() const
     {
         if (type() != Type::FlagRole)
@@ -325,6 +336,7 @@ private:
         Gfx::RGBA32 as_color;
         Gfx::TextAlignment as_text_alignment;
         Gfx::ColorRole as_color_role;
+        Gfx::AlignmentRole as_alignment_role;
         Gfx::FlagRole as_flag_role;
         Gfx::MetricRole as_metric_role;
         Gfx::PathRole as_path_role;

Userland/Libraries/LibGfx/ClassicWindowTheme.cpp

@@ -1,6 +1,6 @@
 /*
  * Copyright (c) 2020, Andreas Kling <kling@serenityos.org>
- * Copyright (c) 2021, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
+ * Copyright (c) 2021-2022, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -74,16 +74,12 @@ void ClassicWindowTheme::paint_normal_frame(Painter& painter, WindowState window
 
     painter.fill_rect_with_gradient(titlebar_rect, border_color, border_color2);
 
+    auto title_alignment = palette.title_alignment();
+
     int stripe_right = leftmost_button_rect.left() - 3;
     if (stripes_color.alpha() > 0) {
-        if (palette.is_title_center()) {
+        switch (title_alignment) {
-            auto stripe_width = (leftmost_button_rect.left() / 2 - titlebar_title_rect.width() / 2) - titlebar_icon_rect.width() - 3;
+        case Gfx::TextAlignment::CenterLeft: {
-
-            for (int i = 2; i <= titlebar_inner_rect.height() - 2; i += 2) {
-                painter.draw_line({ titlebar_inner_rect.left(), titlebar_inner_rect.y() + i }, { titlebar_inner_rect.left() + stripe_width, titlebar_inner_rect.y() + i }, stripes_color);
-                painter.draw_line({ stripe_right - stripe_width, titlebar_inner_rect.y() + i }, { stripe_right, titlebar_inner_rect.y() + i }, stripes_color);
-            }
-        } else {
             int stripe_left = titlebar_title_rect.right() + 5;
 
             if (stripe_left && stripe_right && stripe_left < stripe_right) {
@@ -91,19 +87,34 @@ void ClassicWindowTheme::paint_normal_frame(Painter& painter, WindowState window
                     painter.draw_line({ stripe_left, titlebar_inner_rect.y() + i }, { stripe_right, titlebar_inner_rect.y() + i }, stripes_color);
                 }
             }
+            break;
+        }
+        case Gfx::TextAlignment::CenterRight: {
+            for (int i = 2; i <= titlebar_inner_rect.height() - 2; i += 2) {
+                painter.draw_line({ titlebar_inner_rect.left(), titlebar_inner_rect.y() + i }, { stripe_right - titlebar_title_rect.width() - 3, titlebar_inner_rect.y() + i }, stripes_color);
+            }
+            break;
+        }
+        case Gfx::TextAlignment::Center: {
+            auto stripe_width = (leftmost_button_rect.left() / 2 - titlebar_title_rect.width() / 2) - titlebar_icon_rect.width() - 3;
+
+            for (int i = 2; i <= titlebar_inner_rect.height() - 2; i += 2) {
+                painter.draw_line({ titlebar_inner_rect.left(), titlebar_inner_rect.y() + i }, { titlebar_inner_rect.left() + stripe_width, titlebar_inner_rect.y() + i }, stripes_color);
+                painter.draw_line({ stripe_right - stripe_width, titlebar_inner_rect.y() + i }, { stripe_right, titlebar_inner_rect.y() + i }, stripes_color);
+            }
+            break;
+        }
+        default:
+            dbgln("Unhandled title alignment!");
         }
     }
 
     auto clipped_title_rect = titlebar_title_rect;
     clipped_title_rect.set_width(stripe_right - clipped_title_rect.x());
     if (!clipped_title_rect.is_empty()) {
-        auto align = Gfx::TextAlignment::CenterLeft;
+        painter.draw_text(clipped_title_rect.translated(1, 2), window_title, title_font, title_alignment, shadow_color, Gfx::TextElision::Right);
-        if (palette.is_title_center())
-            align = Gfx::TextAlignment::Center;
-
-        painter.draw_text(clipped_title_rect.translated(1, 2), window_title, title_font, align, shadow_color, Gfx::TextElision::Right);
         // FIXME: The translated(0, 1) wouldn't be necessary if we could center text based on its baseline.
-        painter.draw_text(clipped_title_rect.translated(0, 1), window_title, title_font, align, title_color, Gfx::TextElision::Right);
+        painter.draw_text(clipped_title_rect.translated(0, 1), window_title, title_font, title_alignment, title_color, Gfx::TextElision::Right);
     }
 
     painter.draw_scaled_bitmap(titlebar_icon_rect, icon, icon.rect());

Userland/Libraries/LibGfx/Palette.cpp

@@ -1,6 +1,7 @@
 /*
  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
  * Copyright (c) 2021, Sam Atkins <atkinssj@serenityos.org>
+ * Copyright (c) 2022, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -57,6 +58,14 @@ void Palette::set_color(ColorRole role, Color color)
     theme.color[(int)role] = color.value();
 }
 
+void Palette::set_alignment(AlignmentRole role, Gfx::TextAlignment value)
+{
+    if (m_impl->ref_count() != 1)
+        m_impl = m_impl->clone();
+    auto& theme = const_cast<SystemTheme&>(impl().theme());
+    theme.alignment[(int)role] = value;
+}
+
 void Palette::set_flag(FlagRole role, bool value)
 {
     if (m_impl->ref_count() != 1)

Userland/Libraries/LibGfx/Palette.h

@@ -1,6 +1,7 @@
 /*
  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
  * Copyright (c) 2021, Sam Atkins <atkinssj@serenityos.org>
+ * Copyright (c) 2022, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -31,6 +32,12 @@ public:
         return Color::from_rgba(theme().color[(int)role]);
     }
 
+    Gfx::TextAlignment alignment(AlignmentRole role) const
+    {
+        VERIFY((int)role < (int)AlignmentRole::__Count);
+        return theme().alignment[(int)role];
+    }
+
     bool flag(FlagRole role) const
     {
         VERIFY((int)role < (int)FlagRole::__Count);
@@ -125,8 +132,9 @@ public:
     Color syntax_preprocessor_statement() const { return color(ColorRole::SyntaxPreprocessorStatement); }
     Color syntax_preprocessor_value() const { return color(ColorRole::SyntaxPreprocessorValue); }
 
+    Gfx::TextAlignment title_alignment() const { return alignment(AlignmentRole::TitleAlignment); }
+
     bool is_dark() const { return flag(FlagRole::IsDark); }
-    bool is_title_center() const { return flag(FlagRole::IsTitleCenter); }
 
     int window_border_thickness() const { return metric(MetricRole::BorderThickness); }
     int window_border_radius() const { return metric(MetricRole::BorderRadius); }
@@ -142,11 +150,13 @@ public:
     String tooltip_shadow_path() const { return path(PathRole::TooltipShadow); }
 
     Color color(ColorRole role) const { return m_impl->color(role); }
+    Gfx::TextAlignment alignment(AlignmentRole role) const { return m_impl->alignment(role); }
     bool flag(FlagRole role) const { return m_impl->flag(role); }
     int metric(MetricRole role) const { return m_impl->metric(role); }
     String path(PathRole role) const { return m_impl->path(role); }
 
     void set_color(ColorRole, Color);
+    void set_alignment(AlignmentRole, Gfx::TextAlignment);
     void set_flag(FlagRole, bool);
     void set_metric(MetricRole, int);
     void set_path(PathRole, String);

Userland/Libraries/LibGfx/SystemTheme.cpp

@@ -1,6 +1,7 @@
 /*
  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
  * Copyright (c) 2021, Sam Atkins <atkinssj@serenityos.org>
+ * Copyright (c) 2022, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -45,6 +46,29 @@ Core::AnonymousBuffer load_system_theme(Core::ConfigFile const& file)
         return file.read_bool_entry("Flags", name, false);
     };
 
+    auto get_alignment = [&](auto& name, auto role) {
+        auto alignment = file.read_entry("Alignments", name).to_lowercase();
+        if (alignment.is_empty()) {
+            switch (role) {
+            case (int)AlignmentRole::TitleAlignment:
+                return Gfx::TextAlignment::CenterLeft;
+            default:
+                dbgln("Alignment {} has no fallback value!", name);
+                return Gfx::TextAlignment::CenterLeft;
+            }
+        }
+
+        if (alignment == "left" || alignment == "centerleft")
+            return Gfx::TextAlignment::CenterLeft;
+        else if (alignment == "right" || alignment == "centerright")
+            return Gfx::TextAlignment::CenterRight;
+        else if (alignment == "center")
+            return Gfx::TextAlignment::Center;
+
+        dbgln("Alignment {} has an invalid value!", name);
+        return Gfx::TextAlignment::CenterLeft;
+    };
+
     auto get_metric = [&](auto& name, auto role) {
         int metric = file.read_num_entry("Metrics", name, -1);
         if (metric == -1) {
@@ -86,6 +110,12 @@ Core::AnonymousBuffer load_system_theme(Core::ConfigFile const& file)
     ENUMERATE_COLOR_ROLES(__ENUMERATE_COLOR_ROLE)
 #undef __ENUMERATE_COLOR_ROLE
 
+#undef __ENUMERATE_ALIGNMENT_ROLE
+#define __ENUMERATE_ALIGNMENT_ROLE(role) \
+    data->alignment[(int)AlignmentRole::role] = get_alignment(#role, (int)AlignmentRole::role);
+    ENUMERATE_ALIGNMENT_ROLES(__ENUMERATE_ALIGNMENT_ROLE)
+#undef __ENUMERATE_ALIGNMENT_ROLE
+
 #undef __ENUMERATE_FLAG_ROLE
 #define __ENUMERATE_FLAG_ROLE(role) \
     data->flag[(int)FlagRole::role] = get_flag(#role);

Userland/Libraries/LibGfx/SystemTheme.h

@@ -1,6 +1,7 @@
 /*
  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org>
  * Copyright (c) 2021, Sam Atkins <atkinssj@serenityos.org>
+ * Copyright (c) 2022, Filiph Sandström <filiph.sandstrom@filfatstudios.com>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -13,6 +14,7 @@
 #include <LibCore/AnonymousBuffer.h>
 #include <LibCore/ConfigFile.h>
 #include <LibGfx/Color.h>
+#include <LibGfx/TextAlignment.h>
 
 namespace Gfx {
 
@@ -90,9 +92,11 @@ namespace Gfx {
     C(Window)                      \
     C(WindowText)
 
+#define ENUMERATE_ALIGNMENT_ROLES(C) \
+    C(TitleAlignment)
+
 #define ENUMERATE_FLAG_ROLES(C) \
-    C(IsDark)                   \
+    C(IsDark)
-    C(IsTitleCenter)
 
 #define ENUMERATE_METRIC_ROLES(C) \
     C(BorderThickness)            \
@@ -139,6 +143,33 @@ inline const char* to_string(ColorRole role)
     }
 }
 
+enum class AlignmentRole {
+    NoRole,
+
+#undef __ENUMERATE_ALIGNMENT_ROLE
+#define __ENUMERATE_ALIGNMENT_ROLE(role) role,
+    ENUMERATE_ALIGNMENT_ROLES(__ENUMERATE_ALIGNMENT_ROLE)
+#undef __ENUMERATE_ALIGNMENT_ROLE
+
+        __Count,
+};
+
+inline const char* to_string(AlignmentRole role)
+{
+    switch (role) {
+    case AlignmentRole::NoRole:
+        return "NoRole";
+#undef __ENUMERATE_ALIGNMENT_ROLE
+#define __ENUMERATE_ALIGNMENT_ROLE(role) \
+    case AlignmentRole::role:            \
+        return #role;
+        ENUMERATE_ALIGNMENT_ROLES(__ENUMERATE_ALIGNMENT_ROLE)
+#undef __ENUMERATE_ALIGNMENT_ROLE
+    default:
+        VERIFY_NOT_REACHED();
+    }
+}
+
 enum class FlagRole {
     NoRole,
 
@@ -222,6 +253,7 @@ inline const char* to_string(PathRole role)
 
 struct SystemTheme {
     RGBA32 color[(int)ColorRole::__Count];
+    Gfx::TextAlignment alignment[(int)AlignmentRole::__Count];
     bool flag[(int)FlagRole::__Count];
     int metric[(int)MetricRole::__Count];
     char path[(int)PathRole::__Count][256]; // TODO: PATH_MAX?