Windows Phone 8.1中绑定数据转换

傷城~ 2022-08-05 00:42 142阅读 0赞

生活中虽然处处充斥着数学，但是生活并不是数学。生活中处处充斥着逻辑思维，但是更直观的表达往往更加易于理

解和接受。比如问今天天气怎么样，如果给你一大堆天气预报专业用语：晴，40度等等，虽然能让人理解，但是比较

生硬。如果换成更加直观的方式，比如将晴天转换成太阳的图片，40度对应着一个硕大的不断流汗的温度计，度数指

向40度，像这样就能让人一眼就知晓今天的天气情况。同样将成绩90分以上显示为笑脸，及格显示为不小不哭脸，

将不及格显示为哭脸，都比较直观。

好了，上面废话说了一大堆，根本上就是，在做应用的时候，如果给用户呈现一大堆数据的话会显得应用很生硬毫无

生气，并且会让用户不耐烦，用户体验下降。而取而代之的是直观的图像或者图标，在不影响数据反映的同时，又能

抓住用户的吸引力，这才是应用最关键的。

具体解决方案：绑定数据转换需要通过Binding的Converter属性来实现。此属性用来获取或设置转换器对象，当数据

在目标和源之内传递时，绑定引擎调用该对象修改数据。通过创建数据源类和实现一个IValueConverter接口针对不

同的需求自定义转换器。

转换器是派生自IValueConverter接口的类，包含了Convert和ConvertBack两种方法。从源绑定给目标会调用

Convert方法，从目标反映到源会调用ConvertBack方法。

应用示例：代码说明，新建类文件Score.cs，数据源是Score类，并实现INotifyPropertyChanged通知机制；新建类

ScoreToFaceConverter.cs，并实现值转换接口IValueConverter。

在XAML文件中引用.cs文件的步骤：将.cs作为资源在XAML中定义

<Page.Resource>

<local:ScoreToFaceConverter x:Key="scoreToFaceConverter" />

</Page.Resource>

DataBindDemo2的XAML代码：

DataBindDemo2的.CS代码：

using System;
    using System.Collections.Generic;
    using System.IO;
    using System.Linq;
    using System.Runtime.InteropServices.WindowsRuntime;
    using Windows.Foundation;
    using Windows.Foundation.Collections;
    using Windows.UI.Xaml;
    using Windows.UI.Xaml.Controls;
    using Windows.UI.Xaml.Controls.Primitives;
    using Windows.UI.Xaml.Data;
    using Windows.UI.Xaml.Input;
    using Windows.UI.Xaml.Media;
    using Windows.UI.Xaml.Navigation;
    
    // “空白页”项模板在 http://go.microsoft.com/fwlink/?LinkID=390556 上有介绍
    
    namespace App1
    {
        /// <summary>
        /// 可用于自身或导航至 Frame 内部的空白页。
        /// </summary>
        public sealed partial class DataBindDemo2 : Page
        {
            Grade grade = new Grade() { Score = 100 };
    
            public DataBindDemo2()
            {
                this.InitializeComponent();
    
                this.DataContext = grade;
            }
    
            /// <summary>
            /// 在此页将要在 Frame 中显示时进行调用。
            /// </summary>
            /// <param name="e">描述如何访问此页的事件数据。
            /// 此参数通常用于配置页。</param>
            protected override void OnNavigatedTo(NavigationEventArgs e)
            {
            }
    
            private void good_Click(object sender, RoutedEventArgs e)
            {
                grade.Score = 98;
            }
    
            private void normal_Click(object sender, RoutedEventArgs e)
            {
                grade.Score = 70;
            }
    
            private void bad_Click(object sender, RoutedEventArgs e)
            {
                grade.Score = 50;
            }
        }
    }

数据源Grade类，实现INotifyPropertyChanged接口：

using System;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    
    namespace App1
    {
        public class Grade:INotifyPropertyChanged
        {
            private int score;
            public event PropertyChangedEventHandler PropertyChanged;
    
            public int Score
            {
                get
                {
                    return score;
                }
                set
                {
                    score = value;
                    OnPropertyChanged(new PropertyChangedEventArgs("Score"));
                }
            }
    
            protected virtual void OnPropertyChanged(PropertyChangedEventArgs args)
            {
                if(PropertyChanged != null)
                {
                    PropertyChanged(this, args);
                }
            }
        }
    }

转换GradeToFaceConvert类，实现IValueConverter接口：

using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using Windows.UI.Xaml.Data;
    
    namespace App1
    {
        public class GradeToFaceConvert:IValueConverter
        {
            public object Convert(object value, Type targetType, object parameter, string language)
            {
                if(int.Parse(value.ToString())>=90)
                {
                    return "ms-appx:///Assets/Images/1.jpg";
                }
                else if(int.Parse(value.ToString())<60)
                {
                    return "ms-appx:///Assets/Images/3.jpg";
                }
                else
                {
                    return "ms-appx:///Assets/Images/2.jpg";
                }
            }
    
            public object ConvertBack(object value, Type targetType, object parameter, string language)
            {
                throw new NotImplementedException();
            }
        }
    }

运行截图：

初始界面：

![20150526171141870][]

点击优秀按钮之后：

![20150526171216830][]

点击及格按钮之后：

![20150526171427879][]

点击不及格按钮：

![20150526171311320][]

[20150526171141870]: /images/20220805/3fbb270529a4456b86660ef7d52da1fe.png
[20150526171216830]: /images/20220805/b73958e9b3d64553bd1b8363defdd0b8.png
[20150526171427879]: /images/20220805/e0452e4b7475496489b4fafc48bfd225.png
[20150526171311320]: /images/20220805/b3fc84e95a3f484baf13e1639ac0d8e6.png