Added StatusBar

extra/DefaultTheme.oss

@@ -338,7 +338,14 @@ const $accentColorDark = #6B0A1DFF
 }
 (@tool_button button:hover) {
 	borderColor = color_white
+	backgroundColor = rgb(128, 0, 0, 128)
 	(icon) {
 		tint = color_white
 	}
 }
+(@tool_button button:pressed) {
+	borderColor = $accentColorDark
+	(icon) {
+		tint = $accentColorDark
+	}
+}

extra/DefaultThemeDark.oss

@@ -0,0 +1,347 @@
+% ================== DefaultTheme.oss ==================
+
+
+% ==== Variables ====
+const $accentColor = #2FB000FF
+const $textColor = #CCEECCFF
+const $borderColor = #111111FF
+const $darkColor = #223322FF
+const $accentColorLight = #87FF5CFF
+const $accentColorDark = #3B7500FF
+const $backgroundColor = rgba(30, 30, 30, 255)
+% ===================
+
+
+% ====== Root Widget ======
+(window) {
+	backgroundColor = $backgroundColor
+	(tooltip) {
+		backgroundColor = #FFF7D6FF
+		borderColor = rgb(30, 30, 30)
+		textColor = rgb(30, 30, 30)
+		borderWidth = 1
+		fontSize = 20
+	}
+}
+% =========================
+
+
+% ====== Panel ======
+(panel) {
+	backgroundColor = $backgroundColor
+	titleColor =  $accentColorDark
+	titlebarColor = $borderColor
+	titlebarBorderColor = $borderColor
+	borderColor = $borderColor
+	borderRadius = 0
+	borderWidth = 2
+	titlebarBorderWidth = 2
+	showBorder = true
+	showBackground = true
+	titlebarType =  full
+	titlebarHeight = 18
+	titlebarFontSize = 18
+	titlebarTextAlign = text_left
+	scrollSpeed = 1.2
+	scrollSmoothFactor = 0.7
+	padding = rect(15, 15, 15, 15)
+	margin = rect(0, 0, 0, 0)
+}
+% ===================
+
+
+
+% ====== TabPanel ======
+(tabPanel) {
+	backgroundColor = $backgroundColor
+	borderColor = $borderColor
+	borderRadius = 0
+	borderWidth = 2
+	showBorder = true
+	showBackground = true
+	margin = rect(0, 0, 0, 0)
+	textColor = $textColor
+	fontSize = 18
+
+	(tabBar) {
+		height = 35.0
+		backgroundColor = $darkColor
+		borderColor = $borderColor
+		borderWidth = 1
+		sidePadding = 20.0
+	}
+}
+(@panel_tab panel) {
+}
+% ======================
+
+
+
+% ====== Scrollbar ======
+(scrollbar) {
+	(thumb) {
+		color = $darkColor
+		borderRadius = 30.0
+		borderColor = $borderColor
+		showBorder = true
+	}
+	(track) {
+		color = #111111FF
+	}
+	width = 18.0
+}
+(scrollbar:hover) {
+	(thumb) {
+		color = $accentColorDark
+	}
+}
+(scrollbar:pressed) {
+	(thumb) {
+		color = #225500FF
+	}
+	(track) {
+		color = #001100FF
+	}
+}
+% =======================
+
+
+
+% ====== CheckBox ======
+(checkbox) {
+	checkBorderColor = $accentColorDark
+	checkBoxColor = $accentColor
+	textColor = $textColor
+	fontSize = 20
+	borderRadius = 0
+	borderWidth = 0
+	checkBorderRadius = 6
+	checkBorderWidth = 2
+	showBackground = false
+	showBorder = false
+	padding = rect(15, 15, 15, 15)
+	margin = rect(0, 0, 0, 0)
+}
+(checkbox:hover) {
+	checkBorderColor = $accentColorLight
+}
+(checkbox:pressed) {
+	checkBoxColor = $accentColor
+	textColor = $accentColorDark
+	checkBorderColor = $accentColor
+}
+(checkbox:active) {
+	checkBoxColor = $accentColor
+	checkBorderColor = $accentColor
+	textColor = $accentColorDark
+}
+% ======================
+
+
+
+% ====== RadioButton ======
+(radioButton) {
+	innerCircleColor = $accentColorDark
+	outerCircleColor = $accentColor
+	outerCircleBorderWidth = 2
+	textColor = $textColor
+	fontSize = 20
+	showBackground = false
+	showBorder = false
+	padding = rect(4, 4, 4, 4)
+	margin = rect(0, 0, 0, 0)
+}
+(radioButton:hover) {
+	outerCircleColor = $accentColorLight
+}
+(radioButton:pressed) {
+	outerCircleColor = $accentColor
+	textColor = $accentColorDark
+	innerCircleColor = $accentColor
+}
+(radioButton:active) {
+	innerCircleColor = $accentColor
+	outerCircleColor = $accentColor
+	textColor = $accentColorDark
+}
+% =========================
+
+
+
+% ====== Label ======
+(label) {
+	textColor = $textColor
+	fontSize = 20
+	borderRadius = 0
+	borderWidth = 0
+	showBackground = false
+	showBorder = false
+	padding = rect(15, 15, 15, 15)
+	margin = rect(0, 0, 0, 0)
+}
+% ===================
+
+
+
+% ====== Button ======
+(button) {
+	textColor = $textColor
+	backgroundGradient = gradientV($accentColor - $accentColorDark)
+	borderColor = $accentColorDark
+	fontSize = 20
+	borderRadius = 0
+	borderWidth = 1
+	showBackground = false
+	showBorder = true
+	useBackgroundGradient = true
+	padding = rect(5, 5, 5, 5)
+	margin = rect(0, 0, 0, 0)
+	showIcon = false
+	(icon) {
+	}
+}
+(button:hover) {
+	borderColor = $accentColorLight
+}
+(button:pressed) {
+	borderColor = $accentColorDark
+	textColor = #BBBBBBFF
+	backgroundGradient = gradientV($accentColorDark - $accentColor)
+}
+% ====================
+
+
+
+% ====== Image ======
+(image) {
+}
+% ===================
+
+
+
+% ====== ProgressBar ======
+(progressbar) {
+	borderColor = $accentColor
+	borderWidth = 1
+	showDecimal = false
+	showText = true
+	useBackgroundGradient = true
+	backgroundGradient = gradientV($darkColor - $accentColorDark)
+	useProgressGradient = true
+	progressGradient = gradientV($accentColor - $accentColorDark)
+}
+% ===================
+
+
+
+% ====== Slider ======
+(slider) {
+	(handle) {
+		color = $accentColor
+		size = vec2(10, 18)
+	}
+	(track) {
+		color = $accentColorDark
+		progressColor = $accentColor
+		width = 6.0
+	}
+	showStepTicks = true
+	stepTickHeight = 6.0
+	stepTickColor = $accentColor
+	padding = rect(5, 5, 5, 5)
+}
+% ===================
+
+
+
+% ====== ListView ======
+(list) {
+	(item) {
+		defaultTextColor = $textColor
+		defaultFontSize = 16
+		defaultPadding = rect(5, 5, 20, 0)
+		defaultSelectionColor = $accentColor
+		defaultSelectionTextColor = color_white
+	}
+	backgroundColor = $darkColor
+	borderColor = $borderColor
+	separatorLineColor = $borderColor
+	showSeparatorLine = true
+
+}
+% ======================
+
+
+
+% ====== Context Menu ======
+(context) {
+	padding = rect(16, 0, 16, 0)
+	itemSpacing = 6.0
+	fontSize = 18
+	backgroundColor = $darkColor
+	selectionColor = $accentColor
+	selectionTextColor = $accentColorLight
+	separatorLineColor = $borderColor
+	textColor = $textColor
+	submenuIndicatorColor = $accentColorDark
+	borderColor = $borderColor
+	useSelectionGradient = true
+	selectionGradient = gradientV($accentColor - $accentColorDark)
+}
+% ==========================
+
+
+
+% ====== MenuBar ======
+(menubar) {
+	height = 24.0
+	itemPadding = rect(0, 0, 15, 0)
+	fontSize = 16
+	backgroundColor = $darkColor
+	textColor = $textColor
+	selectionColor = $accentColor
+	selectionTextColor = $accentColorLight
+	borderColor = $borderColor
+}
+% =====================
+
+
+
+% ====== ToolBar ======
+(toolbar) {
+	height = 30.0
+	fontSize = 16
+	backgroundColor = $darkColor
+	textColor = $textColor
+	selectionColor = $accentColor
+	selectionTextColor = $accentColorLight
+	borderColor = $borderColor
+}
+% =====================
+(@tool_button button) {
+	fontSize = 18
+	padding = rect(5, 0, 5, 0)
+	margin = rect(5, 0, 0, 0)
+	showBackground = true
+	backgroundColor = $darkColor
+	useBackgroundGradient = false
+	showBorder = true
+	borderColor = color_black
+	showIcon = true
+	(icon) {
+		tint = $accentColorLight
+	}
+}
+(@tool_button button:hover) {
+	borderColor = $textColor
+	backgroundColor = $accentColorDark
+	(icon) {
+		tint = $textColor
+	}
+}
+(@tool_button button:pressed) {
+	borderColor = $accentColorDark
+	(icon) {
+		tint = $accentColorLight
+	}
+}

