Question

我想创建一个启动画面，其中图像和加载状态（带有进度条的文本块）位于另一个的顶部。

我写了下一段代码：

<Window 
        WindowStyle="None" ResizeMode="NoResize"
         d:DesignHeight="300" d:DesignWidth="300">
<DockPanel LastChildFill="True">
    <Grid DockPanel.Dock="Bottom" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <TextBlock Text="{Binding Text}" Grid.Row="0" Background="Transparent"/>
        <ProgressBar Maximum="100" Value="{Binding ProgressValue, Mode=OneWay}" Height="5" Grid.Row="1" IsIndeterminate="{Binding IsIndeterminate}"/>
    </Grid>
    <Image Source="{Binding ImageSource}" Stretch="None"/>
</DockPanel>

不幸的是，TextBlock仍会移除它位于顶部的部分图片。我认为原因是DockPanel，但我不知道如何以其他方式做到这一点。

Answer 1

TextBlock不会移除Image的部分内容，因为它不在其上方但在其下方。这是因为DockPanel并没有把孩子放在彼此之上。如果您想将内部Grid置于Image之上，那么最简单的解决方案是将DockPanel替换为Grid

<Grid>
    <Image Source="{Binding ImageSource}" Stretch="None" />
    <Grid Background="Transparent" VerticalAlignment="Bottom">
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>            
        <TextBlock Text="{Binding Text}" Grid.Row="0"/>
        <ProgressBar Maximum="100" Value="{Binding ProgressValue, Mode=OneWay}" Height="5" Grid.Row="1" IsIndeterminate="{Binding IsIndeterminate}"/>            
    </Grid>
</Grid>

带DockPanel的透明TextBlock

1 个答案: