Pre-defined system styles and resources in Windows Phone 7
Join the DZone community and get the full member experience.
Join For Freewindows phone 7 is based on the metro ui and if you develop for this platform, then you probably want your application to be as consistent as possible with the main ui. to achieve this, many developers try guessing font styles and colors. the problem comes when the end-user decides to change some settings, like, for example, the accent color. if the color itself is hard-coded in the application, then chances are that it won’t look nothing like the main ui. so what is the solution? using pre-defined styles and resources that come bundled with the system is the way to go.
here is a complete list of what those are, and you can use this article as a cheat-sheet when developing windows phone 7 applications.
color styles
key:
phonebackgroundcolor
default actual value:
#ff1f1f1f
key:
phonecontrastforegroundcolor
default actual value:
black
key:
phoneforegroundcolor
default actual value:
white
key:
phoneinactivecolor
default actual value:
#ff666666
key:
phonedisabledcolor
default actual value:
#ff808080
key:
phonesubtlecolor
default actual value:
#ff999999
key:
phonecontrastbackgroundcolor
default actual value:
#ffffffff
key:
phonetextboxcolor
default actual value:
#ffbfbfbf
key:
phonebordercolor
default actual value:
#ffcccccc
key:
phonetextselectioncolor
default actual value:
black
key:
phoneaccentcolor
default actual value:
#ff1ba1e2
brush styles
key:
phoneaccentbrush
color:
phoneaccentcolor
key:
phonebackgroundbrush
color:
phonebackgroundcolor
key:
phonecontrastforegroundbrush
color:
phonecontrastforegroundcolor
key:
phoneforegroundbrush
color:
phoneforegroundcolor
key:
phoneinactivebrush
color:
phoneinactivecolor
key:
phonedisabledbrush
color:
phonedisabledcolor
key:
phonesubtlebrush
color:
phonesubtlecolor
key:
phonecontrastbackgroundbrush
color:
phonecontrastbackgroundcolor
key:
phonetextboxbrush
color:
phonetextboxcolor
key:
phoneborderbrush
color:
phonebordercolor
key:
phonetextselectionbrush
color:
phonetextselectioncolor
key:
transparentbrush
color:
transparent
font families
key:
phonefontfamilynormal
actual font:
segoe wp
key:
phonefontfamilylight
actual font:
segoe wp light
key:
phonefontfamilysemilight
actual font:
segoe wp semilight
key:
phonefontfamilysemibold
actual font:
segoe wp semibold
font sizes
key:
phonefontsizesmall
double value:
18.667
point value:
14pt
key:
phonefontsizenormal
double value:
20
point value:
15pt
key:
phonefontsizemedium
double value:
22.667
point value:
17pt
key:
phonefontsizemediumlarge
double value:
25.333
point value:
19pt
key:
phonefontsizelarge
double value:
32
point value:
24pt
key:
phonefontsizeextralarge
double value:
42.667
point value:
32pt
key:
phonefontsizeextraextralarge
double value:
72
point value:
54pt
textblock styles
key:
phonetextnormalstyle
fontfamily:
phonefontfamilynormal
fontsize:
phonefontsizenormal
foreground:
phoneforegroundbrush
key:
phonetexttitle1style
fontfamily:
phonefontfamilysemilight
fontsize:
phonefontsizeextraextralarge
foreground:
phoneforegroundbrush
key:
phonetextsubtlestyle
fontfamily:
phonefontfamilynormal
fontsize:
staticresource phonefontsizenormal
foreground:
phonesubtlebrush
key:
phonetexttitle2style
fontfamily:
phonefontfamilysemilight
fontsize:
phonefontsizelarge
foreground:
phoneforegroundbrush
key:
phonetexttitle3style
fontfamily:
staticresource phonefontfamilysemilight
fontsize:
phonefontsizemedium
foreground:
phoneforegroundbrush
key:
phonetextextralargestyle
fontfamily:
phonefontfamilysemilight
fontsize:
phonefontsizeextralarge
foreground:
phoneforegroundbrush
key:
phonetextgroupheaderstyle
fontfamily:
phonefontfamilysemilight
fontsize:
phonefontsizelarge
foreground:
phonesubtlebrush
key:
phonetextlargestyle
fontfamily:
phonefontfamilysemilight
fontsize:
phonefontsizelarge
foreground:
phoneforegroundbrush
key:
phonetextsmallstyle
fontfamily:
phonefontfamilynormal
fontsize:
phonefontsizesmall
foreground:
phonesubtlebrush
key:
phonetextcontraststyle
fontfamily:
phonefontfamilysemibold
fontsize:
phonefontsizenormal
foreground:
phonecontrastforegroundbrush
key:
phonetextaccentstyle
fontfamily:
phonefontfamilysemibold
fontsize:
phonefontsizenormal
foreground:
phoneaccentbrush
you can download the pdf here .
Opinions expressed by DZone contributors are their own.
Comments