2012-11-20 12 views
5

Gli unici esempi che sono stati in grado di trovare on-line per il legame di testo a un WinRT RichTextBlock simile a questa:Come si associa il rich text (FlowDocument?) Dal mio modello di visualizzazione a RichTextBlock?

<RichTextBlock> 
    <Paragraph> 
     <Run Text="{Binding Content}"/> 
    </Paragraph> 
</RichTextBlock> 

Gli unici esempi sono stato in grado di trovare per il fatto che mostra il testo ricco di simile a questa:

<RichTextBlock> 
    <Paragraph> 
     <Run>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ligula nisi, vehicula nec eleifend vel, rutrum non dolor. Vestibulum ante ipsum primis in faucibus orci</Run> 
     <Run FontSize="30">luctus</Run> 
     <Run>et ultrices posuere cubilia Curae; Curabitur elementum scelerisque accumsan. In hac habitasse platea dictumst. Maecenas eu nibh vitae nibh laoreet placerat. Duis dolor ante, semper luctus ullamcorper eget, placerat et ligula. Donec placerat tincidunt vehicula. Fusce condimentum lacus quis libero blandit semper sed vel quam. Proin eget nisl lacinia nibh convallis scelerisque at sed massa. Duis commodo tincidunt consequat. Duis malesuada, nisl a pharetra placerat, odio dui suscipit quam, vitae rhoncus sem risus quis odio. Aliquam justo nunc, adipiscing id elementum sit amet, feugiat vel enim. Aliquam pharetra arcu nec elit luctus euismod. Suspendisse potenti.</Run> 
    </Paragraph> 
</RichTextBlock> 

Come potrei fare per associazione dati il ​​testo della RichTextBlock a una proprietà nel mio modello vista che può contenere più paragrafi e corre? Che tipo deve essere la proprietà del modello di visualizzazione?

Ho visto alcuni riferimenti all'uso di un FlowDocument, ma non posso dire se funzionerà con un RichTextBlock. Tuttavia, anche quegli esempi non mostrano alcun legame di dati al documento.

+0

sto passare a HTML/CSS/JavaScript per questa applicazione. La visualizzazione del testo in HTML/CSS sembra molto più semplice. Soprattutto quando vuoi più colonne. – CoderDennis

risposta

1

Ho associato i dati a RichTextBlock in uno dei miei progetti. Vedi l'XAML qui sotto. Sto vincolando alcuni valori stringa e un'immagine. Si può vedere una fotografia di come la pagina viene reso qui: enter image description here

<common:RichTextColumns x:Name="richTextColumns" Margin="117,0,117,47" VerticalAlignment="Top"> 
<RichTextBlock x:Name="richTextBlock" Width="560" Style="{StaticResource ItemRichTextStyle}" TextWrapping="Wrap"> 
    <Paragraph> 
    <Run FontSize="20" FontWeight="Light" Text="{Binding Title}"/> 
    <LineBreak/> 
    </Paragraph> 
    <Paragraph LineStackingStrategy="MaxHeight"> 
    <InlineUIContainer> 
     <ItemsControl ItemsSource="{Binding Authors}"> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
      <StackPanel Orientation="Vertical"/> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
      <StackPanel> 
       <HyperlinkButton Content="{Binding}" 
        VerticalAlignment="Center" FontSize="14" 
        Tapped="AuthorSearchLinkTapped" 
        IsTapEnabled="True" 
        Padding="0, 0, 0, 0"/> 
      </StackPanel> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
     </ItemsControl> 
    </InlineUIContainer> 
    </Paragraph> 
    <Paragraph LineStackingStrategy="MaxHeight"> 
    <InlineUIContainer> 
     <Image x:Name="image" MaxHeight="200" Margin="0,20,0,10" Stretch="Uniform" Source="{Binding ImageUrl}"/> 
    </InlineUIContainer> 
    </Paragraph> 
    <Paragraph LineStackingStrategy="MaxHeight"> 
    <InlineUIContainer> 
     <Grid Width="560" Height="125" MaxHeight="125"> 
     <TextBlock Text="Loading ad..." 
       VerticalAlignment="Center" 
       HorizontalAlignment="Center" 
       Style="{StaticResource BasicTextStyle}"/> 
     <UI:AdControl ApplicationId="ec6615c8-dc88-4413-af37-1fc3b5603e85" 
        AdUnitId="104236" 
        Width="250" Height="125" 
        HorizontalAlignment="Center"/> 
     </Grid> 
    </InlineUIContainer> 
    </Paragraph> 
    <Paragraph> 
    <Run FontWeight="SemiLight" Text="{Binding Description}"/> 
    </Paragraph> 
</RichTextBlock> 

<!-- Additional columns are created from this template --> 
<common:RichTextColumns.ColumnTemplate> 
    <DataTemplate> 
    <RichTextBlockOverflow Width="560" Margin="80,0,0,0"> 
     <RichTextBlockOverflow.RenderTransform> 
     <TranslateTransform X="-1" Y="4"/> 
     </RichTextBlockOverflow.RenderTransform> 
    </RichTextBlockOverflow> 
    </DataTemplate> 
</common:RichTextColumns.ColumnTemplate> 
</common:RichTextColumns> 
+0

