如何在windows phone中創建此UI以在連續文本環繞中顯示圖像和文本？

Question

如何在Windows Phone中創建這種UI，可以使用WPF中的flowdocument來完成？ 在Windows Phone中是否有任何flowdocument控件可用，並且還有其他方法嗎？

Answer 1

我創建了一個解決這個問題。通過測量文本，您可以手動拆分的文字兩個部分組成>

<Grid Width="400"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto" /> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition Height="Auto" /> 
    </Grid.RowDefinitions> 
    <Image x:Name="WrapContent" Width="200" Height="192" /> 
    <TextBlock x:Name="RightTextBlock" Width="200" FontSize="24" FontFamily="Segoe WP" TextWrapping="Wrap" Grid.Column="1" /> 
    <TextBlock x:Name="BottomTextBlock" Width="400" FontSize="24" FontFamily="Segoe WP" TextWrapping="Wrap" Grid.Row="1" Grid.ColumnSpan="2" /> 
</Grid> 

public MainPage() 
{ 
    InitializeComponent(); 

    string text = "Lorem ipsum dolor sit amet consectetur adipiscing elit. Lorem ipsum dolor sit amet consectetur adipiscing elit. Lorem ipsum dolor sit amet consectetur adipiscing elit. Lorem ipsum dolor sit amet consectetur adipiscing elit. Lorem ipsum dolor sit amet consectetur adipiscing elit. Lorem ipsum dolor sit amet consectetur adipiscing elit."; 
    string[] words = text.Split(' '); 
    RightTextBlock.Text = words[0]; 

    for (int i = 0; i < words.Length; i++) 
    { 
     string word = words[i]; 
     string previousText = RightTextBlock.Text; 
     RightTextBlock.Text += " " + word; 
     if (RightTextBlock.ActualHeight > WrapContent.ActualHeight) 
     { 
      RightTextBlock.Text = previousText; 
      BottomTextBlock.Text += String.Join(" ", words.Skip(i)); 
      break; 
     } 
    } 
}