Question

我在单个列中显示了一个工作的ProgressBar。但是需要它覆盖整个行。如何实现？

这有效，ProgressBar位于单列中：

 <UserControl.Resources>
        <SolidColorBrush x:Key="DgGridLineBrush" Color="LightGray"  />

        <Style x:Key="ProgressBarStyle" TargetType="ProgressBar">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ProgressBar">
                        <Grid x:Name="PART_Track" >
                            <Rectangle x:Name="PART_Indicator" Fill="{Binding [3]}" HorizontalAlignment="Left" />
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

<DataGrid x:Name="MbpDg"  HeadersVisibility="Column" AutoGenerateColumns="False" IsReadOnly="True" CanUserAddRows="False" HorizontalAlignment="Right" ColumnHeaderHeight="20" Height="221" Margin="0,1,0,0" VerticalAlignment="Top" Width="164"
      GridLinesVisibility="None" >
<DataGrid.Columns>
    <DataGridTemplateColumn Header="Size" Width="55"> 
        <DataGridTemplateColumn.CellTemplate>
            <DataTemplate>
                <Grid>
                   <ProgressBar Value="{Binding [2], Mode=OneWay}" Style="{StaticResource ProgressBarStyle}" Minimum="0" Maximum="100"/>
                   <TextBlock Text="{Binding [2], Mode=OneWay}" HorizontalAlignment="Right"/>
                </Grid>
            </DataTemplate>
        </DataGridTemplateColumn.CellTemplate>
    </DataGridTemplateColumn>
    <DataGridTextColumn Binding="{Binding [0]}" Header="Price" Width="50"/>
    <DataGridTextColumn Binding="{Binding [1]}" Header="Qty" Width="30*"/>
</DataGrid.Columns>

我确实看到了this question，但是尝试合并它会产生绑定异常。.老实说，我真的不知道我在做什么。

 <Setter Property="DataGrid.Template">
 <Setter.Value>
     <ControlTemplate TargetType="{x:Type DataGridRow}">
         <Grid>
             <ProgressBar Value="{Binding [2], Mode=OneWay}"  Style="{StaticResource ProgressBarStyle}" Minimum="0" Maximum="100"/>
         </Grid>
     </ControlTemplate>
 </Setter.Value>

Answer 1

您必须为DataGridRow模板。首先，添加一个临时DataGridRow作为DataGrid的子项，将光标置于该元素上，然后在属性窗口中转到Miscellaneous-> Template，单击其右侧的小方块，然后选择“转换为新资源” 。这将在您的资源块中创建一个新的DataGridRow模板，然后您可以使用一种样式进行设置。（由于某种原因，它还会使行标题出现在我的计算机上，因此可以将其从模板中删除，或者只是在DataGrid上设置“ RowHeaderWidth ='0'）。

只要使进度条可见，只需将其添加为模板中SelectiveScrollingGrid的第一个子项即可（如果尚未删除第一列，则还需要将其设置为Grid。第1列）。

将所有内容放在一起，您的DataGrid声明将类似于以下内容（我添加了一个ItemsSource绑定，您可能希望将其删除）：

<DataGrid x:Name="MbpDg" ItemsSource="{Binding Items}"  HeadersVisibility="Column" AutoGenerateColumns="False" IsReadOnly="True" CanUserAddRows="False" HorizontalAlignment="Left" ColumnHeaderHeight="20" Height="221" Margin="0,1,0,0" VerticalAlignment="Top" Width="164" CanUserResizeRows="False" GridLinesVisibility="None">
    <DataGrid.Columns>
        <DataGridTextColumn Binding="{Binding [2]}" Header="Size" Width="50"/>
        <DataGridTextColumn Binding="{Binding [0]}" Header="Price" Width="50"/>
        <DataGridTextColumn Binding="{Binding [1]}" Header="Qty" Width="30*"/>
    </DataGrid.Columns>
</DataGrid>

在资源块中设置样式：

<Style TargetType="{x:Type DataGridRow}">
    <Setter Property="Template" Value="{DynamicResource DataGridRowControlTemplate1}" />
</Style>

这是模板本身：

<ControlTemplate x:Key="DataGridRowControlTemplate1" TargetType="{x:Type DataGridRow}">
    <Border x:Name="DGR_Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
        <SelectiveScrollingGrid>
            <SelectiveScrollingGrid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
            </SelectiveScrollingGrid.RowDefinitions>
            <ProgressBar HorizontalAlignment="Stretch" Value="{Binding [2]}" Minimum="0" Maximum="100"/>
            <DataGridCellsPresenter ItemsPanel="{TemplateBinding ItemsPanel}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
            <DataGridDetailsPresenter Grid.Row="1" Visibility="{TemplateBinding DetailsVisibility}">
                <SelectiveScrollingGrid.SelectiveScrollingOrientation>
                    <Binding Path="AreRowDetailsFrozen" RelativeSource="{RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type DataGrid}}">
                        <Binding.ConverterParameter>
                            <SelectiveScrollingOrientation>Vertical</SelectiveScrollingOrientation>
                        </Binding.ConverterParameter>
                    </Binding>
                </SelectiveScrollingGrid.SelectiveScrollingOrientation>
            </DataGridDetailsPresenter>
        </SelectiveScrollingGrid>
    </Border>
</ControlTemplate>

结果：

DataGrid ProgressBar跨越整行

1 个答案: