我目前正在尝试将设计数据集成到我的 UWP 应用程序中。 对于这种方法,我遵循了 Microsoft 的步骤:https://learn.microsoft.com/en-us/windows/uwp/data-binding/displaying-data-in-the-designer
我的问题:数据不会显示。只有绑定(bind)的名称:
那么我是如何实现的呢?
我决定使用“DesignInstance”,因为已经有一个 ViewModel,以后无论如何都会使用它(目前在运行时工作正常)。
因此,我的“MockupViewModel”继承了原来的 ViewModel,并在默认构造函数中创建了虚数值:
public class MockupModel
: WeatherViewModel
{
public MockupModel() : base()
{
Random Randomizer = new Random();
CurrentData.PrecipitationIcon = WeatherUnicodeIconLib.Neutral.Snow;
CurrentData.PrecipitationValue = 0.234;
CurrentData.SunRiseSetIcon = WeatherUnicodeIconLib.Miscellaneous.SunRise;
CurrentData.SunRiseSetTime = DateTime.Now;
CurrentData.TemperatureUnitIcon = WeatherUnicodeIconLib.Miscellaneous.Celsius;
CurrentData.TemperatureValue = -20.75;
CurrentData.WeatherStatusDescription = "lorem ipsum";
CurrentData.WeatherStatusIcon = OpenWeatherMapUnicodeStatusIconAdapter.GetStandardIconUnicode(200);
CurrentData.WindDirectionDegrees = 240.7;
CurrentData.WindSpeedIcon = WeatherUnicodeIconLib.GetBeaufortScaleIcon(3);
for (int i = 0; i < 7; i++)
{
DailyForecastViewModel NewForecastItem = new DailyForecastViewModel();
NewForecastItem.Day = DateTime.Now;
NewForecastItem.TemperatureValue = Randomizer.Next(-30, 30);
NewForecastItem.WeatherSatusIcon = OpenWeatherMapUnicodeStatusIconAdapter.GetStandardIconUnicode(300);
NewForecastItem.WindSpeedIcon = WeatherUnicodeIconLib.GetBeaufortScaleIcon(Randomizer.Next(0, 12));
DailyForecast.Add(NewForecastItem);
}
}
}
之后,将 MockupViewModel 添加到 XAML 代码中:
(查看 UserControl header /标记的最后一行)
<UserControl
x:Class="WeatherControl.WeatherControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:vm="using:WeatherControl.ViewModel"
d:DataContext="{d:DesignInstance Type=vm:MockupModel, IsDesignTimeCreatable=True}">
<UserControl.Resources>
<SolidColorBrush x:Key="FontColor">White</SolidColorBrush>
<x:Double x:Key="MainInfoFontSize">90</x:Double>
<Style TargetType="TextBlock">
<Setter Property="FontFamily" Value="{StaticResource WeatherIcons}"/>
<Setter Property="Foreground" Value="{StaticResource FontColor}"/>
<Setter Property="FlowDirection" Value="LeftToRight"/>
<Setter Property="FontSize" Value="30"/>
</Style>
</UserControl.Resources>
<StackPanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel
HorizontalAlignment="Stretch"
Padding="20">
<StackPanel
HorizontalAlignment="Stretch"
Orientation="Horizontal"
FlowDirection="RightToLeft">
<TextBlock
x:Name="SunSetRiseTime"
Text="{Binding Path=CurrentData.SunRiseSetTime}"/>
<TextBlock
x:Name="SunSetRiseIcon"
Text="{Binding Path=CurrentData.SunRiseSetIcon}"
Margin="10,0,30,0"/>
<TextBlock
x:Name="WindDirectionIcon"
Text=""
RenderTransformOrigin="0.5 0.5">
<TextBlock.RenderTransform>
<RotateTransform Angle="{Binding Path=CurrentData.WindDirectionDegrees}"/>
</TextBlock.RenderTransform>
</TextBlock>
<TextBlock
x:Name="WindBeaufortScaleIcon"
Text="{Binding Path=CurrentData.WindSpeedIcon}"
Margin="10,0,30,0"/>
<TextBlock
x:Name="PrecipitationIcon"
Text="{Binding Path=CurrentData.PrecipitationIcon}"
RenderTransformOrigin="0.5 0.5"/>
<TextBlock
x:Name="PrecipitationIconValue"
Text="{Binding Path=CurrentData.PrecipitationValue}"
Margin="10,0,20,0"/>
</StackPanel>
<StackPanel
x:Name="MainInfos"
HorizontalAlignment="Stretch"
Orientation="Horizontal"
FlowDirection="RightToLeft">
<TextBlock
x:Name="TemperatureUnitIcon"
Text="{Binding Path=CurrentData.TemperatureUnitIcon}"
FontSize="{StaticResource MainInfoFontSize}"
Margin="0,0,10,0"/>
<TextBlock
Name="TemperatureValue"
Text="{Binding Path=CurrentData.TemperatureValue}"
FlowDirection="LeftToRight"
FontSize="{StaticResource MainInfoFontSize}"
Margin="0,0,40,0"/>
<TextBlock
x:Name="WeatherStatusIcon"
Text="{Binding Path=CurrentData.WeatherStatusIcon}"
FontSize="{StaticResource MainInfoFontSize}"/>
</StackPanel>
<TextBlock
x:Name="WeatherDescription"
Text="{Binding Path=CurrentData.WeatherStatusDescription}"
TextAlignment="Right"
Margin="0,0,0,20"/>
<ListBox
x:Name="DailyForecasts"
HorizontalAlignment="Stretch"
FlowDirection="RightToLeft"
Background="Transparent"
ItemsSource="{Binding Path=DailyForecast}">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Padding" Value="0"/>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel
x:Name="ForecastDay"
Orientation="Horizontal"
HorizontalAlignment="Stretch">
<TextBlock
x:Name="WindSpeed"
TextAlignment="Left"
Text="{Binding Path=WindSpeedIcon}"
Width="70"/>
<TextBlock
x:Name="Temperature"
TextAlignment="Right"
Text="{Binding Path=TemperatureValue}"
Width="60"/>
<TextBlock
x:Name="WeatherIcon"
TextAlignment="Center"
Text="{Binding Path=WeatherSatusIcon}"
Width="100"/>
<TextBlock
x:Name="DayName"
TextAlignment="Left"
Text="{Binding Path=Day}"
Width="70"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</StackPanel>
你也可以在github上查看我的项目以获得更详细的代码: https://github.com/Wasserwecken/SmartMirror
我希望你能在这里帮助我,在此先感谢!!!
最佳答案
解决方案是确保您使用的是 x86 配置,然后在 Visual Studio 中单击名为“启用项目代码”的按钮:
来自这两个位置的更多信息:
1) "MSDN: Debugging or Disabling Project Code in XAML Designer"
Disabling project code can lead to a loss of design time data. An alternative is to debug the code running in the designer.
2) Enabling / Disabling design data in Visual Studio 2015 Update 1
In the case where the button is disabled, you can still edit the UI somehow, because the name of the property will be shown, and you can at least set the font, font size, foreground color etc, which is better than nothing.
不幸的是,Visual Studio 2015 的设计器有很多问题,因此您最终可能会遇到与我相同的问题:当您切换到 x86 时,Visual Studio 会提示“无效标记”。 Blend for Visual Studio 具有相同的按钮,如果没有帮助,您可以尝试使用 VS2017 RC。
关于c# - Visual Studio 不显示设计数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42475884/