Windows Phone Theme colors
Marco Franssen /
5 min read • 1002 words
When developing Windows Phone apps I love to use the theme accent colors in my apps. Since there are some new theme colors in Windows Phone 8 I started searching for their color codes. Lucky me I found them on msdn "Theme for Windows Phone").
Now you may be thinking how to use the colors in your own Windows Phone apps. The Color object doesn't contain a color called Emerald. So I created a small class to help me out with this issue. First of all I created a small static helper method to convert the hexa colors to a color object. So we are able to put in the hexa color string and the function returns a color for us.
public static Color FromHexa(string hexaColor)
{
return Color.FromArgb(
Convert.ToByte(hexaColor.Substring(1, 2), 16),
Convert.ToByte(hexaColor.Substring(3, 2), 16),
Convert.ToByte(hexaColor.Substring(5, 2), 16),
Convert.ToByte(hexaColor.Substring(7, 2), 16)
);
}Then I made some properties that caches the colors for us on their first use. The Color properties looks like this.
private static Color _lime;
public static Color Lime
{
get
{
if (_lime == null)
_lime = FromHexa("#FFA4CC00");
return _lime;
}
}So this is the complete class I came up with.
PhoneThemeColors.cs
//Copyright (c) 2012 Marco Franssen
//Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"),
//to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense,
//and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
//The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
//THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
//FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
//DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE
//OR OTHER DEALINGS IN THE SOFTWARE.
using System;
using System.Windows.Media;
namespace MarcoFranssen.Phone.Core
{
public static class PhoneThemeColors
{
private static Color _lime;
public static Color Lime
{
get
{
if (_lime == null)
_lime = FromHexa("#FFA4CC00");
return _lime;
}
}
private static Color _green;
public static Color Green
{
get
{
if (_green == null)
_green = FromHexa("#FF60A917");
return _green;
}
}
private static Color _emerald;
public static Color Emerald
{
get
{
if (_emerald == null)
_emerald = FromHexa("#FF008A00");
return _emerald;
}
}
private static Color _teal;
public static Color Teal
{
get
{
if (_teal == null)
_teal = FromHexa("#FF00ABA9");
return _teal;
}
}
private static Color _cyan;
public static Color Cyan
{
get
{
if (_cyan == null)
_cyan = FromHexa("#FF1BA1E2");
return _cyan;
}
}
private static Color _cobalt;
public static Color Cobalt
{
get
{
if (_cobalt == null)
_cobalt = FromHexa("#FF0050EF");
return _cobalt;
}
}
private static Color _indigo;
public static Color Indigo
{
get
{
if (_indigo == null)
_indigo = FromHexa("#FF6A00FF");
return _indigo;
}
}
private static Color _violet;
public static Color Violet
{
get
{
if (_violet == null)
_violet = FromHexa("#FFAA00FF");
return _violet;
}
}
private static Color _pink;
public static Color Pink
{
get
{
if (_pink == null)
_pink = FromHexa("#FFF47D02");
return _pink;
}
}
private static Color _magenta;
public static Color Magenta
{
get
{
if (_magenta == null)
_magenta = FromHexa("#FFD80073");
return _magenta;
}
}
private static Color _crimson;
public static Color Crimson
{
get
{
if (_crimson == null)
_crimson = FromHexa("#FFA20025");
return _crimson;
}
}
private static Color _red;
public static Color Red
{
get
{
if (_red == null)
_red = FromHexa("#FFE51400");
return _red;
}
}
private static Color _orange;
public static Color Orange
{
get
{
if (_orange == null)
_orange = FromHexa("#FFFA6800");
return _orange;
}
}
private static Color _amber;
public static Color Amber
{
get
{
if (_amber == null)
_amber = FromHexa("#FFF0A30A");
return _amber;
}
}
private static Color _yellow;
public static Color Yellow
{
get
{
if (_yellow == null)
_yellow = FromHexa("#FFD8C100");
return _yellow;
}
}
private static Color _brown;
public static Color Brown
{
get
{
if (_brown == null)
_brown = FromHexa("#FF825A2C");
return _brown;
}
}
private static Color _olive;
public static Color Olive
{
get
{
if (_olive == null)
_olive = FromHexa("#FF6D8764");
return _olive;
}
}
private static Color _steel;
public static Color Steel
{
get
{
if (_steel == null)
_steel = FromHexa("#FF647687");
return _steel;
}
}
private static Color _mauve;
public static Color Mauve
{
get
{
if (_mauve == null)
_mauve = FromHexa("#FF76608A");
return _mauve;
}
}
private static Color _sienna;
public static Color Sienna
{
get
{
if (_sienna == null)
_sienna = FromHexa("#FF7A3B3F");
return _sienna;
}
}
public static Color FromHexa(string hexaColor)
{
return Color.FromArgb(
Convert.ToByte(hexaColor.Substring(1, 2), 16),
Convert.ToByte(hexaColor.Substring(3, 2), 16),
Convert.ToByte(hexaColor.Substring(5, 2), 16),
Convert.ToByte(hexaColor.Substring(7, 2), 16)
);
}
}
}When you want to use it in a MVVM solution you probably want to create a SolidColorBrush to bind your control to. You could use my class like this to make a bindable property for your ViewModel.
public class MyViewModel : INotifyPropertyChanged
{
private SolidColorBrush _myTextColor = new SolidColorBrush(PhoneThemeColors.Crimson);
public SolidColorBrush MyTextColor
{
get { return _myTextColor; }
set
{
if (_myTextColor != value)
{
_myTextColor = value;
OnPropertyChanged("MyTextColor");
}
}
}
#region INotifyPropertyChanged Members
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string propertyName)
{
var handler = PropertyChanged;
if (handler == null) return;
handler(this, new PropertyChangedEventArgs(propertyName));
}
#endregion
}I hope you found this article useful. Please fork my gist on Github or past the file in your own project and share it with your friends.
