locked
View state not work in my MainPage RRS feed

  • Question

  • Hello people, 

    In Page MainPage snapped view state not working because not change my grid view to smaller. And in XAML I use de visual state Snapped.   But in outher page is work and change my gridview...

    My code XAML:

    <Page
    
        x:Class="PortfolioViewerApp.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:PortfolioViewerApp"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        Width="auto"
        Height="auto"
        >
    
        <!-- Cabeçalho Título  -->
        <Page.Resources>
            <CollectionViewSource
                x:Name="itemsViewSource"
                Source="{Binding Items}"/>
            <x:String x:Key="AppName">Portfólio Viewer</x:String>
    
        </Page.Resources>
    
    
        
            <!--*****Grid View que apresenta as escolas******-->
        <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" >
            <!-- Mostra o Título-->
            <TextBlock x:Name="pageTitle" Text="{StaticResource AppName}" IsHitTestVisible="false" Style="{StaticResource PageHeaderTextStyle}" VerticalAlignment="Top" Margin="80,60,60,0" />
    
    
    
            <GridView Name="GridEscolas" 
                      IsRightTapEnabled="False"  
                      ItemsSource="{Binding}" 
                      AllowDrop="True"  
                      TabIndex="1"
                      ItemClick="Event_Page"
                      IsItemClickEnabled="True" 
                      Padding="116,136,116,46"
                      Grid.RowSpan="2"
                      SelectionMode="None"
                      IsSwipeEnabled="false"
                      AutomationProperties.AutomationId="ItemsGridView"
                      AutomationProperties.Name="Items"
                      VerticalAlignment="Center" 
                      
                      >
                <GridView.ItemTemplate>
    
                    <DataTemplate>
                        <Grid HorizontalAlignment="Left" Height="330" Width="330" VerticalAlignment="Top" Background="DarkGray" Margin="10">
                          
                            <Image Margin="0" Source="{Binding imageUrl}" Stretch="Fill" Width="330" Height="330" x:Name="imagegrid" />
                            <Grid HorizontalAlignment="Left" Height="70" VerticalAlignment="Bottom" Width="330" Background="#E5231F20" >
                                <TextBlock x:Name="text"   HorizontalAlignment="Left" Foreground="White" TextWrapping="Wrap" Text="{Binding text}" VerticalAlignment="Center" FontWeight="Bold" FontSize="18" Tag="{Binding procedureName}" Margin="0,0,0,0"  FontFamily="Verdana"/>
                                <TextBlock  HorizontalAlignment="Left" Foreground="White" TextWrapping="Wrap" Text="{Binding textDetail}" VerticalAlignment="Center" FontWeight="Bold" FontSize="12" Tag="{Binding procedureName}" Margin="0,40,0,0"  FontFamily="Verdana"/>
                            </Grid>
                        </Grid>
                    </DataTemplate>
    
                </GridView.ItemTemplate>
            </GridView>
    
            <!--*****List View para o view state Snapped*****-->
    
            <ListView
              x:Name="ListEscolas"
                AutomationProperties.AutomationId="ItemsListView"
                AutomationProperties.Name="Items"
                TabIndex="1"
                Visibility="Collapsed"
                Margin="0,130,0,0"
                Padding="70,50,0,60"
                ItemClick="Event_Page"
                 IsItemClickEnabled="True"
                SelectionMode="None"
             
                ItemsSource="{Binding Source={StaticResource itemsViewSource}}" Grid.ColumnSpan="3" Grid.RowSpan="2">
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapGrid Orientation="Horizontal" MaximumRowsOrColumns="5">
                        </WrapGrid>
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>
    
                <ListView.ItemTemplate >
                    <DataTemplate >
                        <Grid Margin="6" x:Name="DatagridEmployeesTemplate"  Background="DarkGray" VerticalAlignment="Center" HorizontalAlignment="Center" Width="150" Height="150">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="160"/>
                            </Grid.RowDefinitions>
                            <StackPanel Grid.Column="1" VerticalAlignment="Top" Margin="0,0,0,0"  >                      
                                <Image Margin="0" Source="{Binding imageUrl}" Stretch="Fill" Width="150" Height="150" x:Name="imagegrid" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                <Grid HorizontalAlignment="Left" Height="50" VerticalAlignment="Bottom" Width="150" Background="#E5231F20" >
                                <TextBlock Text="{Binding text}" Style="{StaticResource TitleTextStyle}"  Foreground="Black" FontWeight="Bold" TextWrapping="NoWrap" Margin="0,120"/>
                                    </Grid>
                            </StackPanel>
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
    
            <VisualStateManager.VisualStateGroups>
    
                <!-- Visual states reflect the application's view state -->
                <VisualStateGroup x:Name="ApplicationViewStates">
                    <VisualState x:Name="FullScreenLandscape">
                        <Storyboard>
    
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GridEscolas" Storyboard.TargetProperty="Padding">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="180,136,86,56"/>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
    
                    <VisualState x:Name="Filled"/>
    
                    <!-- The entire page respects the narrower 100-pixel margin convention for portrait -->
                    <VisualState x:Name="FullScreenPortrait">
                        <Storyboard>
    
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GridEscolas" Storyboard.TargetProperty="Padding">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="200,136,86,56"/>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
    
                    <!--
                        The back button and title have different styles when snapped, and the list representation is substituted
                        for the grid displayed in all other view states
                    -->
                    <VisualState x:Name="Snapped">
                        <Storyboard>
    
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="pageTitle" Storyboard.TargetProperty="Style">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SnappedPageHeaderTextStyle}"/>
                            </ObjectAnimationUsingKeyFrames>
    
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="GridEscolas" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                            </ObjectAnimationUsingKeyFrames>
    
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListEscolas" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                            </ObjectAnimationUsingKeyFrames>
    
    
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
    
        </Grid>
    
    
    </Page>
    

    Thanks

    Friday, October 11, 2013 11:23 AM

Answers

  • Hi,

    Is your app targeting w8.0 or 8.1?

    In ur xaml, i see that your page, is just a page, and doesn't inherit from LayoutAwarePage. Usually the visualstate management is handled in LayoutAwarePage. I'd check that first.

    • Proposed as answer by Dave SmitsMVP Friday, October 11, 2013 11:46 AM
    • Marked as answer by Aurelien Mota Friday, October 11, 2013 2:32 PM
    Friday, October 11, 2013 11:30 AM

All replies

  • Hi,

    Is your app targeting w8.0 or 8.1?

    In ur xaml, i see that your page, is just a page, and doesn't inherit from LayoutAwarePage. Usually the visualstate management is handled in LayoutAwarePage. I'd check that first.

    • Proposed as answer by Dave SmitsMVP Friday, October 11, 2013 11:46 AM
    • Marked as answer by Aurelien Mota Friday, October 11, 2013 2:32 PM
    Friday, October 11, 2013 11:30 AM
  • even if you are targetting windows 8.1 you still need to change states your self. with 8 you have the layoutawarepage

    Microsoft Certified Solutions Developer - Windows Store Apps Using C#

    Friday, October 11, 2013 11:47 AM