diff --git a/Applications/ProcessManager/main.cpp b/Applications/ProcessManager/main.cpp index 62f31ff3ae..f7159cf4d3 100644 --- a/Applications/ProcessManager/main.cpp +++ b/Applications/ProcessManager/main.cpp @@ -24,9 +24,14 @@ int main(int argc, char** argv) tabwidget->add_widget("Processes", widget); auto* placeholder_label = new GLabel("Placeholder text"); placeholder_label->set_fill_with_background_color(true); - placeholder_label->set_background_color(Color::from_rgb(0xffc0c0)); + placeholder_label->set_background_color(Color::LightGray); tabwidget->add_widget("Placeholder", placeholder_label); + auto* placeholder2_label = new GLabel("Placeholder2 text"); + placeholder2_label->set_fill_with_background_color(true); + placeholder2_label->set_background_color(Color::LightGray); + tabwidget->add_widget("Another", placeholder2_label); + widget->set_layout(make(Orientation::Vertical)); auto* toolbar = new GToolBar(widget); diff --git a/LibGUI/GTabWidget.cpp b/LibGUI/GTabWidget.cpp index 0803604d06..c1f7c3e252 100644 --- a/LibGUI/GTabWidget.cpp +++ b/LibGUI/GTabWidget.cpp @@ -81,21 +81,40 @@ void GTabWidget::paint_event(GPaintEvent& event) GPainter painter(*this); painter.add_clip_rect(event.rect()); - painter.fill_rect(bar_rect(), Color::MidGray); + painter.fill_rect(bar_rect(), Color::LightGray); for (int i = 0; i < m_tabs.size(); ++i) { + if (m_tabs[i].widget == m_active_widget) + continue; auto button_rect = this->button_rect(i); - StylePainter::paint_button(painter, button_rect, ButtonStyle::Normal, m_tabs[i].widget == m_active_widget); + StylePainter::paint_tab_button(painter, button_rect, false, m_tabs[i].hovered, m_tabs[i].widget->is_enabled()); painter.draw_text(button_rect, m_tabs[i].title, TextAlignment::Center); } + + for (int i = 0; i < m_tabs.size(); ++i) { + if (m_tabs[i].widget != m_active_widget) + continue; + auto button_rect = this->button_rect(i); + StylePainter::paint_tab_button(painter, button_rect, true, m_tabs[i].hovered, m_tabs[i].widget->is_enabled()); + painter.draw_text(button_rect, m_tabs[i].title, TextAlignment::Center); + break; + } } Rect GTabWidget::button_rect(int index) const { - int x_offset = 0; + int x_offset = 2; for (int i = 0; i < index; ++i) x_offset += m_tabs[i].width(font()); - return { x_offset, 0, m_tabs[index].width(font()), bar_height() }; + Rect rect { x_offset, 0, m_tabs[index].width(font()), bar_height() }; + if (m_tabs[index].widget != m_active_widget) { + rect.move_by(0, 2); + rect.set_height(rect.height() - 2); + } else { + rect.move_by(-2, 0); + rect.set_width(rect.width() + 4); + } + return rect; } int GTabWidget::TabData::width(const Font& font) const diff --git a/LibGUI/GTabWidget.h b/LibGUI/GTabWidget.h index 09bd3fc81b..2d198b1ab3 100644 --- a/LibGUI/GTabWidget.h +++ b/LibGUI/GTabWidget.h @@ -34,6 +34,7 @@ private: int width(const Font&) const; String title; GWidget* widget { nullptr }; + bool hovered { false }; }; Vector m_tabs; }; diff --git a/SharedGraphics/StylePainter.cpp b/SharedGraphics/StylePainter.cpp index 4fbb6b852d..e12b9230ad 100644 --- a/SharedGraphics/StylePainter.cpp +++ b/SharedGraphics/StylePainter.cpp @@ -1,6 +1,41 @@ #include #include +void StylePainter::paint_tab_button(Painter& painter, const Rect& rect, bool active, bool hovered, bool enabled) +{ + Color button_color = Color::from_rgb(0xc0c0c0); + Color highlight_color2 = Color::from_rgb(0xdfdfdf); + Color shadow_color1 = Color::from_rgb(0x808080); + Color shadow_color2 = Color::from_rgb(0x404040); + ASSERT(!hovered); + + if (enabled) { + if (hovered) + button_color = Color::from_rgb(0xe3dfdb); + //else +// button_color = Color::from_rgb(0xd6d2ce); + } else if (hovered && enabled) + button_color = Color::from_rgb(0xd4d4d4); + + PainterStateSaver saver(painter); + painter.translate(rect.location()); + + // Base + painter.fill_rect({ 1, 1, rect.width() - 2, rect.height() - 1 }, button_color); + + // Top line + painter.draw_line({ 2, 0 }, { rect.width() - 3, 0 }, highlight_color2); + + // Left side + painter.draw_line({ 0, 2 }, { 0, rect.height() - 1 }, highlight_color2); + painter.set_pixel({ 1, 1 }, highlight_color2); + + // Right side + painter.draw_line({ rect.width() - 1, 2, }, { rect.width() - 1, rect.height() - 1 }, shadow_color2); + painter.draw_line({ rect.width() - 2, 2, }, { rect.width() - 2, rect.height() - 1 }, shadow_color1); + painter.set_pixel({ rect.width() - 2, 1, }, shadow_color2); +} + static void paint_button_new(Painter& painter, const Rect& rect, bool pressed, bool checked, bool hovered, bool enabled) { Color button_color = Color::from_rgb(0xc0c0c0); diff --git a/SharedGraphics/StylePainter.h b/SharedGraphics/StylePainter.h index b31ecaec74..222dde8701 100644 --- a/SharedGraphics/StylePainter.h +++ b/SharedGraphics/StylePainter.h @@ -10,6 +10,7 @@ enum class FrameShape { NoFrame, Box, Container, Panel, VerticalLine, Horizontal class StylePainter { public: static void paint_button(Painter&, const Rect&, ButtonStyle, bool pressed, bool hovered = false, bool checked = false, bool enabled = true); + static void paint_tab_button(Painter&, const Rect&, bool active, bool hovered, bool enabled); static void paint_surface(Painter&, const Rect&, bool paint_vertical_lines = true); static void paint_frame(Painter&, const Rect&, FrameShape, FrameShadow, int thickness, bool skip_vertical_lines = false); static void paint_menu_frame(Painter&, const Rect&);