2009-12-04 9 views
8

Vorrei modificare il contenuto della superficie principale (il materiale sottostante al nastro stesso) in un'applicazione WPF quando si fa clic su una barra multifunzione. Sto usando il nastro dell'ufficio, non è molto importante. Quindi quale controllo contenitore WPF dovrei usare, e come lo farei? Dovrei avere solo vari controlli con visibilità nascosta, o cosa. Non sono un esperto del WPF quindi ho bisogno di un po 'di ispirazione.Nastro WPF, modifica il contenuto principale quando è selezionato ribbontab

+1

Penso che secondo ULA di Microsoft, non puoi usare l'interfaccia utente della barra multifunzione che può cambiare il contenuto della superficie principale quando cambi scheda. Ogni scheda dovrebbe avere solo i pulsanti della barra degli strumenti e non modificare l'aspetto del contenuto. –

+0

Non sono sicuro che tu abbia ragione. Pensa a come funziona Word, quando cambi modalità di visualizzazione. –

+0

Klaus, puoi fornire maggiori dettagli su come hai risolto questo problema? – l33t

risposta

11

Ill la prefazione dicendo che dubito che questo sia il modo migliore per farlo.

Questo è il mio stile per RibbonTab notare IsSelected è destinata a IsSelected nel modello di visualizzazione

<!-- RibbonTab --> 
     <Style TargetType="{x:Type ribbon:RibbonTab}"> 
      <Setter Property="ContextualTabGroupHeader" Value="{Binding ContextualTabGroupHeader}" /> 
      <Setter Property="Header" Value="{Binding Header}" /> 
      <Setter Property="ItemsSource" Value="{Binding GroupDataCollection}" /> 
      <Setter Property="IsSelected" Value="{Binding IsSelected}" /> 
     </Style> 

Questo è un codice vista del modello

public bool IsSelected 
    { 
     get 
     { 
      return _isSelected; 
     } 

     set 
     { 
      if (_isSelected != value) 
      { 
       _isSelected = value; 
       OnPropertyChanged(new PropertyChangedEventArgs("IsSelected")); 
      } 
     } 
    } 
    private bool _isSelected; 

Nel costruttore per la TabViewModel prendo un parametro per la il ViewModel del contenuto

public TabData(ISelectedContentTab content) 
     : this(content.DisplayName) 
    { 
     _selectedContent = content; 
    } 

    private ISelectedContentTab _selectedContent; 

Quindi ho utilizzato un ItemsCon Trol per visualizzare il contenuto selezionato nel mio XAML

<ItemsControl Grid.Row="1" VerticalContentAlignment="Stretch" VerticalAlignment="Stretch" 
        ItemsSource="{Binding ElementName=ribbon,Path=SelectedItems}" 
        ItemTemplate="{StaticResource ContentControlTemplate}" /> 

E la ContentControlTemplate che ho è

<DataTemplate x:Key="ContentControlTemplate"> 
      <Grid> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="*" /> 
       </Grid.RowDefinitions> 
       <ContentControl Grid.Row="0" VerticalAlignment="Stretch" Height="Auto" VerticalContentAlignment="Stretch" Content="{Binding SelectedContent}" /> 
      </Grid> 
     </DataTemplate> 

assicurarsi di avere un DataTemplate puntando il contenuto da una vista

Spero che questo aiuti anche.

+1

Si prega di fornire maggiori dettagli! Questi frammenti di codice non sono sufficienti per rendere la mia giornata :) – l33t

1

So che questo è un thread più vecchio, ma ho riscontrato un problema con questo e non ho trovato alcun aiuto di vb.net, ma ho scoperto una soluzione per conto mio ... quindi eccolo qui:

Assegna un nome al tuo RibbonTab in modo che tu possa gestirlo nel codice sottostante. So che ci sono diversi modi per aggiungere viste e controlli, ma ecco cosa ho fatto ... Ho semplicemente aggiunto una nuova griglia per la mia vista all'interno della griglia principale dopo la barra multifunzione. vale a dire:

