雖然Windows Phone 8快要出來了...但是絲毫不能使我減少對WP7的研究...這次教大家如何動態改變APP的字體大小,想看具體的演示可以去windows phone市場下載 公交路線查詢http://www.windowsphone.com/?appsid=384ba16d-d30f-44a5-9a8e-e395eea269df
我在公交路線查詢里面設置了3種的字體大小(大,中,小) 我用一個枚舉來表示
public enum FontSizePattern { Small = 0, Middle, Large }
但是大家要知道,雖然字體分為了大、中、小,但是很多地方的字體顯示大小還是不一樣的,所以任何一種字體大小里面還要設置不同的字體SIZE,這里我把字體大小的配置寫成XAML文件
large.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:sys="clr-namespace:System;assembly=mscorlib" > <sys:Double x:Key="FontSize18">22.4</sys:Double> <sys:Double x:Key="FontSize22">26.4</sys:Double> <sys:Double x:Key="FontSize24">28.8</sys:Double> <sys:Double x:Key="FontSize30">32.8</sys:Double> <sys:Double x:Key="FontSize36">43.2</sys:Double> <sys:Double x:Key="FontSize48">57.6</sys:Double> <sys:Double x:Key="FontSize60">72.0</sys:Double> <sys:Double x:Key="FontSize72">86.4</sys:Double> </ResourceDictionary>
middle.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:sys="clr-namespace:System;assembly=mscorlib" > <sys:Double x:Key="FontSize18">22.0</sys:Double> <sys:Double x:Key="FontSize22">22.0</sys:Double> <sys:Double x:Key="FontSize24">24.0</sys:Double> <sys:Double x:Key="FontSize30">28.0</sys:Double> <sys:Double x:Key="FontSize36">36.0</sys:Double> <sys:Double x:Key="FontSize48">48.0</sys:Double> <sys:Double x:Key="FontSize60">60.0</sys:Double> <sys:Double x:Key="FontSize72">72.0</sys:Double> </ResourceDictionary>
small.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:sys="clr-namespace:System;assembly=mscorlib" > <sys:Double x:Key="FontSize18">16.6</sys:Double> <sys:Double x:Key="FontSize22">17.6</sys:Double> <sys:Double x:Key="FontSize24">19.2</sys:Double> <sys:Double x:Key="FontSize30">23.8</sys:Double> <sys:Double x:Key="FontSize36">28.8</sys:Double> <sys:Double x:Key="FontSize48">38.4</sys:Double> <sys:Double x:Key="FontSize60">48.0</sys:Double> <sys:Double x:Key="FontSize72">57.6</sys:Double> </ResourceDictionary>
現在我們要做的是用戶選擇不同的字體的時候加載不同的xaml文件就可以了,接下來我們來創建一個類Configuration 用來存儲用戶的配置信息同樣用到了AppSettingHelper這個類,可以去Windows Phone開發經驗談(14)-動態的改變APP的語言里面獲取...下面是Configuration的代碼
using System.ComponentModel; namespace ChinaBus.Utility { public class Configuration : INotifyPropertyChanged { Configuration() { this._fontSizePattern = AppSettingHelper.GetValueOrDefault<FontSizePattern>("FontSizePattern", FontSizePattern.Small); this._themesPattern = AppSettingHelper.GetValueOrDefault<ThemesPattern>("ThemesPattern", ThemesPattern.Blue); } private static Configuration _instance; public static Configuration Instance { get { if (Configuration._instance == null) { Configuration._instance = new Configuration(); } return Configuration._instance; } } public event PropertyChangedEventHandler PropertyChanged; private void OnPropertyChanged(string propertyName) { if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName)); } } private ThemesPattern _themesPattern; public ThemesPattern ThemesPattern { get { return this._themesPattern; } set { if (this._themesPattern != value) { this._themesPattern = value; this.UpdateValue("ThemesPattern", value); this.OnPropertyChanged("ThemesPattern"); } } } private FontSizePattern _fontSizePattern; public FontSizePattern FontSizePattern { get { return this._fontSizePattern; } set { if (this._fontSizePattern != value) { this._fontSizePattern = value; this.UpdateValue("FontSizePattern", value); this.OnPropertyChanged("FontSizePattern"); } } } private void UpdateValue(string key, object value) { AppSettingHelper.AddOrUpdateValue(key, value); } } }
這時候再創建一個類叫做FontSizeProvider 用來加載xaml獲取各種字體的大小,下面是完整的代碼。
using System; using System.ComponentModel; using System.Windows; using System.IO.IsolatedStorage; namespace ChinaBus.Utility { public class FontSizeProvider : INotifyPropertyChanged { private double _fontSize18; private double _fontSize22; private double _fontSize24; private double _fontSize30; private double _fontSize36; private double _fontSize48; private double _fontSize60; private double _fontSize72; public event PropertyChangedEventHandler PropertyChanged; public double F18 { get { return this._fontSize18; } private set { if (this._fontSize18 != value) { this._fontSize18 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F18")); } } } } public double F22 { get { return this._fontSize22; } private set { if (this._fontSize22 != value) { this._fontSize22 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F22")); } } } } public double F24 { get { return this._fontSize24; } private set { if (this._fontSize24 != value) { this._fontSize24 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F24")); } } } } public double F30 { get { return this._fontSize30; } private set { if (this._fontSize30 != value) { this._fontSize30 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F30")); } } } } public double F36 { get { return this._fontSize36; } private set { if (this._fontSize36 != value) { this._fontSize36 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F36")); } } } } public double F48 { get { return this._fontSize48; } private set { if (this._fontSize48 != value) { this._fontSize48 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F48")); } } } } public double F60 { get { return this._fontSize60; } private set { if (this._fontSize60 != value) { this._fontSize60 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F60")); } } } } public double F72 { get { return this._fontSize72; } private set { if (this._fontSize72 != value) { this._fontSize72 = value; if (this.PropertyChanged != null) { this.PropertyChanged.Invoke(this, new PropertyChangedEventArgs("F72")); } } } } public FontSizeProvider() { this.ApplyPattern(); Configuration.Instance.PropertyChanged += new PropertyChangedEventHandler(this.Configuration_PropertyChanged); } private void Configuration_PropertyChanged(object sender, PropertyChangedEventArgs e) { if (string.Compare(e.PropertyName, "FontSizePattern", StringComparison.OrdinalIgnoreCase) == 0) { this.ApplyPattern(); } } ~FontSizeProvider() { Configuration.Instance.PropertyChanged -= new PropertyChangedEventHandler(this.Configuration_PropertyChanged); } private void ApplyPattern() { FontSizePattern fontSizePattern = Configuration.Instance.FontSizePattern; string text = string.Format("/ChinaBus;component/Themes/Fonts/{0}.xaml", fontSizePattern.ToString()); ResourceDictionary resourceDictionary = new ResourceDictionary(); Application.LoadComponent(resourceDictionary, new Uri(text, UriKind.Relative)); this.F18 = (double)resourceDictionary["FontSize18"]; this.F22 = (double)resourceDictionary["FontSize22"]; this.F24 = (double)resourceDictionary["FontSize24"]; this.F30 = (double)resourceDictionary["FontSize30"]; this.F36 = (double)resourceDictionary["FontSize36"]; this.F48 = (double)resourceDictionary["FontSize48"]; this.F60 = (double)resourceDictionary["FontSize60"]; this.F72 = (double)resourceDictionary["FontSize72"]; } } }
這時候你在app.xaml加入下面代碼
<utility:FontSizeProvider x:Key="FontSizeProvider"/>
這樣你就可以在xaml里面使用,代碼如下
<TextBlock Text="{Binding BusDescription}" TextWrapping="Wrap" Margin="0,0,50,0" Foreground="{Binding Path=BusForeground, Source={StaticResource ThemeProvider}}" FontSize="{Binding Path=F18, Source={StaticResource FontSizeProvider}}"
當然在CS文件里面也同樣可以使用,你可以用單例模式來實現..也可以每次都創建一個類來實現,代碼如下
FontSizeProvider fzp = new FontSizeProvider(); var tbBacklineInfo = new TextBlock(); tbBacklineInfo.TextWrapping = TextWrapping.Wrap; tbBacklineInfo.Text = info.BackLine; tbBacklineInfo.FontSize = fzp.F30;
好了..介紹完了...有什么問題歡迎留言討論!