ListBox滚动条使用Grid.IsSharedSizeScope

时间:2015-11-21 18:29:14

标签: c# wpf listbox sharedsizegroup issharedsizescope

我需要使用ListBox

显示包含标题的表格

我在网上搜索了如何创建这个,我发现this回答,这是我创建的XAML代码:

<Grid Grid.Row="1" Grid.IsSharedSizeScope="True">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"></RowDefinition>
        <RowDefinition Height="6*"></RowDefinition>
    </Grid.RowDefinitions>
    <Grid Grid.Row="0" ShowGridLines="True">
        <Grid.ColumnDefinitions>
            <ColumnDefinition SharedSizeGroup="quantityColumn"></ColumnDefinition>
            <ColumnDefinition SharedSizeGroup="priceColumn"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition SharedSizeGroup="editColumn"></ColumnDefinition>
            <ColumnDefinition SharedSizeGroup="deleteColumn"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Column="0" Foreground="#5a5a5a" TextAlignment="Center" Margin="1" VerticalAlignment="Center">Cantidad</TextBlock>
        <TextBlock Grid.Column="1" Foreground="#5a5a5a" TextAlignment="Center" Margin="1" VerticalAlignment="Center">Precio</TextBlock>
        <TextBlock Grid.Column="2" Foreground="#5a5a5a" TextAlignment="Center" Margin="1" VerticalAlignment="Center">Descripción</TextBlock>
        <TextBlock Grid.Column="3" Foreground="#5a5a5a" TextAlignment="Center" Margin="1" VerticalAlignment="Center">Editar</TextBlock>
        <TextBlock Grid.Column="4" Foreground="#5a5a5a" TextAlignment="Center" Margin="1" VerticalAlignment="Center">Eliminar</TextBlock>
    </Grid>
    <ListBox Grid.Row="1" HorizontalContentAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Hidden" ScrollViewer.VerticalScrollBarVisibility="Auto" Name="OrderList" Background="Transparent" BorderBrush="{x:Null}" ManipulationBoundaryFeedback="OrderList_ManipulationBoundaryFeedback">
        <ListBox.ItemContainerStyle>
            <Style TargetType="{x:Type ListBoxItem}">
                <Setter Property="Focusable" Value="False"/>
                <EventSetter Event="RequestBringIntoView" Handler="ListBoxItem_RequestBringIntoView"/>
            </Style>
        </ListBox.ItemContainerStyle>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid ShowGridLines="True">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition SharedSizeGroup="quantityColumn"></ColumnDefinition>
                        <ColumnDefinition SharedSizeGroup="priceColumn"></ColumnDefinition>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                        <ColumnDefinition SharedSizeGroup="editColumn"></ColumnDefinition>
                        <ColumnDefinition SharedSizeGroup="deleteColumn"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <TextBlock Grid.Column="0" Foreground="White" TextAlignment="Center" Margin="7">Cantidad</TextBlock>
                    <TextBlock Grid.Column="1" Foreground="White" TextAlignment="Center" Margin="7">Precio</TextBlock>
                    <TextBlock Grid.Column="2" Foreground="White" TextAlignment="Center" Margin="7">Descripción</TextBlock>
                    <TextBlock Grid.Column="3" Foreground="White" TextAlignment="Center" Margin="7">Editar</TextBlock>
                    <TextBlock Grid.Column="4" Foreground="White" TextAlignment="Center" Margin="7">Eliminar</TextBlock>
                </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
</Grid>

这是我为测试和填充ListBox

而创建的c#代码
List<OrderItem> orders = new List<OrderItem>();
orders.Add(new OrderItem() { a = "wash", b = "b" });
orders.Add(new OrderItem() { a = "the", b = "c" });
orders.Add(new OrderItem() { a = "car", b = "d" });
orders.Add(new OrderItem() { a = "wash", b = "b" });
OrderList.ItemsSource = orders;

由于ListBox仅显示4行,因此不必设置滚动条,并且标题几乎与表格列100%对齐:

enter image description here

当我向ListBox添加更多行并且滚动条出现时,问题会恶化:

enter image description here

正如您可以看到每个列的偏移量,其标题太大了。如何告诉Grid.IsSharedSizeScope注意滚动条的宽度并将其视为标题宽度?我需要的是让表格列与表格标题100%对齐。

0 个答案:

没有答案