Windows 10 UWP App中的ContentPresenter無法擴展到全寬

Question

我有一個包含列表視圖和內容演示者的母版/詳細信息頁面。 我的問題是，當文本塊的內容小於當前窗口時，內容呈現器不會填充父網格的整個剩余空間。

我嘗試同時添加Horizo​​ntalAlign ='Stretch'和VerticalAlign ='Stretch'，但是沒有任何效果。

這是MasterDetailPage.xaml的代碼

<Page.Resources>
    <DataTemplate x:Key="MasterListViewItemTemplate" x:DataType="data:List">
        <Grid Margin="0,11,0,13">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <TextBlock Text="{x:Bind Title}" Style="{ThemeResource BaseTextBlockStyle}" />

            <TextBlock Style="{ThemeResource CaptionTextBlockStyle}"
                Text="{x:Bind Date}"
                Grid.Column="1"
                Margin="12,1,0,0" />
        </Grid>
    </DataTemplate>

    <DataTemplate x:Key="DetailContentTemplate" x:DataType="data:List">
        <ScrollViewer VerticalScrollBarVisibility="Auto">
            <StackPanel
                Orientation="Vertical"
                Margin="0,9,12,9">
                <TextBlock
                Margin="0,8"
                Style="{ThemeResource TitleTextBlockStyle}"
                TextWrapping="WrapWholeWords"
                Text="{x:Bind Title}"/>

                <RichTextBlock
                x:Name="textContent"
                IsTextSelectionEnabled="True"
                TextWrapping="WrapWholeWords"
                common:Html2TextParser.Html="{x:Bind Content}"/>
            </StackPanel>
        </ScrollViewer>
    </DataTemplate>

    <DataTemplate x:Key="comboListTemplate" x:DataType="data:Combo">
        <TextBlock Text="{x:Bind Title}"/>
    </DataTemplate>
</Page.Resources>

<Grid x:Name="LayoutRoot" Loaded="LayoutRoot_Loaded" UseLayoutRounding="True">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="AdaptiveStates" CurrentStateChanged="AdaptiveStates_CurrentStateChanged">
            <VisualState x:Name="DefaultState">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="720" />
                </VisualState.StateTriggers>
            </VisualState>

            <VisualState x:Name="NarrowState">
                <VisualState.StateTriggers>
                    <AdaptiveTrigger MinWindowWidth="0" />
                </VisualState.StateTriggers>

                <VisualState.Setters>
                    <Setter Target="MasterColumn.Width" Value="*" />
                    <Setter Target="DetailColumn.Width" Value="0" />
                    <Setter Target="MasterListView.SelectionMode" Value="None" />
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>
        <ColumnDefinition x:Name="MasterColumn" Width="320" />
        <ColumnDefinition x:Name="DetailColumn" Width="*" />
    </Grid.ColumnDefinitions>

    <ComboBox 
        Name="comboList" 
        Margin="2,2,2,2"
        ItemsSource="{x:Bind comboSource.combos}"
        LayoutUpdated="comboList_LayoutUpdated"
        SelectionChanged="comboList_SelectionChanged"
        ItemTemplate="{StaticResource comboListTemplate}" 
        HorizontalAlignment="Stretch" />

    <ListView
        x:Name="MasterListView" ItemsSource="{x:Bind listSource.lists}"
        Grid.Row="1"
        ItemContainerTransitions="{x:Null}"
        ItemTemplate="{StaticResource MasterListViewItemTemplate}"
        IsItemClickEnabled="True"
        ItemClick="MasterListView_ItemClick">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>

    <ContentPresenter
        x:Name="DetailContentPresenter"
        Grid.Column="1"
        Grid.RowSpan="2"
        BorderThickness="1,0,0,0"
        BorderBrush="{ThemeResource SystemControlForegroundBaseLowBrush}"
        Content="{x:Bind MasterListView.SelectedItem, Mode=OneWay}"
        ContentTemplate="{StaticResource DetailContentTemplate}" 
        HorizontalAlignment="Stretch" 
        VerticalAlignment="Stretch" 
        Margin="12,0,0,0">
        <ContentPresenter.ContentTransitions>
            <!-- Empty by default. See MasterListView_ItemClick -->
            <TransitionCollection />
        </ContentPresenter.ContentTransitions>
    </ContentPresenter>
</Grid>

誰能解決這個問題？ 這是我的問題的屏幕截圖。

Answer 1

您可以嘗試將contentpresenter放在ViewBox中。 ViewBox旨在拉伸和縮放單個孩子以填充可用空間。

這里的文件

希望對您有所幫助：）

Answer 2

我測試了您的xaml，但無法重現您的問題，請查看屏幕截圖，藍色的空間是您的contentPresenter，橙色的空間是ScrollViewer，最后是帶有虛擬文本的文本塊。

Answer 3

在為ContentPresenter和主網格本身設置不同的顏色后，我發現甚至我的主網格“ LayoutRoot”都沒有擴展到全寬！

原因是我使用的是SplitView，並且正在SpiltView的Content元素內導航MasterDetailPage.xaml。 我只是為SplitView設置Horizo​​ntalAlign ='Stretch' ，它解決了我的問題！