如何使用文本块在 xaml 网格上设置可滚动条

Question

XAML 新手，我尝试设置垂直和水平滚动条，但它们没有出现。网格如下：

                                    <Grid ScrollViewer.HorizontalScrollBarVisibility="Visible">
                                        <Grid.RowDefinitions>
                                            <RowDefinition/>
                                            <RowDefinition/>
                                        </Grid.RowDefinitions>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="110"/>
                                            <ColumnDefinition Width="60"/>
                                            <ColumnDefinition Width="90"/>
                                            <ColumnDefinition Width="60"/>
                                            <ColumnDefinition Width="80"/>
                                            <ColumnDefinition Width="50"/>
                                        </Grid.ColumnDefinitions>

                                        <TextBlock Grid.Row="0" Grid.Column="0" Style="{DynamicResource Resource}" Text="{l:LocText CustomerStats_Last24Hours}"></TextBlock>
                                        <TextBlock Grid.Row="0" Grid.Column="1" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.Count}"></TextBlock>
                                        <TextBlock Grid.Row="0" Grid.Column="2" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.TotalAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
                                        <TextBlock Grid.Row="0" Grid.Column="3" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.CheckCurrency}"></TextBlock>
                                        <TextBlock Grid.Row="0" Grid.Column="4" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.AverageAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
                                        <TextBlock Grid.Row="0" Grid.Column="5" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.Percentage, StringFormat='{}{0:0}%'}"></TextBlock>

                                        <TextBlock Grid.Row="1" Grid.Column="0" Style="{DynamicResource Resource}" Text="{l:LocText CustomerStats_Last7Days}"></TextBlock>
                                        <TextBlock Grid.Row="1" Grid.Column="1" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.Count}"></TextBlock>
                                        <TextBlock Grid.Row="1" Grid.Column="2" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.TotalAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
                                        <TextBlock Grid.Row="1" Grid.Column="3" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.CheckCurrency}"></TextBlock>
                                        <TextBlock Grid.Row="1" Grid.Column="4" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.AverageAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
                                        <TextBlock Grid.Row="1" Grid.Column="5" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.Percentage, StringFormat='{}{0:0}%'}"></TextBlock>

我尝试执行以下操作：

ScrollViewer.HorizontalScrollBarVisibility="Visible"

在网格上无济于事。

有没有办法添加滚动条？

Answer 1

Grid 不支持滚动功能。对于您想要的内容，您需要将 Grid 包装在 ScrollViewer 内：

<ScrollViewer HorizontalScrollBarVisibility="Visible">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition/>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="110"/>
                <ColumnDefinition Width="60"/>
                <ColumnDefinition Width="90"/>
                <ColumnDefinition Width="60"/>
                <ColumnDefinition Width="80"/>
                <ColumnDefinition Width="50"/>
            </Grid.ColumnDefinitions>

            <TextBlock Grid.Row="0" Grid.Column="0" Style="{DynamicResource Resource}" Text="{l:LocText CustomerStats_Last24Hours}"></TextBlock>
            <TextBlock Grid.Row="0" Grid.Column="1" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.Count}"></TextBlock>
            <TextBlock Grid.Row="0" Grid.Column="2" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.TotalAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
            <TextBlock Grid.Row="0" Grid.Column="3" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.CheckCurrency}"></TextBlock>
            <TextBlock Grid.Row="0" Grid.Column="4" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.AverageAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
            <TextBlock Grid.Row="0" Grid.Column="5" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last24Hours.Percentage, StringFormat='{}{0:0}%'}"></TextBlock>

            <TextBlock Grid.Row="1" Grid.Column="0" Style="{DynamicResource Resource}" Text="{l:LocText CustomerStats_Last24Hours}"></TextBlock>
            <TextBlock Grid.Row="1" Grid.Column="1" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.Count}"></TextBlock>
            <TextBlock Grid.Row="1" Grid.Column="2" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.TotalAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
            <TextBlock Grid.Row="1" Grid.Column="3" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.CheckCurrency}"></TextBlock>
            <TextBlock Grid.Row="1" Grid.Column="4" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.AverageAmount, StringFormat='{}$ {0:0,0.00}'}"></TextBlock>
            <TextBlock Grid.Row="1" Grid.Column="5" Style="{DynamicResource Resource}" Text="{Binding CustomerSummaryStats.Last7Days.Percentage, StringFormat='{}{0:0}%'}"></TextBlock>
        </Grid>
    </ScrollViewer>

那么它会产生这样的结果：