mirror of
https://github.com/RGBCube/serenity
synced 2025-07-26 03:37:43 +00:00
GTabWidget: Paint a frame around the container part of the widget.
Then make the active tab stand out by punching a hole in the frame below its button.
This commit is contained in:
parent
4e1b36ddf2
commit
9e5ad25188
3 changed files with 19 additions and 6 deletions
|
@ -31,7 +31,9 @@ void GTabWidget::set_active_widget(GWidget* widget)
|
||||||
m_active_widget->set_visible(true);
|
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)
|
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
|
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)
|
void GTabWidget::child_event(CChildEvent& event)
|
||||||
|
@ -83,6 +85,15 @@ void GTabWidget::paint_event(GPaintEvent& event)
|
||||||
|
|
||||||
painter.fill_rect(bar_rect(), Color::LightGray);
|
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) {
|
for (int i = 0; i < m_tabs.size(); ++i) {
|
||||||
if (m_tabs[i].widget == m_active_widget)
|
if (m_tabs[i].widget == m_active_widget)
|
||||||
continue;
|
continue;
|
||||||
|
@ -97,6 +108,7 @@ void GTabWidget::paint_event(GPaintEvent& event)
|
||||||
auto button_rect = this->button_rect(i);
|
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());
|
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_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;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -11,6 +11,7 @@ public:
|
||||||
void set_active_widget(GWidget*);
|
void set_active_widget(GWidget*);
|
||||||
|
|
||||||
int bar_height() const { return 22; }
|
int bar_height() const { return 22; }
|
||||||
|
int container_padding() const { return 2; }
|
||||||
|
|
||||||
void add_widget(const String&, GWidget*);
|
void add_widget(const String&, GWidget*);
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
|
|
||||||
void StylePainter::paint_tab_button(Painter& painter, const Rect& rect, bool active, bool hovered, bool enabled)
|
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 highlight_color2 = Color::from_rgb(0xdfdfdf);
|
||||||
Color shadow_color1 = Color::from_rgb(0x808080);
|
Color shadow_color1 = Color::from_rgb(0x808080);
|
||||||
Color shadow_color2 = Color::from_rgb(0x404040);
|
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 (enabled) {
|
||||||
if (hovered)
|
if (hovered)
|
||||||
button_color = Color::from_rgb(0xe3dfdb);
|
base_color = Color::from_rgb(0xe3dfdb);
|
||||||
//else
|
//else
|
||||||
// button_color = Color::from_rgb(0xd6d2ce);
|
// button_color = Color::from_rgb(0xd6d2ce);
|
||||||
} else if (hovered && enabled)
|
} else if (hovered && enabled)
|
||||||
button_color = Color::from_rgb(0xd4d4d4);
|
base_color = Color::from_rgb(0xd4d4d4);
|
||||||
|
|
||||||
PainterStateSaver saver(painter);
|
PainterStateSaver saver(painter);
|
||||||
painter.translate(rect.location());
|
painter.translate(rect.location());
|
||||||
|
|
||||||
// Base
|
// 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
|
// Top line
|
||||||
painter.draw_line({ 2, 0 }, { rect.width() - 3, 0 }, highlight_color2);
|
painter.draw_line({ 2, 0 }, { rect.width() - 3, 0 }, highlight_color2);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue