RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 03:47:34 +00:00
Code Issues Activity Actions

GTabWidget: Paint a frame around the container part of the widget.

Browse source 
Then make the active tab stand out by punching a hole in the frame below
its button.
This commit is contained in:
Andreas Kling 2019-05-05 15:03:34 +02:00
parent 4e1b36ddf2
commit 9e5ad25188
3 changed files with 19 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

16
LibGUI/GTabWidget.cpp
View file

@ -31,7 +31,9 @@ void GTabWidget::set_active_widget(GWidget* widget)
m_active_widget->set_visible(true);
}
update(bar_rect());
auto invalidation_rect = bar_rect();
invalidation_rect.set_height(invalidation_rect.height() + 1);
update(invalidation_rect);
}
void GTabWidget::resize_event(GResizeEvent& event)
@ -43,7 +45,7 @@ void GTabWidget::resize_event(GResizeEvent& event)
Rect GTabWidget::child_rect_for_size(const Size& size) const
{
return { { 0, bar_height() }, { size.width(), size.height() - bar_height() } };
return { { container_padding(), bar_height() + container_padding() }, { size.width() - container_padding() * 2, size.height() - bar_height() - container_padding() * 2 } };
}
void GTabWidget::child_event(CChildEvent& event)
@ -83,6 +85,15 @@ void GTabWidget::paint_event(GPaintEvent& event)
painter.fill_rect(bar_rect(), Color::LightGray);
Rect container_rect { 0, bar_height(), width(), height() - bar_height() };
auto padding_rect = container_rect;
for (int i = 0; i < container_padding(); ++i) {
painter.draw_rect(padding_rect, background_color());
padding_rect.shrink(2, 2);
}
StylePainter::paint_frame(painter, container_rect, FrameShape::Panel, FrameShadow::Raised, 2);
for (int i = 0; i < m_tabs.size(); ++i) {
if (m_tabs[i].widget == m_active_widget)
continue;
@ -97,6 +108,7 @@ void GTabWidget::paint_event(GPaintEvent& event)
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);
painter.draw_line(button_rect.bottom_left().translated(1, 1), button_rect.bottom_right().translated(-1, 1), background_color());
break;
}
}

1
LibGUI/GTabWidget.h
View file

@ -11,6 +11,7 @@ public:
void set_active_widget(GWidget*);
int bar_height() const { return 22; }
int container_padding() const { return 2; }
void add_widget(const String&, GWidget*);

8
SharedGraphics/StylePainter.cpp
View file

@ -3,7 +3,7 @@
void StylePainter::paint_tab_button(Painter& painter, const Rect& rect, bool active, bool hovered, bool enabled)
{
Color button_color = Color::from_rgb(0xc0c0c0);
Color base_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);
@ -11,17 +11,17 @@ void StylePainter::paint_tab_button(Painter& painter, const Rect& rect, bool act
if (enabled) {
if (hovered)
button_color = Color::from_rgb(0xe3dfdb);
base_color = Color::from_rgb(0xe3dfdb);
//else
// button_color = Color::from_rgb(0xd6d2ce);
} else if (hovered && enabled)
button_color = Color::from_rgb(0xd4d4d4);
base_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);
painter.fill_rect({ 1, 1, rect.width() - 2, rect.height() - 1 }, base_color);
// Top line
painter.draw_line({ 2, 0 }, { rect.width() - 3, 0 }, highlight_color2);