Stunning App themes with Xamarin Forms Shell!
Stunning App themes with Xamarin Forms Shell!
You probably already know how to in classic Xamarin.Forms, but how about Setting up App Themes in a Xamarin.Forms Shell App?, now that’s what this is for. 😉
Check out the blog post: https://theconfuzedsourcecode.wordpress.com/2019/12/26/stunning-app-themes-in-xamarin-forms-shell-projects/
A little sneak peak:
Here we’re using awesome built-in Xamarin.Forms Dynamic Binding, and Styling features to implement a neat App Theming solution.
An alternative for: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/theming
But focused on the awesome new paradigm of Xamarin.Forms Shell!
Sample Theme File:
<?xml version="1.0" encoding="UTF-8" ?>
<ResourceDictionary
x:Class="XFShellAdvThemeing.Themes.PinkTheme"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
<Color x:Key="PrimaryColor">#fc0384</Color>
<Color x:Key="AccentColor">#ffb8dd</Color>
<Color x:Key="SecondaryColor">White</Color>
<Color x:Key="PageBackgroundColor">White</Color>
<Color x:Key="NavigationBarColor">#fc0384</Color>
<Color x:Key="PrimaryTextColor">#3d0020</Color>
<Color x:Key="SecondaryTextColor">#610033</Color>
<Color x:Key="TertiaryTextColor">#960050</Color>
</ResourceDictionary>
Sample Style:
<Style x:Key="ButtonStyle" TargetType="Button">
<Setter Property="BackgroundColor" Value="{DynamicResource PrimaryColor}" ></Setter>
<Setter Property="TextColor" Value="{DynamicResource SecondaryColor}" ></Setter>
<Setter Property="HeightRequest" Value="45" ></Setter>
<Setter Property="WidthRequest" Value="190" ></Setter>
</Style>
Sample UI Element:
<Button
x:Name="ChangeThemeButton"
Clicked="ChangeThemeButton_Clicked"
Style="{DynamicResource ButtonStyle}"
Text="Change App Theme" ></Button>
Dynamic App Theme Switching:
ICollection<ResourceDictionary> mergedDictionaries
= Application.Current.Resources.MergedDictionaries;
...
...
case Theme.Pink:
mergedDictionaries.Add(new PinkTheme());
break;
...
...
Saving Theme Preferences:
Preferences.Set("CurrentAppTheme", SelectedItem.ToString());
Behold the beauty on Android and iOS…