Question

我试图让我的ListBoxItems的背景由ProgressBar构成，但“Z-Index”的东西似乎并不适合我。我已经读过Grid不支持Z-Index（如Canvas）的地方，默认情况下，元素按照添加的顺序呈现。这也是我个案中明显发生的事情。但是当我点击列表框项目时，我的TextBlock（见下文）消失了，显然是因为ProgressBar出现在前面。有趣的是，另一个孩子控制（图像和动画）不会消失，所以我有点不解。

这是我的ListBox的ItemTemplate：

<ListBox.ItemTemplate>
    <DataTemplate>
        <Grid Name="ListBoxGrid">
            <Grid.RowDefinitions>
                <RowDefinition Height="100"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="100"/>
            </Grid.ColumnDefinitions>
            <ProgressBar Grid.Column="0" Grid.ColumnSpan="3" Background="White" Value="{Binding Path=SendProgress}" />
            <Image Width="50" Stretch="Uniform" Grid.Column="0" HorizontalAlignment="Center" Margin="20,0,0,0" VerticalAlignment="Center" Source="{Binding Image}" />
            <TextBlock FontSize="16" Grid.Column="1" VerticalAlignment="Center" Text="{Binding Path=ImageFilePath, Padding="20,0,0,0" />
            <Canvas Grid.Column="2">
                <Image Canvas.Left="25" Canvas.Top="25" Width="50" Height="50" Source="{Binding Status}" />
                <my:LoadingAnimation HorizontalAlignment="Center" VerticalAlignment="Center" Width="100" Height="100" Canvas.Left="5" Canvas.Top="5" Visibility="{Binding IsSending, Converter={StaticResource BooleanToVisibilityConverter1}}" />
            </Canvas>
        </Grid>
    </DataTemplate>
</ListBox.ItemTemplate>

Answer 1

Panel.ZIndex属性适用于我示例代码：

<Grid>
    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Panel.ZIndex="2">
        <Button Name="goButton" Height="30" Width="50" Margin="0,10,0,50" Click="goButton_Click">GO!</Button>
        <ProgressBar Name="progressBar" Width="300" Height="30" />
    </StackPanel>

        <Label VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="100" Content="SHOWTHIS" Panel.ZIndex="1"/>
</Grid>

如果我理解得很好，也许Style Datatriggers的可见性在这种情况下可能会有用 datatemplate的每个元素的示例代码：

<Image>
    <Image.Style>
        <Style TargetType="{x:Type Image}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsSending}" Value="True">
                    <Setter Property="Visibility" Value="Collapsed"/>
                </DataTrigger>
                <DataTrigger Binding="{Binding IsSending}" Value="False">
                    <Setter Property="Visibility" Value="Visible"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Image.Style>
</Image>

WPF：向ListBox项添加ProgressBar

1 个答案: