Blog.

Windows Phone Theme colors

MF

Marco Franssen /

5 min read1002 words

Cover Image for Windows Phone Theme colors

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.

//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.

You have disabled cookies. To leave me a comment please allow cookies at functionality level.

More Stories

Cover Image for Recap my online year 2012

Recap my online year 2012

MF

Marco Franssen /

The year 2012 was for me a year that went way to fast. In the year 2012 I learned a lot new stuff, wrote several blog posts and read lots of blog posts and articles. First of all I want you to give a list of all blog posts I wrote this year. You can find the complete list here http://marcofranssen.nl/2012/ and here http://marcofranssen.nl/2012/page/2/. JavaScript http://marcofranssen.nl/writing-modular-javascript-without-polluting-the-global-namespace/ http://marcofranssen.nl/knockout-js-mapp…

Cover Image for Knockout JS mappings

Knockout JS mappings

MF

Marco Franssen /

Knockout JS is a JavaScript library for creating MVVM JavaScript libraries. In a previous post I already showed some of the cool features of Knockout. http://marcofranssen.nl/knockout-that-cascading-dropdown/ If you want to spike your knowledge on Knockout a little more first, please visit Knockout's documentation. In this article I want to zoom in on the Knockout mapping plugin. The Knockout mapping plugin enables you to easy map your JSON object into an observable JavaScript object. So here…

Cover Image for Unblock downloaded files with PowerShell

Unblock downloaded files with PowerShell

MF

Marco Franssen /

Have you ever got in the situation that you downloaded a zip-file and figured out to late the files are blocked? So you extracted the zip file into a folder with existing items. It will be damn hard to figure out which files needs to be unblocked. Besides that it will cost you many work to do so by right-clicking all of the files and clicking the unblock button. Unblock file Luckily we have PowerShell and we can easily write a little script to execute the unblock operation on the files in a sp…

Cover Image for Install Windows 8 from rusty 256 MB USB stick

Install Windows 8 from rusty 256 MB USB stick

MF

Marco Franssen /

This is the fourth time I installed Windows 8. This time I installed it on my personal notebook instead of a VHD, because Windows 8 is finally ready to market. So I started with downloading the enterprise edition from my MSDN subscription. Unfortunately my USB drive died so I had no storage large enough to put the image on and boot from. So I started thinking to install it over the network. Luckily me I still had my rusty 10 year old 256MB USB drive which perfectly fits a Windows PE image. So I…