2016-06-16 7 views
3

Ich muss dem Endbenutzer eine Liste mit Vorschlägen anzeigen. Ich möchte das 1. Element auf der Liste am einfachsten zu lesen, das 2. Element sollte ein bisschen kleiner und 3. Element noch kleiner sein.WPF-Liste mit der gewünschten Größe

  • Artikel bei Index 0 müssen groß sein und der gesamte Text ist ganz schwarz
  • Artikel bei Index 1 etwas kleiner sein und der gesamte Text in erster Linie schwarz ist, aber mit einigen grauen darin
  • Artikel bei Index 2 und höher haben eher klein sein und der gesamte Text ist grau

Beispiel

Like this

Ich benutze WPF, habe aber noch keinen Weg gefunden, dies zu tun.

Zur Zeit habe ich:

<ListView ItemsSource="{Binding MyList}" Height="auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" Background="Transparent"> 
<ListView.ItemTemplate> 
    <DataTemplate> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="75"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <Label Grid.Column="0" Content="{Binding SomeText}"/> 
      <Label Grid.Column="1" Content="{Binding MoreText}"/> 
     </Grid> 
    </DataTemplate> 
</ListView.ItemTemplate> 

Dies erzeugt nur eine flache Liste jedes Element Größe gleich waren.

Ich habe mir AlternationCount + ItemsControl.AlternationIndex angesehen, aber diese werden sich abwechseln, was nicht das ist, was ich will, ich möchte eine spezielle 1. und 2. Reihe, und der Rest der Reihen sind gleich.

BEARBEITEN LÖSUNG Dank @Adrian Faciu für die Lösung.

Es sieht wie folgt aus:

<ItemsControl ItemsSource="{Binding MyList}" AlternationCount="1000" ScrollViewer.VerticalScrollBarVisibility="Disabled" Background="Transparent"> 
<ItemsControl.Resources> 
    <Style TargetType="{x:Type Label}"> 
     <Setter Property="Foreground" Value="Red"></Setter> 
     <Style.Triggers> 
      <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="0"> 
       <Setter Property="Foreground" Value="Green"></Setter> 
       <Setter Property="FontSize" Value="20" /> 
      </DataTrigger> 
      <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="1"> 
       <Setter Property="Foreground" Value="Yellow"></Setter> 
       <Setter Property="FontSize" Value="15" /> 
      </DataTrigger> 
     </Style.Triggers> 
    </Style> 
</ItemsControl.Resources> 
<ItemsControl.ItemTemplate> 
    <DataTemplate> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="75"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <Label Grid.Column="0" Content="{Binding MyText}"/> 
      <Label Grid.Column="1" Content="{Binding AnotherText}"/> 
     </Grid> 
    </DataTemplate> 
</ItemsControl.ItemTemplate> 

Antwort

3

Sie auf dem richtigen Weg sind. Sie können das Alter auf die Länge Ihrer Sammlung binden dann einen Stil für die Standardelemente erstellen und es für die ersten Zeilen ändern:

<Style x:Key="differentItemsStyle" TargetType="{x:Type Label}"> 
    <Setter Property="Foreground" Value="Red"></Setter> 
    <Style.Triggers> 
     <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="0"> 
      <Setter Property="Foreground" Value="Green"></Setter> 
     </DataTrigger> 
     <DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource TemplatedParent}}" Value="1"> 
      <Setter Property="Foreground" Value="Yellow"></Setter> 
     </DataTrigger> 
    </Style.Triggers> 
</Style> 

In Ihrem Beispiel würden Sie einen Standardstil für Option C, D, E, die Sie überschreiben können, wie Sie für Option A und Option B wünschen

bearbeiten um diese Arbeit für ListBox machen die Bindungsbedürfnisse geändert werden:

<DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource AncestorType=ListBoxItem}}" Value="1"> 
    <Setter Property="Foreground" Value="Yellow"></Setter> 
</DataTrigger> 

Siehe this answer für weitere Informationen.

+0

Ich kann das nicht zur Arbeit bringen. Sie sind alle grün (wie sie alle AlternationIndex = 0 sind).Ich habe den Listview so eingestellt, dass er einen AlternationCount = "1000" hat. –

+0

Es sieht so aus, als bestünde ein Problem mit AlternationIndex und ListView. Siehe hier: http://stackoverflow.com/questions/19491318/why-does-listbox-alternationindex-always-return-0 –

+0

Verwenden Sie den Link, und mit dem ItemsController anstelle von Listview gearbeitet! :) –

1

Ich denke, dass Sie eine Eigenschaft Ihrer Klasse hinzufügen und binden sie mit Schriftgröße des Labels.

XAML:

<ListView ItemsSource="{Binding MyList}" Height="auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" Background="Transparent"> 
      <ListView.ItemTemplate> 
       <DataTemplate> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="75"/> 
         </Grid.ColumnDefinitions> 
         <Label Grid.Column="0" FontSize="{Binding FontSize}" Foreground="{Binding Foreground}" Content="{Binding Name}"/> 
        </Grid> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 

Ansichtsmodell:

MyList = new List<ListItems>(); 
     MyList.Add(new ListItems() { Name = "Option A", FontSize = 20, Foreground = Brushes.Black }); 
     MyList.Add(new ListItems() { Name = "Option B", FontSize = 15, Foreground = Brushes.Black }); 
     MyList.Add(new ListItems() { Name = "Option C", FontSize = 8, Foreground = Brushes.Gray }); 
     MyList.Add(new ListItems() { Name = "Option D", FontSize = 8, Foreground = Brushes.Gray }); 
     MyList.Add(new ListItems() { Name = "Option E", FontSize = 8, Foreground = Brushes.Gray }); 
Verwandte Themen