Visualizzazione immagini in TextBlock (WPF)

Question

Sto lavorando su una semplice applicazione di chat. Attualmente i messaggi sono binded ad una casella di riepilogo personalizzato in stile come questo (XAML semplificato):

<ListBox ItemsSource="{Binding MessageCollection}"> 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <TextBlock Text="{Binding Text}"/> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox> 

Ora vorrei essere in grado di mettere le immagini (come gli smiley grafici) nel testo del messaggio visualizzato. C'è un modo per ottenere ciò usando TextBlock (o qualsiasi altro componente standart) o devo usare un controllo speciale per questo?

Grazie in anticipo

Answer 1

Se si desidera che le immagini in realtà all'interno il testo (come un emoticon), allora si sta andando ad avere per fare un certo lavoro. Sembra una delle poche volte in cui vorrei effettivamente un controllo utente, il cui punto sarebbe quello che analizza il testo alla ricerca di valori di emoticon e crea un modello di dati al volo.

Ricorda che qualsiasi cosa si può fare in XAML si può fare in codice, in modo che il codice che sto pensando di seguirebbe questa idea generale:

1. testo di scansione per i valori emoticon e creare un elenco di valori per i dati elementi.
2. Creare un DockPanel.
3. Per inserire l'elemento nell'elenco, aggiungere un TextBlock o un'immagine (in base al valore).
4. Impostare questo.Contenuto sul DockPanel.

Penso che qualcosa del genere sia effettivamente ciò che stai cercando, ma se vuoi solo un'immagine, il suggerimento di ValueConverter funzionerà.

Answer 2

è possibile utilizzare un convertitore di valori per convertire il testo in un altro tipo che ha una lista di segmenti che sono composte di testo o la faccina (nell'ordine in cui appaiono).

Quindi, è possibile utilizzare un modello di dati per associare a quel nuovo tipo e visualizzare correttamente il testo e le faccine.

Answer 3

Utilizzare l'elemento Immagine invece di TextBlock e utilizzare un convertitore per associare il valore del testo all'immagine del sorriso.

<ListBox ItemsSource="{Binding MessageCollection}"> 
<ListBox.ItemTemplate> 
    <DataTemplate> 
     <Image Source="{Binding Text, Converter={StaticResource MyImageConverter}}"/> 
    </DataTemplate> 
</ListBox.ItemTemplate> 

Answer 4

Il contenuto di un TextBlock è sempre solo una serie di Inline, quindi è necessario utilizzare InlineUIContainer. È possibile inserire questo contenitore come uno degli Inline in TextBlock, ovunque si desideri venga visualizzata un'immagine, alternando le esecuzioni di testo. È possibile analizzare un messaggio e allo stesso tempo continuare ad aggiungere i token (testo o immagini) che si trovano alla raccolta Inlines di TextBlock.

Answer 5

Basta usare InlineUIContainer.

<TextBlock TextWrapping="Wrap"> 
    <Run>Some text.</Run> 
    <InlineUIContainer> 
     <Image Source="http://sstatic.net/stackoverflow/img/apple-touch-icon.png" Height="20"></Image> 
    </InlineUIContainer> 
    <Run>Some more text.</Run> 
</TextBlock> 

Answer 6

Ho anche incontrato questo problema di recente e ho superato questo

Creazione di un ListBox ItemTemplate contenente un ItemsControl che ha un WrapPanel nel ItemsPanelTemplate e quindi vincolante la mia stringa al ItemsSource del ItemsControl con un IValueConverter che ospita tutta la logica.

Suddividi le parole e cerca/cerca le stringhe di emoticon, i collegamenti ipertestuali, ecc. E crea il tuo oggetto TextBlock, Immagine, collegamento ipertestuale, pulsante e imposta i valori e le maniglie degli eventi.

Nella funzione creare un elenco < UIElement> e compilare l'elenco con i controlli generati e restituire l'elenco come oggetto nella funzione Converti di IValueConverter.

Perché hai il WrapPanel lì dentro, hai finito la tua confezione.