Как я могу добавить элементы управления под XAML по умолчанию на базовой странице?

С удаленным кодом VisualStateManager для простоты XAML для базовой страницы в приложении Windows 8 выглядит следующим образом:

<!-- Back button and page title -->
<Grid> //row 0 by default
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Button x:Name="backButton" Click="GoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}"/>
    <TextBlock x:Name="pageTitle" Grid.Column="1" Text="Account Basic Info" Style="{StaticResource PageHeaderTextStyle}"/>
</Grid>

// экстравагантность VisualStateManager исключена

Итак, как я это прочитал, у меня есть сетка внутри сетки, а внутренняя сетка находится в строке 0 первой сетки; внутренняя сетка добавляет два столбца к той первой строке, в которой она находится, а затем помещает кнопку (по умолчанию в столбец 0) и текстовый блок в столбец 1.

Я хочу добавить больше элементов управления на страницу, но все мои попытки/эксперименты пока не увенчались успехом (добавление строк во внешнюю сетку, а затем добавление строк во внутреннюю сетку). Добавлять еще одну внутреннюю сетку (внутри первой внутренней сетки) кажется немного нелепым. Каков стандартный способ осуществить это (или, во всяком случае, «способ»)?


grid-layout windows-store-apps winrt-xaml
person B. Clay Shannon    schedule 04.02.2013    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Как вы указываете, вы можете добавить еще одну сетку (или StackPanel) после сетки нулевой строки:

<Grid Grid.Row="1">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Button x:Name="backButton2" Click="GoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}"/>
    <TextBlock x:Name="pageTitle2" Grid.Column="1" Text="{StaticResource AppName}" Style="{StaticResource PageHeaderTextStyle}"/>
</Grid>

Другой способ сделать это — определить больше строк в первой сетке:

<Grid.RowDefinitions>
    <!-- notice there are 4 rows now -->
    <RowDefinition Height="140"/>
    <RowDefinition Height="140"/>
    <RowDefinition Height="140"/>
    <RowDefinition Height="*"/>
</Grid.RowDefinitions>

<!-- 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}"/>
    <TextBlock x:Name="pageTitle" Grid.Column="1" Text="{StaticResource AppName}" Style="{StaticResource PageHeaderTextStyle}"/>
</Grid>

<!-- My controls are placed in explict rows using Grid.Row -->
<Button x:Name="backButton2" Grid.Row="1" Click="GoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}"/>
<TextBlock x:Name="pageTitle2" Grid.Row="2" Text="{StaticResource AppName}" Style="{StaticResource PageHeaderTextStyle}"/>
<Button x:Name="backButton3" Grid.Row="3" Click="GoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}"/>
person chue x    schedule 04.02.2013