Skip to content

TabPanel has Finally Joined the Dark Side

Xojo’s TabPanel on Windows has fought hard to stay on the light side by making the dark mode transition annoyingly difficult, but at long last it has given up the fight and has embraced the dark side.

Supporting dark mode with Win32 controls is never an easy exercise, but if you’ve been following along with our work to modernize our Windows framework with XAML, then you may have already updated your apps with the XAML TabView control that natively supports dark mode.

Simply plug this bit of XAML into our DesktopXAMLContainer Content property and you’ve got yourself a modern looking TabPanel that already supported dark mode even before we did.

<winui:TabView>
	<winui:TabView.TabItems>
		<winui:TabViewItem Header="Tab 1">
			<StackPanel>
				<TextBlock Text="This is Tab 1" Margin="5"/>
				<Button Content="Button 1" Margin="5"/>
				<CheckBox Content="Checkbox 1" IsChecked="True" Margin="5"/>
			</StackPanel>
		</winui:TabViewItem>
		<winui:TabViewItem Header="Tab 2">
			<StackPanel>
				<TextBlock Text="This is Tab 2" Margin="5"/>
				<TextBox Text="Enter text here" Margin="5"/>
				<ComboBox Margin="5">
					<ComboBoxItem Content="Item 1"/>
					<ComboBoxItem Content="Item 2"/>
					<ComboBoxItem Content="Item 3"/>
				</ComboBox>
			</StackPanel>
		</winui:TabViewItem>
	</winui:TabView.TabItems>
</winui:TabView>

While people debate on which mode (light or dark) they prefer to work in, you can ultimately control whether you want to support dark mode or not in your app by toggling the “Supports Dark Mode” build setting. For an example on how to dynamically switch between dark and light mode in your app using XAML, see the XAML ButtonStyling example project and the RequestedTheme property.

Dana Brown is Xojo’s Director of Sales & Marketing. She has a Bachelor’s degree in Communication and a Master’s degree in Advertising. Having worked in the marketing field for almost 20 years, primarily in the technology sector, she has extensive experience in everything from digital marketing to search engine marketing, content creation, website development, event planning, brand development, advertising and more.