1

WinRTアプリを作成しています。

しかし、視覚的な状態を作成すると（例：スナップ）、アプリをデバッグするときに機能しません。

私のページの設定：

<common:LayoutAwarePage
x:Name="pageRoot"
x:Class="Jukebox.Windows8Metro.LoginPage"
DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Jukebox.Windows8Metro"
xmlns:common="using:Jukebox.Windows8Metro.Common"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Style="{StaticResource LayoutRootStyle}" Background="#FF00A99E">
    <Grid VerticalAlignment="Top" Height="768">
        <TextBlock x:Name="textBlock" TextWrapping="Wrap" Text="Let's get started" FontSize="44" FontFamily="Assets/Fonts/Oswald/Oswald-Bold.ttf#Oswald" Margin="34,285,34,0" VerticalAlignment="Top" HorizontalAlignment="Center" Foreground="#FFE6E6E6"/>
        <TextBlock TextWrapping="Wrap" Text="Sign in with a Microsoft account" FontSize="30" FontFamily="Oswald" Margin="0,375,0,0" VerticalAlignment="Top" HorizontalAlignment="Center" Foreground="#FFED197A" Visibility="Collapsed"/>
        <TextBlock TextWrapping="Wrap" Text="Sign in with a Facebook account" FontSize="30" FontFamily="Oswald" Margin="0,450,0,0" VerticalAlignment="Top" HorizontalAlignment="Center" Foreground="#FF17AA9E" Visibility="Collapsed"/>
        <TextBlock TextWrapping="Wrap" Text="Sign in" FontSize="30" FontFamily="Oswald" Margin="0,525,0,0" VerticalAlignment="Top" HorizontalAlignment="Center" Foreground="#FFED197A" Visibility="Collapsed"/>
        <Image x:Name="image3" HorizontalAlignment="Center" Height="178" Margin="0,90,0,0" VerticalAlignment="Top" Width="501" Source="Assets/WideLogoHiresTransparant.png"/>
        <Image x:Name="image2" HorizontalAlignment="Center" Height="53" Margin="0,375,0,0" VerticalAlignment="Top" Width="316" Source="Assets/LoginButtons/LoginMS.png" Stretch="Fill" Tapped="LoginMicrosoft" />
        <Image x:Name="image" HorizontalAlignment="Center" Height="53" Margin="0,450,0,0" VerticalAlignment="Top" Width="316" Source="Assets/LoginButtons/LoginFB.png" Stretch="Fill" Tapped="LoginFacebook" />
        <Image x:Name="image1" HorizontalAlignment="Center" Height="53" Margin="0,525,0,0" VerticalAlignment="Top" Width="316" Source="Assets/LoginButtons/Login.png" Stretch="Fill" Tapped="Login" />
        <ProgressRing x:Name="pgWait" Height="100" Width="100" Foreground="#FFED197A"/>
    </Grid>
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="ApplicationViewStates">
            <VisualState x:Name="FullScreenLandscape"/>
            <VisualState x:Name="Filled"/>
            <VisualState x:Name="FullScreenPortrait">
                <Storyboard></Storyboard>
            </VisualState>
            <VisualState x:Name="Snapped">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="image">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>284.4</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="image">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>47.7</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="image1">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>284.4</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="image1">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>47.7</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="image2">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>284.4</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="image2">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>47.7</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="textBlock">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>252</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="textBlock">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>60</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <DoubleAnimation Duration="0" To="39" Storyboard.TargetProperty="(TextBlock.FontSize)" Storyboard.TargetName="textBlock" d:IsOptimized="True"/>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="image3">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>292</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="image3">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <x:Double>103</x:Double>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="image3">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Thickness>0,119,0,0</Thickness>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="image3">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <HorizontalAlignment>Stretch</HorizontalAlignment>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="textBlock">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <HorizontalAlignment>Stretch</HorizontalAlignment>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="image2">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <HorizontalAlignment>Stretch</HorizontalAlignment>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="image">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <HorizontalAlignment>Stretch</HorizontalAlignment>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="image1">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <HorizontalAlignment>Stretch</HorizontalAlignment>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.HorizontalAlignment)" Storyboard.TargetName="pgWait">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <HorizontalAlignment>Stretch</HorizontalAlignment>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="image2">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="textBlock">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Thickness>34,252,34,0</Thickness>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="image2">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Thickness>18,342,18,0</Thickness>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="image">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Thickness>18,415,18,0</Thickness>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="image1">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Thickness>18,488,18,0</Thickness>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</Grid>