other/TODO.txt

@@ -39,6 +39,10 @@ Add gradient to listbox selection
 Add gradient to menubar background and selection
 Add cursor stack
 Add MacOS global menu integration
+Make label auto-size
+FIX: Tooltips
+XML Layout file?
+Add Hex Editor widget
 
 
 
@@ -64,7 +68,7 @@ Implement following widgets:
 	***Context Menu
 	***MenuBar
 	***Toolbar
-	StatusBar
+	***StatusBar
 	ComboBox
 	TreeView
 	Layouts
@@ -74,4 +78,3 @@ Implement following widgets:
 		Fill
 	Text Input
 	Text Area
-	Hex Editor

src/ogfx/gui/MenuBar.hpp

@@ -84,7 +84,7 @@ namespace ogfx
 				i32 m_openIndex { -1 };
 				i32 m_hoveredIndex { -1 };
 				bool m_active { false };
-				bool m_visible { true };
+				bool m_visible { false };
 
 				f32 m_height { 26 };
 				Rectangle m_itemPadding { 12, 0, 12, 0 };  // x = left, y = top, w = right, h = bottom

src/ogfx/gui/ToolBar.cpp

@@ -26,12 +26,12 @@ namespace ogfx
 {
 	namespace gui
 	{
-		ToolBar::ToolBar(Window& window) : Widget({ 0, 0, 0, 0 }, window)
+		ToolBar::ToolBar(Window& window, bool statusbar) : Widget({ 0, 0, 0, 0 }, window)
 		{
-			create();
+			create(statusbar);
 		}
 
-		ToolBar& ToolBar::create(void)
+		ToolBar& ToolBar::create(bool statusbar)
 		{
 			setRootChild();
 			setStylesheetCategoryName("toolbar");
@@ -40,7 +40,11 @@ namespace ogfx
 			w = win.getWindowWidth();
 			h = m_height;
 			disableBorder();
-			if (win.isMenuBarVisible())
+			setAsStatusBar(statusbar);
+			hide();
+			if (isStatusBar())
+				setPosition(0, win.getWindowHeight() - m_height);
+			else if (win.isMenuBarVisible())
 				setPosition(0, win.getMenuBar().getHeight());
 			else
 				setPosition(0, 0);
@@ -69,7 +73,9 @@ namespace ogfx
 			w = win.getWindowWidth();
 			h = m_height;
 			f32 offset_y = 0;
-			if (win.getMenuBar().isVisible())
+			if (isStatusBar())
+				offset_y = (win.getWindowHeight() / win.getScaleFactor()) - m_height;
+			else if (win.getMenuBar().isVisible())
 				offset_y += win.getMenuBar().geth();
 			sety(offset_y);
 		}
@@ -87,39 +93,20 @@ namespace ogfx
 
 		void ToolBar::onDraw(BasicRenderer2D& gfx)
 		{
-			if (!m_visible) return;
-
 			gfx.fillRect(*this, m_backgroundColor);
 
 			// Bottom border line
-			gfx.drawLine({ { getx(), gety() + m_height }, { getx() + getw(), gety() + m_height } }, m_borderColor);
+			f32 lineOffset = (isStatusBar() ? 0.0f : m_height);
+			gfx.drawLine({ { getx(), gety() + lineOffset }, { getx() + getw(), gety() + lineOffset } }, m_borderColor);
 		}
 
 		void ToolBar::onUpdate(void)
 		{
-			if (!m_visible) return;
 			bool iconsOnly = !isButtonTextEnabled();
 			for (auto& btn : m_buttons)
 				btn.enableIconOnly(iconsOnly);
 		}
 
-		void ToolBar::onMousePressed(const Event& event)
-		{
-			if (!m_visible) return;
-
-			Vec2 mousePos { event.mouse->position_x, event.mouse->position_y };
-
-			// event.handle();
-		}
-
-		void ToolBar::onMouseMoved(const Event& event)
-		{
-			if (!m_visible) return;
-
-			Vec2 mousePos { event.mouse->position_x, event.mouse->position_y };
-
-		}
-
 		void ToolBar::refresh_size(void)
 		{
 			for (auto& btn : m_buttons)

src/ogfx/gui/ToolBar.hpp

@@ -32,22 +32,19 @@ namespace ogfx
 		class ToolBar : public Widget
 		{
 			public:
-				ToolBar(Window& window);
-				ToolBar& create(void);
+				ToolBar(Window& window, bool statusbar = false);
+				ToolBar& create(bool statusbar = false);
 				widgets::Button& addButton(const String& iconPath, const String& text = "", EventCallback callback = nullptr);
 				void onWindowResized(const Event& event) override;
 				void applyTheme(const ostd::Stylesheet& theme) override;
 				void onDraw(BasicRenderer2D& gfx) override;
 				void onUpdate(void) override;
-				void onMousePressed(const Event& event) override;
-				void onMouseMoved(const Event& event) override;
 
 				inline void setw(f32 ww) override {  }
 				inline void seth(f32 hh) override { h = hh; refresh_size(); }
 
-				inline bool isVisible(void) const { return m_visible; }
-				inline void show(bool v = true) { m_visible = v; }
-				inline void hide(void) { show(false); }
+				inline bool isStatusBar(void) const { return m_isStatusBar; }
+				inline void setAsStatusBar(bool set = true) { m_isStatusBar = set; }
 
 				OSTD_PARAM_GETSET(f32, Height, m_height);
 				OSTD_PARAM_GETSET(i32, FontSize, m_fontSize);
@@ -60,9 +57,9 @@ namespace ogfx
 				void refresh_size(void);
 
 			private:
-				bool m_visible { true };
 				bool m_disableButtonText { true };
 				std::deque<widgets::Button> m_buttons;
+				bool m_isStatusBar { false };
 
 				f32 m_height { 26 };
 				i32 m_fontSize { 16 };

src/ogfx/gui/Window.cpp

@@ -27,19 +27,6 @@ namespace ogfx
 {
 	const Uint32 REDRAW_EVENT = SDL_RegisterEvents(1);
 
-	//TODO: Temporary
-	inline static const String DefaultThemeStyle = \
-		"window.backgroundColor = Color(#000000FF)\n" \
-		"label.textColor = Color(#FFFFFFFF)\n" \
-		"label.backgroundColor = Color(#00000000)\n" \
-		"label.borderColor = Color(#FFFFFFFF)\n" \
-		"label.fontSize = 20\n" \
-		"label.borderRadius = 20\n" \
-		"label.borderWidth = 2\n" \
-		"label.showBackground = false\n" \
-		"label.showBorder = false\n" \
-		"label.padding = Rect(5, 5, 5, 5)\n";
-
 	WindowCore::~WindowCore(void)
 	{
 		__on_window_destroy();
@@ -76,7 +63,6 @@ namespace ogfx
 		SDLSysten::acquire();
 
 		__load_default_stylesheet_variables();
-		DefaultTheme.loadFromString(DefaultThemeStyle, "memory://", true, getDefaultStylesheetVariableList());
 
 		m_windowWidth = width;
 		m_windowHeight = height;
@@ -831,9 +817,10 @@ namespace ogfx
 			m_rootWidget.reloadTheme(true);
 			m_toolbar.__applyTheme(theme, true);
 			m_toolbar.reloadTheme(true);
+			m_statusbar.__applyTheme(theme, true);
+			m_statusbar.reloadTheme(true);
 			m_cmenu.applyTheme(theme);
 			m_menubar.applyTheme(theme);
-			m_toolbar.applyTheme(theme);
 		}
 
 		void Window::__on_window_init(i32 width, i32 height, const String& title)
@@ -879,6 +866,8 @@ namespace ogfx
 					m_menubar.draw(m_gfx);
 				m_toolbar.__update();
 				m_toolbar.__draw(m_gfx);
+				m_statusbar.__update();
+				m_statusbar.__draw(m_gfx);
 				if (m_cmenu.isVisible())
 				{
 					stopTooltipTimer();
@@ -906,12 +895,14 @@ namespace ogfx
 				evt.__original_signal_id = ostd::BuiltinSignals::WindowClosed;
 				m_rootWidget.__onWindowClosed(evt);
 				m_toolbar.__onWindowClosed(evt);
+				m_statusbar.__onWindowClosed(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::WindowFocused)
 			{
 				evt.__original_signal_id = ostd::BuiltinSignals::WindowFocused;
 				m_rootWidget.__onWindowFocused(evt);
 				m_toolbar.__onWindowFocused(evt);
+				m_statusbar.__onWindowFocused(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::WindowLostFocus)
 			{
@@ -920,6 +911,7 @@ namespace ogfx
 				evt.__original_signal_id = ostd::BuiltinSignals::WindowLostFocus;
 				m_rootWidget.__onWindowFocusLost(evt);
 				m_toolbar.__onWindowFocusLost(evt);
+				m_statusbar.__onWindowFocusLost(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::FileDragAndDropped)
 			{
@@ -947,9 +939,8 @@ namespace ogfx
 				evt.__original_signal_id = ostd::BuiltinSignals::WindowResized;
 				if (m_menubar.isVisible())
 					m_menubar.onWindowResized(evt);
-				if (m_toolbar.isVisible())
-					m_toolbar.onWindowResized(evt);
 				m_toolbar.__onWindowResized(evt);
+				m_statusbar.__onWindowResized(evt);
 				m_rootWidget.__onWindowResized(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::MouseMoved)
@@ -960,9 +951,8 @@ namespace ogfx
 					m_menubar.onMouseMoved(evt);
 				if (m_cmenu.isVisible())
 					m_cmenu.onMouseMoved(evt);
-				if (m_toolbar.isVisible())
-					m_toolbar.onMouseMoved(evt);
 				m_toolbar.__onMouseMoved(evt);
+				m_statusbar.__onMouseMoved(evt);
 				m_rootWidget.__onMouseMoved(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::MouseScrolled)
@@ -972,6 +962,7 @@ namespace ogfx
 				if (m_cmenu.isVisible())
 					m_cmenu.onMouseScrolled(evt);
 				m_toolbar.__onMouseScrolled(evt);
+				m_statusbar.__onMouseScrolled(evt);
 				m_rootWidget.__onMouseScrolled(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::MousePressed)
@@ -982,9 +973,8 @@ namespace ogfx
 					m_cmenu.onMousePressed(evt);
 				if (m_menubar.isVisible())
 					m_menubar.onMousePressed(evt);
-				if (m_toolbar.isVisible())
-					m_toolbar.onMousePressed(evt);
 				m_toolbar.__onMousePressed(evt);
+				m_statusbar.__onMousePressed(evt);
 				m_rootWidget.__onMousePressed(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::MouseReleased)
@@ -994,6 +984,7 @@ namespace ogfx
 				if (m_cmenu.isVisible())
 					m_cmenu.onMouseReleased(evt);
 				m_toolbar.__onMouseReleased(evt);
+				m_statusbar.__onMouseReleased(evt);
 				m_rootWidget.__onMouseReleased(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::KeyPressed)
@@ -1001,6 +992,7 @@ namespace ogfx
 				evt.keyboard = &(ogfx::KeyEventData&)signal.userData;
 				evt.__original_signal_id = ostd::BuiltinSignals::KeyPressed;
 				m_toolbar.__onKeyPressed(evt);
+				m_statusbar.__onKeyPressed(evt);
 				m_rootWidget.__onKeyPressed(evt);
 			}
 			else if (signal.ID == ostd::BuiltinSignals::KeyReleased)
@@ -1008,6 +1000,7 @@ namespace ogfx
 				evt.keyboard = &(ogfx::KeyEventData&)signal.userData;
 				evt.__original_signal_id = ostd::BuiltinSignals::KeyReleased;
 				m_toolbar.__onKeyReleased(evt);
+				m_statusbar.__onKeyReleased(evt);
 				m_rootWidget.__onKeyReleased(evt);
 				if (evt.keyboard->keyCode == KeyCode::Escape)
 					close();
@@ -1017,6 +1010,7 @@ namespace ogfx
 				evt.keyboard = &(ogfx::KeyEventData&)signal.userData;
 				evt.__original_signal_id = ostd::BuiltinSignals::TextEntered;
 				m_toolbar.__onTextEntered(evt);
+				m_statusbar.__onTextEntered(evt);
 				m_rootWidget.__onTextEntered(evt);
 			}
 			onSignal(signal);

src/ogfx/gui/Window.hpp

@@ -279,6 +279,10 @@ namespace ogfx
 				inline void hideContextMenu(void) { m_cmenu.hide(); }
 				inline MenuBar& getMenuBar(void) { return m_menubar; }
 				inline ToolBar& getToolBar(void) { return m_toolbar; }
+				inline ToolBar& getStatusBar(void) { return m_statusbar; }
+				inline void showMenuBar(bool show = true) { m_menubar.show(show); }
+				inline void showToolBar(bool show = true) { m_toolbar.setVisible(show); }
+				inline void showStatusBar(bool show = true) { m_statusbar.setVisible(show); }
 
 				inline virtual void onInitialize(void) {  }
 				inline virtual void onDestroy(void) {  }
@@ -306,6 +310,7 @@ namespace ogfx
 				ContextMenu m_cmenu { *this };
 				MenuBar m_menubar { *this };
 				ToolBar m_toolbar { *this };
+				ToolBar m_statusbar { *this, true };
 
 				friend class widgets::RootWidget;
 		};

src/ogfx/gui/widgets/Containers.cpp

@@ -59,6 +59,11 @@ namespace ogfx
 				drawScrollbars(gfx);
 			}
 
+			void Panel::onWindowResized(const Event& event)
+			{
+				updateScrollbarsSize();
+			}
+
 			void Panel::setTitlebarType(const String& type)
 			{
 				String t = type.new_toLower().trim();

src/ogfx/gui/widgets/Containers.hpp

@@ -47,6 +47,7 @@ namespace ogfx
 					Panel& create(void);
 					void applyTheme(const ostd::Stylesheet& theme) override;
 					void afterDraw(ogfx::BasicRenderer2D& gfx) override;
+					void onWindowResized(const Event& event) override;
 					void setTitlebarType(const String& type);
 					String getTitlebarType(void) const;
 					inline String getTitle(void) const { return m_title; }

src/ogfx/gui/widgets/Label.cpp

@@ -85,6 +85,7 @@ namespace ogfx
 			void ImageLabel::applyTheme(const ostd::Stylesheet& theme)
 			{
 				enableAnimated(getThemeValue<bool>(theme, "animated", m_animated));
+				setTintColor(getThemeValue<Color>(theme, "tint", getTintColor()));
 				setAnimationData(getThemeValue<AnimationData>(theme, "animation", m_animData));
 				String filePath = getThemeValue<String>(theme, "path", m_image.getFilePath());
 				if (filePath != m_image.getFilePath())
@@ -100,9 +101,9 @@ namespace ogfx
 			void ImageLabel::onDraw(ogfx::BasicRenderer2D& gfx)
 			{
 				if (isAnimatedEnabled())
-					gfx.drawAnimation(m_anim, getGlobalPosition() + getPadding().topLeft(), getSize() - getPadding().bottomRight());
+					gfx.drawAnimation(m_anim, getGlobalPosition() + getPadding().topLeft(), getSize() - getPadding().bottomRight(), getTintColor());
 				else
-					gfx.drawImage(m_image, getGlobalPosition() + getPadding().topLeft(), getSize() - getPadding().bottomRight());
+					gfx.drawImage(m_image, getGlobalPosition() + getPadding().topLeft(), getSize() - getPadding().bottomRight(), getTintColor());
 			}
 
 			void ImageLabel::onUpdate(void)

src/ogfx/gui/widgets/Label.hpp

@@ -60,11 +60,13 @@ namespace ogfx
 					inline Image& getImage(void) { return m_image; }
 					OSTD_BOOL_PARAM_GETSET_E(Animated, m_animated);
 					OSTD_PARAM_GETSET(AnimationData, AnimationData, m_animData);
+					OSTD_PARAM_GETSET(Color, TintColor, m_tintColor);
 
 				private:
 					Image m_image;
 					Animation m_anim;
 					AnimationData m_animData;
+					Color m_tintColor { Colors::White };
 					bool m_animated { false };
 			};
 		}

src/ogfx/gui/widgets/RootWidget.cpp

@@ -45,6 +45,8 @@ namespace ogfx
 				if (win.m_toolbar.isVisible())
 					offset_y += win.m_toolbar.geth();
 				sety(offset_y);
+				if (win.m_statusbar.isVisible())
+					offset_y += win.m_statusbar.geth();
 				setSize(cast<f32>(event.windowResized->new_width), cast<f32>(event.windowResized->new_height) - offset_y);
 			}
 

src/test/GuiTest.cpp

@@ -49,8 +49,16 @@ class Window : public ogfx::gui::Window
 			m_img.setImage("./img.png");
 			m_img.enableAnimated();
 			m_img.setSize(256, 256);
+			m_img.addThemeOverride("@.image.tint", ogfx::Color("#2FB000FF"));
+
+			m_theme.loadFromFile("./DefaultThemeDark.oss", true, getDefaultStylesheetVariableList());
+			setTheme(m_theme);
 
 			getToolBar().setHeight(30);
+			getStatusBar().setHeight(24);
+			showMenuBar();
+			showToolBar();
+			showStatusBar();
 
 			ogfx::AnimationData iconsAD;
 			iconsAD.frameCount = 1;
@@ -127,10 +135,8 @@ class Window : public ogfx::gui::Window
 			});
 			m_slideLbl.setText(String("").add(m_slide.getValue(), 2));
 
-			m_drawCallsLbl.addThemeOverride("@.label.fontSize", 30);
-			m_drawCallsLbl.addThemeOverride("@.label.textColor", Colors::Crimson);
-
 			m_list.setSize(200, 300);
+			m_list.reloadTheme();
 
 			for (i32 i = 0; i < 500; i++)
 			{
@@ -159,6 +165,7 @@ class Window : public ogfx::gui::Window
 			}
 
 			m_tabs.setSize(900, 700);
+			m_tabs.addThemeOverride("@.tabPanel.borderWidth", 1.0f);
 			auto& t1 = m_tabs.addTab("Tab1");
 			auto& t2 = m_tabs.addTab("Tab2 Test");
 			auto& t3 = m_tabs.addTab("Long Tab Test");
@@ -193,12 +200,14 @@ class Window : public ogfx::gui::Window
 			m_panel2.addWidget(m_img, { 20, 50 });
 
 			addWidget(m_tabs, { 0,  0 });
-			addWidget(m_drawCallsLbl, { 39, m_tabs.getSize().y + 30 });
 
-			m_theme.loadFromFile("./DefaultTheme.oss", true, getDefaultStylesheetVariableList());
-			setTheme(m_theme);
+			m_drawCallsLbl.addThemeOverride("@.label.fontSize", 20);
+			m_drawCallsLbl.addThemeOverride("@.label.padding", ostd::Rectangle { 10, 5, 0, 0 });
+			getStatusBar().addWidget(m_drawCallsLbl, { 0, 0 });
 
 			m_progressJob.start([this] {
+				while (true)
+				{
 					f32 prog = 0.0f;
 					while (prog < 100)
 					{
@@ -206,6 +215,7 @@ class Window : public ogfx::gui::Window
 						ostd::Time::sleep(ostd::Random::getui32(10, 500));
 						this->m_prog.setProgress(prog);
 					}
+				}
 				return true;
 			});
 
@@ -214,8 +224,6 @@ class Window : public ogfx::gui::Window
 				std::cout << e.text << "  -  " << (i32)e.id << "\n";
 			};
 
-			setContextMenu(m_menu);
-
 			auto onActivate = [this](const ogfx::gui::ContextMenu::Entry& e) {
 				out().fg("cyan").p("[MenuBar] Activated: ").fg("yellow").p(e.text)
 					 .fg("cyan").p(" (id=").fg("green").p(e.id).fg("cyan").p(")").reset().nl();
@@ -255,15 +263,21 @@ class Window : public ogfx::gui::Window
 				auto& mmd = cast<ogfx::MouseEventData&>(signal.userData);
 				if (mmd.button == ogfx::MouseEventData::eButton::Right)
 				{
+					setContextMenu(m_menu);
 					showContextMenu({ mmd.position_x, mmd.position_y });
 				}
 			}
+			else if (signal.ID == ostd::BuiltinSignals::WindowResized)
+			{
+				auto& wrd = cast<ogfx::WindowResizedData&>(signal.userData);
+				m_tabs.setSize(cast<f32>(wrd.new_width), cast<f32>(wrd.new_height - getMenuBar().geth() - getToolBar().geth() - getStatusBar().geth()));
+			}
 		}
 
 		void onRedraw(ogfx::BasicRenderer2D& gfx) override
 		{
 			// gfx.fillRect(m_tabs.getGlobalPureContentBounds(), { 0, 255, 0, 100 });
-			m_drawCallsLbl.setText(String("").add(gfx.getDrawCallCount()));
+			m_drawCallsLbl.setText(String("DrawCalls: ").add(gfx.getDrawCallCount()));
 		}
 
 		void onFixedUpdate(void) override