围绕图像的Silverlight文本

时间:2010-03-04 18:58:04

标签: silverlight layout

我正在尝试在图像周围包装文本,因为我会使用html float属性。有没有办法在silverlight 3中实现这个?

由于

2 个答案:

答案 0 :(得分:1)

我回过头来处理这个问题。我所知道的并不是一个好方法。虽然这很痛苦,但这会有效。

为了简化说明,为什么我们不假设图像位于页面的右上角,文本需要位于图像的左侧和下方。

首先将TextBlock和Image放在一起。

计算TextBlock的最底部点和图像的最底部点。 (使用它们的最高边距和实际高度。

虽然TextBlock较大,但您一次将一个单词移动到图像下方新创建的TextBlock中。这会产生包装文本的错觉。

    leftText.Text = textToWrap;
    bottomText.Text = string.Empty;
    Stack<string> wordsToMove = new Stack<string>();
    double imageBottomPoint = image1.ActualHeight + image1.Margin.Top;
    while ((leftText.ActualHeight + leftText.Margin.Top) > (imageBottomPoint + 14))
    {
        int lastSpace = leftText.Text.LastIndexOf(' ');
        string textToMove = leftText.Text.Substring(lastSpace).Trim();
        BlockedText.Text = leftText.Text.Remove(lastSpace);
        wordsToMove.Push(textToMove + ' ');
    }
    StringBuilder sb = new StringBuilder(bottomText.Text);
    while (wordsToMove.Count > 0)
    {
        sb.Append(wordsToMove.Pop());
    }

    bottomText.Text = sb.ToString();

答案 1 :(得分:0)

如果是WPF,则需要查看RichTextBox和FlowDocument;如果是Silverlight 4.0,则需要查看RichTextBox。

Silverlight 4.0解决方案

     <RichTextBox TextWrapping="Wrap"  IsReadOnly="False">  
       <Paragraph>  
            More text here .. 
            <InlineUIContainer>  
                <Image Source="abc.jpg"/>  
            </InlineUIContainer>   
            more and more text here;  
            <LineBreak />  
        </Paragraph>  
    </RichTextBox> 

WPF解决方案 -

<RichTextBox>
 <FlowDocument IsEnabled="true">
  <Paragraph>
    Text text ..
    <Button Margin="10,0,10,0" Content="A Button Float"/>
    More text..
  </Paragraph>
  <Paragraph TextAlignment="Center">
    <Image Source="abc.jpg"/>
     text text..
  </Paragraph>
  </FlowDocument>
</RichTextBox>