WPF 设置窗口数据上下文答案

【问题标题】：WPF Setting Window Data ContextWPF 设置窗口数据上下文
【发布时间】：2011-08-03 20:28:38
【问题描述】：

我是 WPF 的初学者，所以请多多包涵。我有一个简单的应用程序，可以将华氏温度值转换为摄氏度，反之亦然。我想我会尝试将它重构为 MVVM，所以我将所有内容从我的代码隐藏移动到一个单独的类，然后以编程方式设置 dataContext。但是，我得到了很多 ..'在上下文错误中不存在'。我哪里错了？谢谢

XAML

<Window x:Class="FarenheitCelciusConverter.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Temperature Converter" Height="500" Width="500"
xmlns:local="clr-namespace:FarenheitCelciusConverter">
<Grid HorizontalAlignment="Left" VerticalAlignment="Top" Height="473" Width="488">

    <Label Height="28" HorizontalAlignment="Left" Margin="10,10,0,0" Name="lblF" VerticalAlignment="Top" Width="64" FontWeight="Bold">Farenheit</Label>
    <Label Height="28" HorizontalAlignment="Left" Margin="10,42,0,0" Name="lblC" VerticalAlignment="Top" Width="64" FontWeight="Bold">Celcius</Label>
    <TextBox Height="23" Margin="94,10,112,0" Name="tbFaren" VerticalAlignment="Top" Width="72" HorizontalAlignment="Left" />
    <TextBox Height="23" Margin="94,42,112,0" Name="tbCelcius" VerticalAlignment="Top" Width="72" HorizontalAlignment="Left" />
    <Button Margin="94,76,109,0" Name="btnConvert" Click="btnConvert_Click" Height="23" VerticalAlignment="Top" HorizontalContentAlignment="Center" Width="72" HorizontalAlignment="Left">Convert</Button>
    <Image Name="image1" Stretch="Fill" Margin="94,112,240,228">
        <Image.Source>
            <BitmapImage DecodePixelWidth="200" UriSource="C:\Users\Winston\Pictures\thermometer.jpg"/>
        </Image.Source>
    </Image>
    <TextBlock FontWeight="Bold" Height="21" Margin="195,12,173,0" Name="tblCelci" VerticalAlignment="Top" /><TextBlock FontWeight="Bold" Height="21" Margin="195,44,0,0" Name="tblFarenh" VerticalAlignment="Top" HorizontalAlignment="Left" Width="120" /><TextBlock FontWeight="Bold" Height="21" Margin="195,78,15,0" Name="tblCex" VerticalAlignment="Top" Foreground="Red" />
</Grid>
</Window>

背后的代码

namespace FarenheitCelciusConverter
{
/// <summary>
/// Interaction logic for Window1.xaml
/// </summary>
public partial class Window1 : Window
{
    public Window1()
    {
        InitializeComponent();
        DataContext = new ConverterViewModel();
    }   
}

}

查看模型

namespace FarenheitCelciusConverter
{
    public class ConverterViewModel
    {        
    private void btnConvert_Click(object sender, RoutedEventArgs e)
    {
        tblCex.Text = "";

        try
        {
            if (tbCelcius.Text.Length != 0)
            {
                double celcius = Double.Parse(tbCelcius.Text);

                if (celcius < 99999.0 && celcius > -99999.0)
                {
                    tblFarenh.Text = Math.Round(1.8 * celcius + 32.0) + " F";
                }
                else
                {
                    throw new OverflowException("Number limit exceeded!");
                }
            }

            if (tbFaren.Text.Length != 0)
            {
                double farenh = Double.Parse(tbFaren.Text);

                if (farenh < 99999.0 && farenh > -99999.0)
                {
                    tblCelci.Text = Math.Round(0.555 * (farenh - 32.0)) + " C";
                }
                else
                {
                    throw new OverflowException("Number limit exceeded!");
                }
            }
        }

        catch (Exception ex)
        {
            tblCex.Text = ex.Message;
        }

    }  
}

}

【问题讨论】：

标签： c# wpf mvvm

【解决方案1】：

使用 MVVM 时，数据通过数据绑定从 View (Window1) 和 ViewModel 来回传递。因此，您的每个文本框都应该数据绑定到 Viewmodel 中的公共属性：

<TextBox Height="23" Margin="94,10,112,0" Name="tbFaren" VerticalAlignment="Top" Width="72" HorizontalAlignment="Left" Text="{Binding FahrenText}"/>

您的 ViewModel 将获取属性中的值，对它们进行处理，然后设置绑定到适当文本框的属性。

这样，Viewmodel 正在执行逻辑，而 View 正在根据您给它的规则解释输出。稍后，您可以更改 View 中的规则而不会弄乱 ViewModel，而使用代码隐藏通常您必须在程序逻辑旁边显式设置 View 设置。

另外，请务必在您的 ViewModel 上实现 iNotifyPropertyChanged，否则 UI 不会知道数据绑定的属性值何时发生更改并且不会更新。以this post 为例。

这里还有 Databinding in WPF 上的 MSDN 文章。

【讨论】：