Question

我在堆栈面板中有一个文本块和一个图像，如下所示：

<StackPanel Height="Auto" Name=stackPanel" Width="Auto" Orientation="Horizontal" >
    <TextBlock Height="Auto" Name="textBlock" Width="Auto" TextWrapping="Wrap" MaxWidth="168" />
    <Image Margin="10,10,0,0" Name="image" />
</StackPanel>

因此图像位于文本块旁边。如果文本块的文本很长，则文本将被包装。现在我希望图像也会拖放一行，因此图像会保留在文本块的最后一个单词旁边。

我的想法是用if语句做到这一点：

if (textblockBlock.ActualHeight > 35)
    {
        // change margin
    }

但是这不起作用，因为当文本被包裹时，文本块的实际高度（显然）不会改变...

有人可以帮我解决这个问题吗？

Answer 1

检查文本长度，如果长度大于指定值，则更改边距

if (textblock.Text.Length>40)
    { 
     //change margin
    }

Answer 2

如果您希望图片始终位于最后一行的“底部”，只需将VerticalAlignment属性设置为Bottom：

   <Image Margin="10,10,0,0" Name="image" VerticalAlignment="Bottom" />

这将导致Image始终与底部对齐，无论TextBlock使用了多少行文本。

此外，应设置ActualHeight属性，但取决于您何时尝试读取该值，它可能无法使用。

您还可以使用RichTextBox（在电话上实际上是只读的）：

<RichTextBox MaxWidth="168" IsReadOnly="True">
    <Paragraph>
        <Run Text="This is the text from a question on Stack Overflow."/>
        <InlineUIContainer>
            <Image Source="Assets/circle.png" Width="20" Height="20" />                        
        </InlineUIContainer>
    </Paragraph>
 </RichTextBox>

有了这个，您可以直接在内容中嵌入Image。

包装文本时更改img边距

2 个答案: