1

我正在开发一个 Windows 应用商店应用程序,但遇到了缩放到不同屏幕尺寸的问题——即 140% 和 180%。一切都在我的计算机上完美运行,缩放到 100%,但是当我在 Surface Pro 和未缩放到 100% 的不同模拟器选项上测试它时,它开始起作用。我很确定问题出在,<VisualStateManager>但据我所知。

该问题仅出现在Snapped状态中,并且在横向模式下会发生 140% 的情况,标题有时会出现有时会保持空白。有时,单击标题可以调出菜单——即使它是空白的,而其他时候什么也没有发生。关于它的奇怪部分是,它是否有效取决于加载的数据DataFrame框架中加载的数据,所以如果我将这些页面的内容更改为与工作页面相同的内容,它就会工作。较短的页面似乎有更多的问题,但这是我能找到的唯一模式。

当屏幕缩放到 140% 纵向模式时,看不到任何文字,但仍有一些可点击。

当屏幕缩放到 180% 时,文本不可见,不可点击。

标题图片未显示:

标题不显示

图片标题显示:

标题显示

这是我的MainPage.xaml代码:

<Page
    x:Name="mainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:LearnOneNote"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    x:Class="LearnOneNote.MainPage"
    mc:Ignorable="d"
    Margin="-2">

    <Grid Background="White" x:Name="MainGrid">
        <Grid.Resources>
            <local:StringToTitleConverter x:Key="Convert" />
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="100" x:Name="TitleRow"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="250" x:Name="ItemsColumn"/>
            <ColumnDefinition Width="*" x:Name="DataColumn"/>
        </Grid.ColumnDefinitions>

        <ListBox x:Name="Items" Grid.Column="0" Grid.RowSpan="2" ItemsSource="{Binding ItemList}" Padding="5" SelectionChanged="newSelect" Tapped="Items_Tapped"/>

        <Border x:Name="Border" Grid.Column="1" Margin="10,0,10,10" BorderThickness="0,0,0,2" BorderBrush="Brown" MaxHeight="100" VerticalAlignment="Bottom"/>

        <Viewbox x:Name="TitleView" Margin="10,0,10,10" VerticalAlignment="Center" Grid.Column="1" Grid.Row="0">
            <TextBlock Foreground="Brown" Text="{Binding ElementName=Items, Path=SelectedValue, ConverterParameter=PrimaryView, Converter={StaticResource Convert}}" Margin="5,10,5,5"/>
        </Viewbox>

        <Viewbox x:Name="TitleViewSnapped" Margin="10,0,10,10" VerticalAlignment="Center" Grid.Column="1" Grid.Row="0" Visibility="Collapsed">
            <TextBlock x:Name="TitleSnapped" Foreground="Brown" Text="{Binding ElementName=Items, Path=SelectedValue, ConverterParameter=Snapped, Converter={StaticResource Convert}}"
                       Margin="0,10,5,5" PointerEntered="Title_PointerEntered" PointerExited="Title_PointerExited" Tapped="Title_Tapped"/>
        </Viewbox>

        <Frame Grid.Column="1" Grid.Row="1" Margin="20,20,0,20" x:Name="DataFrame" FontSize="20" Foreground="Black" VerticalAlignment="Top" />

        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="ViewStates">
                <VisualState x:Name="PrimaryView"/>
                <VisualState x:Name="Snapped">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ItemsColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TitleView" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TitleViewSnapped" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState x:Name="ItemsSelector">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DataColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="0"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ItemsColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="*"/>
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Items" Storyboard.TargetProperty="FontSize">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="25"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Grid>
</Page>

如果我从 中删除此位<VisualState x:Name="Snapped">,我的文本消失没有问题,尽管点击问题仍然存在:

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Title" Storyboard.TargetProperty="Text">
  <DiscreteObjectKeyFrame KeyTime="0" Value="{Binding ElementName=Items, Path=SelectedValue, ConverterParameter=Snapped, Converter={StaticResource Convert}}"/>
</ObjectAnimationUsingKeyFrames>

我在互联网上搜索了其他有此问题的人,并找到了这些 MSDN 页面:

缩放到像素密度
调整到窄布局
支持多种屏幕尺寸

据我所知,我已经完成了所有这些更改。

我的简化程序可在此处的文件中找到

我的图片可以在这里找到

4

2 回答 2

2

我认为您不能在动画中进行绑定。如果不同的文本是您想要区分视图的方式,我会尝试两个单独TextBlocks的绑定到不同的值并在视觉状态故事板中交替使用这些值。Visibility

于 2014-06-02T22:52:10.173 回答
0

好吧,这绝对是疯了。我通过删除页面上的 -2 边距解决了我的问题:

<Page
  x:Name="mainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="using:LearnOneNote"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  x:Class="LearnOneNote.MainPage"
  mc:Ignorable="d"
  Margin="-2">

变成:

<Page
  x:Name="mainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="using:LearnOneNote"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  x:Class="LearnOneNote.MainPage"
  mc:Ignorable="d">

尽管我的页面周围有一条细白线,但所有尺寸都立即开始工作。欢迎提供有关为什么这样做以及如何删除该白线的任何信息。

于 2014-06-03T18:16:59.387 回答