高度文本块的高度图像

Question

我有图片和 3 个文本块。我想在左边放置图像，在右边的行中放置 3 个 TextBlock。我试过这个：

<Grid x:Name="Grid">
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Image Grid.RowSpan="3" 
                Source="image.jpg" Stretch="Uniform" HorizontalAlignment="Left" VerticalAlignment="Top"/>
            <TextBlock Grid.Column="1" 
                Text="11"
                FontSize="25"/>
            <TextBlock Grid.Column="1" 
                Grid.Row="1"
                Text="22"/>
            <TextBlock Grid.Column="1" 
                Grid.Row="2"
                Text="33" FontSize="14"/>
        </Grid>

但是当图像很大时，行之间的 space 很大。我该怎么做？

Answer 1

我会尝试制作一个 1 行 2 列的网格。

我会在第一列放置图片。

在第二列中，我将放置一个垂直流动的堆栈面板。然后将文本块添加到堆栈面板。

Answer 2

如果您希望图像保持其大小...只需去掉网格行并将 TextBlock 放入垂直 StackPanel 中即可。

如果您想调整图像大小，使其与 3 个 TextBlock 具有相同的高度...您可以将图像的高度绑定到放置 TextBlock 的任何容器的 ActualHeight，如下所示：

 <Grid x:Name="Grid">
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <Image Height="{Binding ActualHeight, ElementName=myStackPanel}" Source="image.jpg" Stretch="Uniform" HorizontalAlignment="Left" VerticalAlignment="Top"/>
    <StackPanel Grid.Column="1">
        <StackPanel Name="myStackPanel">
            <TextBlock Text="11" FontSize="25"/>
            <TextBlock Text="22"/>
            <TextBlock Text="33" FontSize="14"/>
        </StackPanel>
    </StackPanel>
</Grid>

高度文本块的高度图像

Height image by heights textblock

c#

wpf

grid

textblock