2013-01-21 14 views
8

Jestem całkiem nowy dla C#, pierwszą rzeczą, którą próbuję wykonać jest ListView z powiązaniami danych, które okazało się ok.ListView z TreeViewItems w Xaml

Próbuję teraz, aby elementy miały przycisk przekręcenia, jeśli podstawowy model ma dowolne potomstwo (np. TreeView). Każde z dzieci będzie miało kolumny takie same jak wszystkie elementy najwyższego poziomu.

Jak miałbym to zrobić? Czy istnieje już taka kontrola? Jeśli nie, lepiej byłoby przebrać się za TreeView, aby wyglądać jak ListView, lub ubierać ListView, aby wyglądać jak TreeView?

zszedłem z drogi opisanej w niniejszym solution który ubiera się TreeView, ale efekt końcowy wygląda całkiem straszne i nagłówek jest właściwie tylko przedmiot, więc można stracić wszystkie ładne zaklejania kolumny i kolumn przyciski, które można podłączyć do sortowania kolumn, które dostajesz w ListView, więc trasa rzeczywiście wydaje się być bardziej pracą.

Zauważyłem, że nowy menedżer zadań ma kontrolę dokładnie taką, jaką próbuję utworzyć, nie wiem, jak to się stało? prawdopodobnie w C jednak.

ListView with TreeView items

Odpowiedz

3

co opisujesz brzmi trochę jak TreeListView, a jeśli google „WPF TreeListView” widać pewne rozwiązania, które mogą być dobre dla Ciebie. Użyłem jednego z Telerik, ale może to być przesada w zależności od tego, jak skomplikowane są twoje potrzeby.

Jeśli chcesz tylko jeden poziom podrzędny, taki jak obraz, który połączyłeś, możesz po prostu rzucić własną, używając ListView ze złożonym DataTemplate dla pierwszej kolumny, która będzie pokazywać przycisk ekspandera i prosty ListBox związany z przedmioty dziecięce.

Podobny do answer here, z wyjątkiem tego, że twoja komórka miałaby pole wyboru, które wyglądałoby jak strzałka, tekst dla elementu i lista podrzędna. Następnie połącz widoczność podrzędnego obiektu ListBox ze stanem pola wyboru.

10

Firma Microsoft dostarcza próbkę, która wydaje się być tym, czego szukasz. Odpisy-up na przykład można znaleźć tutaj:

http://msdn.microsoft.com/en-us/library/vstudio/ms771523(v=vs.90).aspx

Kiedy zbudować i uruchomić przykład będzie w końcu z czegoś przypominającego to:

enter image description here

Istnieje duża ilość szablonów wykonanych w przykładzie, dzięki czemu będziesz mógł wyglądać tak, jak chcesz.

+0

+1 odsyłające Family Guy :) – bouvierr

+0

Nie byłem” Zawsze złe, wiesz. –

8

Prawdopodobnie byłoby łatwiej Style z ListView, miałem szybką grę i udało mi się stworzyć makietę w około 10min.

enter image description here

Oczywiście będziemy chcieli dodać więcej do niego, ale wydaje się dość łatwe do zorganizowania TreeView wewnątrz kolumny ListView.

Tutaj znajduje się kod makiety, jeśli chcesz użyć do budowania.

Xaml:

<Window x:Class="WpfApplication8.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="233" Width="405" Name="UI"> 
    <Grid DataContext="{Binding ElementName=UI}"> 
     <ListView ItemsSource="{Binding Processes}" > 
      <ListView.View> 
       <GridView> 
        <GridViewColumn Header="Process" Width="200" > 
         <GridViewColumn.CellTemplate> 
          <DataTemplate> 
           <StackPanel> 
            <TreeView BorderThickness="0" ItemsSource="{Binding Processes}" > 
             <TreeView.ItemTemplate> 
              <HierarchicalDataTemplate ItemsSource="{Binding Processes}"> 
               <TextBlock Text="{Binding Name}" /> 
              </HierarchicalDataTemplate> 
             </TreeView.ItemTemplate> 
            </TreeView> 
           </StackPanel> 
          </DataTemplate> 
         </GridViewColumn.CellTemplate> 
        </GridViewColumn> 
        <GridViewColumn Header="CPU" > 
         <GridViewColumn.CellTemplate> 
          <DataTemplate> 
           <TextBlock Text="{Binding CpuUsage, StringFormat={}{0} %}" TextAlignment="Right" /> 
          </DataTemplate> 
         </GridViewColumn.CellTemplate> 
        </GridViewColumn> 
        <GridViewColumn Header="Memory" > 
         <GridViewColumn.CellTemplate> 
          <DataTemplate> 
           <TextBlock Text="{Binding MemUsage, StringFormat={}{0} MB}" TextAlignment="Right" /> 
          </DataTemplate> 
         </GridViewColumn.CellTemplate> 
        </GridViewColumn> 
       </GridView> 
      </ListView.View> 
      <ListView.ItemContainerStyle> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="VerticalContentAlignment" Value="Top" /> 
       </Style> 
      </ListView.ItemContainerStyle> 
     </ListView> 
    </Grid> 
</Window> 

Kod: przepraszam za treeible ładowania danych makieta :)

public partial class MainWindow : Window 
    { 
     private ObservableCollection<ProcessInfo> _processes = new ObservableCollection<ProcessInfo>(); 

     public MainWindow() 
     { 
      InitializeComponent(); 
      Processes.Add(new ProcessInfo 
      { 
       CpuUsage = 10.3, 
       MemUsage = 48.9, 
       Processes = new ObservableCollection<Process>() 
      }); 
      var pro = new Process{ Name = "Process1", Processes = new ObservableCollection<Process>()}; 
      pro.Processes.Add(new Process { Name = "SubProcess1", Processes = new ObservableCollection<Process>() }); 
      Processes[0].Processes.Add(pro); 
      Processes.Add(new ProcessInfo 
      { 
       CpuUsage = 0, 
       MemUsage = 100, 
       Processes = new ObservableCollection<Process>() 
      }); 
      var pro2 = new Process { Name = "Process2", Processes = new ObservableCollection<Process>() }; 
      pro2.Processes.Add(new Process { Name = "SubProcess1", Processes = new ObservableCollection<Process>() }); 
      pro2.Processes.Add(new Process { Name = "SubProcess2", Processes = new ObservableCollection<Process>() }); 
      pro2.Processes.Add(new Process { Name = "SubProcess3", Processes = new ObservableCollection<Process>() }); 
      Processes[1].Processes.Add(pro2); 
     } 

     public ObservableCollection<ProcessInfo> Processes 
     { 
      get { return _processes; } 
      set { _processes = value; } 
     } 
    } 

    public class ProcessInfo 
    { 
     public ObservableCollection<Process> Processes { get; set; } 
     public double CpuUsage { get; set; } 
     public double MemUsage { get; set; } 
    } 

    public class Process 
    { 
     public string Name { get; set; } 
     public ObservableCollection<Process> Processes { get; set; } 
    } 

Powodzenia :)