Questo è essenzialmente un esempio espanso della prima opzione nella mia domanda. Se conosci il formato in fase di progettazione, è facile. Ma non vedo come ciò preveda, ad esempio, parole arbitrarie in grassetto all'interno del testo vincolato. Ho bisogno che la ricca formattazione venga fornita tramite associazione dati, non preimpostata nella pagina XAML. – CoderDennis

2

RichTextBlock non sembra fornire vincolante documento. Invece è possibile utilizzare controlli RichTextBlock personalizzati per realizzarlo. Puoi provare Bindable RichTextBlock

+0

Il controllo RichTextBox che estende in quel post del blog non sembra esistere per winRT XAML. – CoderDennis

+0

IMHO, dovrebbe funzionare ereditando da RichTextBlock anziché RichTextBox. Fateci sapere la vostra avventura con esso. – Typist

+0

Il controllo 'RichTextBlock' di Windows 8 è sigillato, quindi ereditare da esso non è un'opzione. – CoderDennis

0

Ho avuto una situazione simile. Volevo aggiornare il contenuto di un ReadText RichTextBox con messaggi di stato basati su alcune operazioni in corso. Ecco quello che ho finito per fare:

codice
<UserControl 
    x:Class="RawhideCsControl.StorageViewUserControl2" 
    <!-- > 

     <RichTextBox x:Name="StatusText" HorizontalAlignment="Left" Height="350.72" VerticalAlignment="Top" Width="636"> 
      <FlowDocument> 
       <Paragraph> 
        <Run Text="{Binding Status}"></Run> 
       </Paragraph> 
      </FlowDocument> 
     </RichTextBox> 

    <!-- > 
</UserControl> 

:

public partial class StorageViewUserControl2 : System.Windows.Controls.UserControl 
    { 
     // . . . 

     StatusChanger statusChanger = new StatusChanger(); 
     private void AddStatusLine(string format, params object[] args) 
     { 
      if (args.Length > 0) 
       format = string.Format(format, args); 

      //m_StorageViewTreeModel.MirrorStatusDisplay += string.Format("{0}\r\n", format); 
      statusChanger.Status += string.Format("{0}\r\n", format); 

     }//end this.AddStatusLine(str) 

     // . . . 
    } // end partial class 


    public class StatusChanger : INotifyPropertyChanged 
    { 
     private string status = string.Empty; 
     public string Status 
     { 
      get { return status; } 
      set 
      { 
       status = value; 
       OnPropertyChanged("Status"); 
      } 
     } 

     public event PropertyChangedEventHandler PropertyChanged; 

     public void OnPropertyChanged(string PropertyName) 
     { 
      if(PropertyChanged != null) 
       PropertyChanged(this, new PropertyChangedEventArgs(PropertyName)); 
     } 
    } // end class StatusChanger 
+0

Non riesco a vedere come questo risolva il mio problema.Questo ti permette di avere del testo in grassetto e del testo normale nei tuoi messaggi di stato? Non si mostra alcuna formattazione ricca nella risposta. Sembra lo stesso di quello che ho inserito nella mia domanda che mostra l'associazione dei dati a una stringa. – CoderDennis

1

Ho avuto lo stesso problema e la mia soluzione è quella di farlo manualmente.

  1. Iscriviti alla notifyPropertyChanged nelle view.xaml.cs
  2. Quando si verifica un aggiornamento, verificare se si tratta di vostra proprietà che è stato aggiornato
  3. Se è così, aggiornare il RichTextBlock

Ecco il codice.

private void Page_OnLoaded(object sender, RoutedEventArgs e) 
     {  
      SetReferences(); 
      (DataContext as INotifyPropertyChanged).PropertyChanged += OnPropertyChanged; 
     } 

     private void Page_OnUnloaded(object sender, RoutedEventArgs e) 
     { 
      (DataContext as INotifyPropertyChanged).PropertyChanged -= OnPropertyChanged; 
     } 

     private void OnPropertyChanged(object sender, PropertyChangedEventArgs e) 
     { 
      var propertyName = GetPropertyName<MyViewModel, object>(x => x.References); // I use this to avoid bugs at runtime 
      if (e.PropertyName == propertyName) 
       SetReferences(); 
     } 

     private void SetReferences() 
     { 
      var references = (DataContext as MyViewModel).References; 
      ReferencesRichTextBlock.Blocks.Clear(); 
      foreach (var reference in references) 
      { 
       var paragraph = new Paragraph(); 
       paragraph.Inlines.Add(new Run { Text = reference.Title, FontWeight = FontWeights.Bold}); 
       paragraph.Inlines.Add(new Run { Text = " : "}); 
       paragraph.Inlines.Add(new Run { Text = reference.Content}); 
       paragraph.Inlines.Add(new LineBreak()); 

       ReferencesRichTextBlock.Blocks.Add(paragraph); 
      } 
     } 

     public static string GetPropertyName<T, P>(Expression<Func<T, P>> action) where T : class 
     { 
      var expression = (MemberExpression)action.Body; 
      var name = expression.Member.Name; 

      return name; 
     } 

E, naturalmente, questo è il XAML

<Page ... 
     Loaded="Page_OnLoaded" 
     Unloaded="Page_OnUnloaded"> 
... 
<RichTextBlock x:Name="ReferencesRichTextBlock"> 

          </RichTextBlock> 
</Page> 
+0

Sembra promettente. Non ho mai finito l'app su cui stavo lavorando quando ho postato questa domanda e non avevo intenzione di tornare indietro, ma forse con una risposta valida proverò ancora. – CoderDennis