（状態は記録によって生成されます）短い：フォートテスト私はいくつかのことを行っています、画像から幅と高さを変更し、配置を変更します

私は何が欠けていますか？とても小さなことだと思いますが、何がわかりません。

4

2 に答える 2

2

この投稿のおかげで、私は自分の問題を解決しました。 Windows8MetroでSnapにプログラムで応答する方法

それが良い解決策かどうかはわかりませんが、機能します。

だから私はコンストラクターをこれに変更しました：

public LoginPage()
{
    this.InitializeComponent();
    // Register for the window resize event
    Window.Current.SizeChanged += WindowSizeChanged;  
}

ウィンドウサイズ変更イベントは状態を処理し、正しい状態をアクティブにします。

private void WindowSizeChanged(object sender, Windows.UI.Core.WindowSizeChangedEventArgs e)
{
    // Obtain view state by explicitly querying for it
    ApplicationViewState viewState = ApplicationView.Value;
    if (viewState == ApplicationViewState.Filled)
    {
        System.Diagnostics.Debug.WriteLine("viewState is Filled");
    }
    else if (viewState == ApplicationViewState.FullScreenLandscape)
    {
        System.Diagnostics.Debug.WriteLine("viewState is FullScreenLandscape");
    }
    else if (viewState == ApplicationViewState.Snapped)
    {
        System.Diagnostics.Debug.WriteLine("viewState is Snapped");
        //Activate the Snapped state
        VisualStateManager.GoToState(this, "Snapped", true);
    }
    else if (viewState == ApplicationViewState.FullScreenPortrait)
    {
        System.Diagnostics.Debug.WriteLine("viewState is FullScreenPortrait");
    }
    else
    {
        System.Diagnostics.Debug.WriteLine("viewState is something unexpected");
    }
}

たぶん、問題を解決するためのより良い方法がありますか？

于 2013-03-17T17:00:15.830 に答える
1

あなたの問題を解決するためのより良い方法があります。ビジュアルステートをレイアウトルート（確かにグリッド）に追加する必要があります。

<common:LayoutAwarePage
    x:Name="pageRoot"
    x:Class="MyApp.LoginPage"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Jukebox.Windows8Metro"
    xmlns:common="using:Jukebox.Windows8Metro.Common"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
      <Grid x:Name="LayoutRoot"> 
        <Grid x:Name="foo">
            <!--Your stuff-->
        </Grid>
        <VisualStateManager.VisualStateGroups>    
            <VisualStateGroup x:Name="ApplicationViewStates">
                <VisualState x:Name="FullScreenLandscape"/>
                <VisualState x:Name="Filled"/>
                <VisualState x:Name="FullScreenPortrait"/>
                <VisualState x:Name="Snapped">
                    <Storyboard>
                        <!--Sample-->
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="foo" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Grid>
</common:LayoutAwarePage>

コードビハインドで視覚的な状態を処理することは避けてください。ページが彼の視覚的状態を変更すると（たとえばスナップするために）、ビューはスナップセクションで提供したもので更新されます（このサンプルでは、​​何も変更されません。単に「表示」を削除して「折りたたまれた」を追加できます。また、グリッドに1つの色を追加して、変更を確認します）。

于 2013-03-17T18:07:52.780 に答える