<r:RibbonWindow> 
    <Grid> 
    <r:Ribbon> 
     <r:RibbonTab Name="Tab1" Header="Home"> 
     <r:RibbonGroup Name="Group1"> 
      <r:RibbonButton LargeImageSource="images\icon.png" Label="Click Me"/> 
     </r:RibbonGroup> 
     </r:RibbonTab> 
     <r:RibbonTab Name="Tab2" Header="Other Tab"> 
     <r:RibbonGroup Name="Group2"> 
      <r:RibbonButton LargeImageSource="images\icon.png" Label="Click Me"/> 
     </r:RibbonGroup> 
     </r:RibbonTab> 
    </r:Ribbon> 
    <Grid Name="Tab1RTB" Grid.Row="1" Visibility="Hidden"> 
     <RichTextBox Margin="5" BorderBrush="LightGray" BorderThickness="1"/> 
    </Grid> 
    <Grid Name="Tab2RTB" Grid.Row="1" Visibility="Hidden"> 
     <RichTextBox Margin="5" BorderBrush="LightGray" BorderThickness="1"/> 
    </Grid> 
    </Grid> 
</r:RibbonWindow> 

Poi il codice dietro (VB.NET)

Private Sub TabChanged(sender As System.Object, e As SelectionChangedEventArgs) Handles ribbonHome.SelectionChanged 
    If Tab1.IsSelected = True Then 
    Tab1RTB.Visibility = Windows.Visibility.Visible 
    Tab2RTB.Visibility = Windows.Visibility.Collapsed 
    ElseIf Tab2.IsSelected = True 
    Tab1RTB.Visibility = Windows.Visibility.Collapsed 
    Tab2RTB.Visibility = Windows.Visibility.Visible 
    Else 
    Tab1RTB.Visibility = Windows.Visibility.Collapsed 
    Tab2RTB.Visibility = Windows.Visibility.Collapsed 
    End If 
End Sub 
2

Credo che ci sia un modo più semplice per farlo. L'ho fatto in questo modo:

<Frame NavigationUIVisibility="Hidden" x:Name="FrmMainFrame" DockPanel.Dock="Bottom"/> 

E nel codice dietro:

mainWindowView.RibMain.SelectionChanged += RibMain_SelectionChanged; 

void RibMain_SelectionChanged(object sender, System.Windows.Controls.SelectionChangedEventArgs e) 
    { 
     var tab = this.mainWindowView.RibMain.SelectedItem as RibbonTab; 
     if (tab.Header.Equals("Explorer")) 
     { 
      mainWindowView.FrmMainFrame.Navigate(explorerController.View()); 
     } 
     else 
      mainWindowView.FrmMainFrame.NavigationService.Navigate(new Uri("http://www.google.com/")); 
    } 
7

L'idea è quella di avere il contenuto al di sotto del nastro sovrapposti a strati, (come in Photoshop o qualsiasi altro editor grafico) e mostra solo lo strato di cui hai bisogno in questo momento. Basta legare Visibility del vostro livello di IsSelected proprietà della scheda desiderata

MainGrid ecco un contenitore per strati (che sono troppo Grids):

<Grid x:Name="MainGrid"> 
     <Grid Visibility="{Binding IsSelected, Converter={StaticResource BooleanToVisibilityConverter}, ElementName=ribbonTab2}"> 
      <Image x:Name="ImgMain" Source="x.jpg"/> 
     </Grid> 
     <Grid Visibility="{Binding IsSelected, Converter={StaticResource BooleanToVisibilityConverter}, ElementName=ribbonTab1}"> 
      <Image x:Name="ImgXtra" Source="y.jpg"/> 
     </Grid> 
    </Grid> 

... e non è necessario alcun codice affatto !

P.S.Oh, mi dimentico che devi dichiarare in risorse ovviamente

+0

Semplice se non è necessario collegare tutto. Bastava aggiungere alle risorse. – dvdhns

Problemi correlati