Windows应用商店应用不缩放

时间:2014-06-02 20:42:11

标签: c# windows-store-apps winrt-xaml multi-dimensional-scaling

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

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

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

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

标题图片未显示:

Title Not Showing

标题显示的图片:

Title Showing

这是我的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页面:

Scaling to Pixel Density
Resizing to Narrow Layouts
Support Multiple Screen Sizes

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

我的简化程序以文件here

提供

我的图片可用here

2 个答案:

答案 0 :(得分:2)

我认为你不能在动画中有绑定。我会尝试两个单独的TextBlocks绑定到不同的值,并在视觉状态故事板中替换Visibility这些,如果您想要区分不同的视图。

答案 1 :(得分: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">

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