WP7 wraping texto alrededor de la imagen

windows-phone-7 windows-phone-7.1

Question

Tengo este código:

<ScrollViewer x:Name="textScroller" Grid.Row="2">
        <Grid x:Name="ContentPanel" Margin="12,0,12,0" DataContext="{Binding}">
        <Image x:Name="ImageUrl" Source="{Binding ImageUrl}" Height="198" Width="150" Margin="10 10 10 10" FlowDirection="RightToLeft" HorizontalAlignment="Left" VerticalAlignment="Top"  />
        <TextBlock x:Name="Content" Text="{Binding Content}" TextWrapping="Wrap" Style="{StaticResource PhoneTextNormalStyle}" Margin="0,41,24,-41" LineStackingStrategy="BlockLineHeight"  MaxWidth="478"  />
        </Grid>
</ScrollViewer>

La imagen en este código es el fondo de ese bloque de texto, pero quiero que el texto se ajuste alrededor del imgae. ¿Es posible? Encontré esta pregunta similar y hay respuesta, no es posible solo con image y textblock. ¿Es correcto? Realmente no puedo establecer algún atributo en la imagen que establece que el texto no puede estar en la imagen? ¿Cómo debería cambiar mi código? Gracias

Editar: Ahora así es como se ve mi página:

Quiero que el texto esté en el lado derecho de la imagen y debajo de la imagen.

Answer 1

Es un duplicado del texto envolvente WP7 alrededor de la imagen y el texto de Silverlight alrededor de una imagen , aunque tampoco estas preguntas obtuvieron respuestas aceptadas. No existe tal opción en Silverlight para realizar el ajuste automático del texto alrededor de las imágenes. Puede usar un componente WebBrowser o usar múltiples TextBlocks midiendo el tamaño del texto mientras agrega palabras a los TextBlocks en la memoria y verifica cuándo detenerse y cambiar a otro TextBlock. También recomiendo leer un artículo sobre métricas de fuentes - MSDN - UI Frontiers: Font Metrics en Silverlight, Charles Petzold .

EDITAR: muestra codificada:

Puede usar el siguiente código para hacer lo que pregunta de forma codificada. Tal vez podría escribir algún código que lo hiciera funcionar como control, dividiendo automáticamente el texto al detectar la altura del TextBlock anidado que está al lado del Rectangle (o Imagen).

<RichTextBox
    VerticalAlignment="Top"
    >
    <Paragraph
        TextAlignment="Left">
        <InlineUIContainer>
            <InlineUIContainer.Child>
                <Rectangle
                    Width="50"
                    Height="50"
                    Fill="Red" />
            </InlineUIContainer.Child>
        </InlineUIContainer>
        <InlineUIContainer>
            <Border>
                <TextBlock
                    Padding="0"
                    Width="370"
                    Margin="0,0,0,-5"
                    TextWrapping="Wrap"
                    Text="First part of text that fits to the right of the image before the other part wraps to">
                </TextBlock>
            </Border>
        </InlineUIContainer>
        <Run
            Text="the next line. This part of the text is already below the image." />
    </Paragraph>
</RichTextBox>