Question

我正在创建Windows 8商店应用程序。在我的应用程序中，我有一个Bottom AppBar，我正在打开新页面，我在其中显示网格，如示例网格应用程序中所示。但不幸的是我的页面无法显示（仅限顶部后退按钮的名称是可见的，其余部分包括网格不可见）。我不知道为什么？我已经尝试了几乎所有的东西，请帮助我，我已经添加了代码供参考。

<common:LayoutAwarePage
x:Name="pageRoot"
x:Class="MyApp.Reader"
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:MyApp"    
xmlns:data="using:MyApp.Data"
xmlns:common="using:MyApp.Common"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Page.Resources>

    <!-- TODO: Delete this line if the key AppName is declared in App.xaml -->
    <x:String x:Key="AppName">My Application</x:String>

    <CollectionViewSource
        x:Name="groupedItemsViewSource"
        Source="{Binding Groups}"
        IsSourceGrouped="true"
        ItemsPath="TopItems"
        d:Source="{Binding AllGroups, Source={d:DesignInstance Type=data:SampleDataSource, IsDesignTimeCreatable=True}}"/>
</Page.Resources>

<!--
    This grid acts as a root panel for the page that defines two rows:
    * Row 0 contains the back button and page title
    * Row 1 contains the rest of the page layout
-->
<Grid Style="{StaticResource LayoutRootStyle}">
    <Grid.RowDefinitions>
        <RowDefinition Height="140"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.Background>
        <ImageBrush ImageSource="Assets/background.jpg"/>
    </Grid.Background>

    <GridView
        x:Name="itemGridView"
        AutomationProperties.AutomationId="ItemGridView"
        AutomationProperties.Name="Grouped Items"
        Grid.RowSpan="2"
        Padding="116,137,40,46"
        ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
        ItemTemplate="{StaticResource Standard250x80ItemTemplate}"
        SelectionMode="None"
        IsSwipeEnabled="false" >

        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
        <GridView.GroupStyle>
            <GroupStyle>
                <GroupStyle.HeaderTemplate>
                    <DataTemplate>
                        <Grid Margin="1,0,0,6">
                            <Button
                                AutomationProperties.Name="Group Title"
                                Style="{StaticResource TextPrimaryButtonStyle}" >
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="{Binding Title}" Margin="3,-7,10,10" Style="{StaticResource GroupHeaderTextStyle}" />
                                    <TextBlock Text="{StaticResource ChevronGlyph}" FontFamily="Segoe UI Symbol" Margin="0,-7,0,10" Style="{StaticResource GroupHeaderTextStyle}"/>
                                </StackPanel>
                            </Button>
                        </Grid>
                    </DataTemplate>
                </GroupStyle.HeaderTemplate>
                <GroupStyle.Panel>
                    <ItemsPanelTemplate>
                        <VariableSizedWrapGrid Orientation="Vertical" Margin="0,0,80,0"/>
                    </ItemsPanelTemplate>
                </GroupStyle.Panel>
            </GroupStyle>
        </GridView.GroupStyle>
    </GridView>

    <ListView
        x:Name="itemListView"
        AutomationProperties.AutomationId="ItemListView"
        AutomationProperties.Name="Grouped Items"
        Grid.Row="1"
        Visibility="Collapsed"
        Margin="0,-10,0,0"
        Padding="10,0,0,60"
        ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
        ItemTemplate="{StaticResource Standard80ItemTemplate}"
        SelectionMode="None"
        IsSwipeEnabled="false"
        IsItemClickEnabled="True">

        <ListView.GroupStyle>
            <GroupStyle>
                <GroupStyle.HeaderTemplate>
                    <DataTemplate>
                        <Grid Margin="7,7,0,0">
                            <Button
                                AutomationProperties.Name="Group Title"
                                Style="{StaticResource TextPrimaryButtonStyle}">
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Text="{Binding Title}" Margin="3,-7,10,10" Style="{StaticResource GroupHeaderTextStyle}" />
                                    <TextBlock Text="{StaticResource ChevronGlyph}" FontFamily="Segoe UI Symbol" Margin="0,-7,0,10" Style="{StaticResource GroupHeaderTextStyle}"/>
                                </StackPanel>
                            </Button>
                        </Grid>
                    </DataTemplate>
                </GroupStyle.HeaderTemplate>
            </GroupStyle>
        </ListView.GroupStyle>
    </ListView>

    <!-- Back button and page title -->
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Button x:Name="backButton" Click="GoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}" VerticalAlignment="Center"/>           
        <TextBlock Grid.Column="1" Style="{StaticResource PageHeaderTextStyle}" Text="{StaticResource AppName}" TextWrapping="Wrap" VerticalAlignment="Center" Height="40" Width="Auto"/>
    </Grid>
    <VisualStateManager.VisualStateGroups>

        <VisualStateGroup x:Name="ApplicationViewStates">
            <VisualState x:Name="FullScreenLandscape"/>
            <VisualState x:Name="Filled"/>

            <VisualState x:Name="FullScreenPortrait">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="backButton" Storyboard.TargetProperty="Style">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PortraitBackButtonStyle}"/>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>


            <VisualState x:Name="Snapped">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="backButton" Storyboard.TargetProperty="Style">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SnappedBackButtonStyle}"/>
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="pageTitle" Storyboard.TargetProperty="Style">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SnappedPageHeaderTextStyle}"/>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</Grid>

这与示例（新项目 - ＆gt;网格应用程序（XAML））几乎相同。在appbar按钮上单击我打开新页面

 private void Next_Click_1(object sender, RoutedEventArgs e)
 {
    this.Frame.Navigate(typeof(Reader), "AllGroups");
 }

在必须显示的页面上，我已添加

 protected override void OnNavigatedTo(NavigationEventArgs e)
 {
    var sampleDataGroups = SampleDataSource.GetGroups(e.Parameter.ToString());
    this.DefaultViewModel["Groups"] = sampleDataGroups;
 }

其余代码与示例几乎相同。我正在正确获取'sampleDataGroups'的数据，但不知道为什么我的页面在Grid中不可见？

Answer 1

Okes由于提供了DataContext而发生了。

DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"

所以我删除了这个以完成工作，并且它工作正常。这是因为我们已经在内部提供了绑定，所以不需要将绑定添加到DefaultViewModel

网格视图不可见

1 个答案: