Сделать высоту экрана HubSection

Question

Я создаю приложение, в котором я использую элемент управления Hub, в одном из HubSections У меня есть карты Bing MapView. Я хотел бы иметь это, чтобы заполнить всю высоту экрана, как с героем HubSection, где вы только что установили HubSection.Background на ImageBrush.

Теперь я, вероятно, мог бы подстроить MapViewMargin и получить грязное и приблизительное решение, но я не уверен, что это будет работать на всех размерах экрана.

Это то, что я сейчас:

Это то, что я хотел бы:

У вас есть какие-либо идеи, как это может быть достигнуто?

Answer 1

Шаблон по HubSection умолчания содержит сетку, которая делит высоту ступицы на три строки:

1. Заполнитель для заголовка концентратора
2. водосборник HubSection в
3. Содержание В HubSection в

Если вы хотите, чтобы HubSection отображался по-разному, вы можете применить настраиваемый шаблон.

В конструкторе откройте окно схемы документа и щелкните правой кнопкой мыши на HubSection. Выберите пункт меню «Редактирование шаблона. Редактирование копирования ...». Это создаст новый HubSectionStyle с копией шаблона.

В редакторе Xaml найти шаблон (VS доставят вас прямо там) и прокрутите вниз до нижней части, где вы увидите что-то вроде:

<Grid HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <Rectangle x:Name="HubHeaderPlaceholder" Grid.Row="0"/> 
    <Button x:Name="HeaderButton" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" FontWeight="{ThemeResource HubSectionHeaderThemeFontWeight}" FontSize="{ThemeResource HubSectionHeaderThemeFontSize}" Margin="{ThemeResource HubSectionHeaderThemeMargin}" Grid.Row="1" Template="{StaticResource HeaderButtonTemplate}"/> 
    <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Grid.Row="2"/> 
</Grid> 

Вы можете изменить это, чтобы соответствовать вашим потребностям. ContentPresenter будет содержать DataTemplate HubSection, поэтому, если вы хотите, чтобы он начинался сверху, вы можете изменить его с Grid.Row 2 на Grid.Row 0 и Grid.RowSpan 3. Вы также можете удалить HeaderButton и HubHeaderPlaceHolder и сжать Grid вниз, если они вам не нужны, удалите маржу или установите «Заполнение» на 0 и т. д.

<Grid HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"> 
    <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}"/> 
</Grid>