2014-12-13 106 views
1

MainPage.xaml中的Windows Phone 8.1 MVVM設置視圖的視圖模型

<phone:PhoneApplicationPage 
    x:Class="MyApp.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" 
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" 
    SupportedOrientations="Portrait" Orientation="Portrait" 
    shell:SystemTray.IsVisible="True" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:viewModels="clr-namespace:MyApp.ViewModels" 
    xmlns:views="clr-namespace:MyApp.Views" 
    mc:Ignorable="d" 
    d:DataContext="{d:DesignInstance Type=viewModels:MainViewModel}"> 

    <!--FontFamily="{StaticResource PhoneFontFamilyNormal}" 
    FontSize="{StaticResource PhoneFontSizeNormal}" 
    Foreground="{StaticResource PhoneForegroundBrush}"--> 

    <!--LayoutRoot is the root grid where all page content is placed--> 
    <Grid x:Name="LayoutRoot" Background="Transparent"> 



     <!--Pivot Control--> 
     <phone:Pivot Title="MyApp"> 
      <!--Pivot item one--> 
      <phone:PivotItem Header="Main"> 
       <Grid> 

       </Grid> 
      </phone:PivotItem> 

      <!--Pivot item two--> 
      <phone:PivotItem Header="Counter"> 
       <views:CounterView /> 
      </phone:PivotItem> 
     </phone:Pivot> 
    </Grid> 

</phone:PhoneApplicationPage> 

CounterView.XAML

<UserControl x:Class="MyApp.Views.CounterView" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     FontFamily="{StaticResource PhoneFontFamilyNormal}" 
     FontSize="{StaticResource PhoneFontSizeNormal}" 
     Foreground="{StaticResource PhoneForegroundBrush}" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:viewModels="clr-namespace:MyApp.ViewModels" 
     mc:Ignorable="d" 
     d:DesignHeight="480" d:DesignWidth="480"   
     d:DataContext="{d:DesignInstance Type=viewModels:CounterViewModel}"> 


     <Grid x:Name="LayoutRoot" Background="Blue" > 
      <TextBlock Text="{Binding LightSensorInfo}" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="75,137,0,316"/> 
     </Grid> 
    </UserControl> 

錯誤:

System.Windows.Data Error: BindingExpression path error: 'LightSensorInfo' property not found on 'MyApp.ViewModels.MainViewModel' 'MyApp.ViewModels.MainViewModel' (HashCode=62333418). BindingExpression: Path='LightSensorInfo' DataItem='MyApp.ViewModels.MainViewModel' (HashCode=62333418); target element is 'System.Windows.Controls.TextBlock' (Name=''); target property is 'Text' (type 'System.String').. 

爲什麼他LL應用程序試圖尋找到MainViewModel,而不是CounterViewModel我有一個CounterView,DataContext的內設置?

在WPF中,ResourceDictionary中我用來設置這樣太:

<DataTemplate DataType="viewModels:CounterViewModel"> 
    <views:CounterView/> 
</DataTemplate> 

但是好像WindowsPhone的找不到數據類型屬性,所以我註釋掉這一部分。

我失蹤了什麼?有任何想法嗎?

+0

你試圖讓自己的視圖模型到用戶控件? – RenDishen 2014-12-13 11:09:38

+1

也許是因爲這是設計時數據上下文而不是實際的數據上下文? – John 2014-12-13 11:21:02

+0

在我的WP 8.1應用程序樣式中沒有'x:Key'的情況下,如果它們被放置在外部資源字典文件中,它們將被忽略。嘗試移動的DataTemplate直接到'' – opewix 2014-12-13 11:28:24

回答

1

Hoooah!找到解決方案

CounterView.XAML

錯誤:

d:DataContext="{d:DesignInstance Type=viewModels:CounterViewModel}" 

正確:

<UserControl.DataContext> 
    <viewModels:CounterViewModel/> 
</UserControl.DataContext> 

決賽:

<UserControl x:Class="MyApp.Views.CounterView" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    FontFamily="{StaticResource PhoneFontFamilyNormal}" 
    FontSize="{StaticResource PhoneFontSizeNormal}" 
    Foreground="{StaticResource PhoneForegroundBrush}" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:viewModels="clr-namespace:MyApp.ViewModels" 
    mc:Ignorable="d" 
    d:DesignHeight="480" d:DesignWidth="480"> 

    <UserControl.DataContext> 
     <viewModels:CounterViewModel/> 
    </UserControl.DataContext> 


    <Grid x:Name="LayoutRoot" Background="Blue" > 
     <TextBlock Text="{Binding LightSensorInfo}" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="75,137,0,316"/> 
    </Grid> 
</UserControl> 

作品像魅力!這是我所做的唯一改變 - 不必做任何事情。

+1

你的答案確實是正確的,但是,你的「錯誤」的XAML是適合你的設計用戶控件,從而使智能感知可以找到您的視圖模型的屬性。您可以將兩者都包含在您的XAML中。 – 2014-12-16 00:23:13

0

http://blog.jerrynixon.com/2013/07/solved-two-way-binding-inside-user.html

貌似答案是博客之內。尚未測試,但這聽起來很合理:

Please note: the data context property of the user control inherits from the parent. A DataTemplate might like this. But user controls don’t anticipate a data context type. Instead, they want properties explicitly set. And we want to bind those properties.

隨時更新我。 :)