пользовательских ListView отобразить все элементы в одном ряду

Question

У меня есть обычай ListView, что вместо того, чтобы отображать каждый элемент в отдельной строке, отображаются все элементы в одной строке, а результат выглядит следующим образом:

Есть в настоящее время 2 элемента в этом ListView, но я не могу получить ListView, чтобы отображать каждый элемент в отдельной строке. Здесь есть ListView код:

<ListView BorderThickness="0" ItemContainerStyle="{StaticResource ListItemStyle}" Name="LoginRegister"> 
       <ListView.ItemTemplate> 
        <DataTemplate> 
         <Grid Margin="2"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="1*"></ColumnDefinition> 
           <ColumnDefinition Width="2*"></ColumnDefinition> 
          </Grid.ColumnDefinitions> 
          <Image Source="/Application/Resources/Icons/user.png" Width="20" Grid.Column="0" /> 
          <TextBlock 
           Foreground="{StaticResource BaseGrey}" 
           Grid.Column="1" 
           TextAlignment="Left" 
           FontWeight="Light" 
           VerticalAlignment="Center" Text="{Binding UserName}" /> 
         </Grid> 
        </DataTemplate> 
       </ListView.ItemTemplate> 
      </ListView> 

Вот ListViewItemStyle:

<Style x:Key="ListItemStyle" TargetType="ListViewItem"> 
       <Setter Property="Padding" Value="10" /> 
       <Setter Property="FontSize" Value="16" /> 
       <Style.Resources> 
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#ecf0f1" /> 
       </Style.Resources> 
       <Style.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Setter Property="Background" Value="#ecf0f1" /> 
        </Trigger> 
       </Style.Triggers> 
      </Style> 

Что может быть причиной поведения?

Answer 1

<ListView.ItemsPanel> 
    <ItemsPanelTemplate> 
     <StackPanel Orientation="Horizontal"></StackPanel> 
    </ItemsPanelTemplate> 
</ListView.ItemsPanel> 

Answer 2

Если вы хотите, чтобы показать элементы в разнесенных строк, то вы должны создать RowDefinitions, а затем ColumnDefinitions:

<ListView BorderThickness="0" ItemContainerStyle="{StaticResource ListItemStyle}" Name="LoginRegister"> 
      <ListView.ItemTemplate> 
       <DataTemplate> 
        <Grid Margin="2"> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="Auto*"/> 
          <RowDefinition Height="Auto*"/> 
         </Grid.RowDefinitions> 
         <Image Source="/Application/Resources/Icons/user.png" Width="20" Grid.Row="0" /> 
         <TextBlock 
          Foreground="{StaticResource BaseGrey}" 
          Grid.Row="1" 
          TextAlignment="Left" 
          FontWeight="Light" 
          VerticalAlignment="Center" Text="{Binding UserName}" /> 
        </Grid> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 

Answer 3

В соответствии с вашими комментариями, вопрос ваш список отображает только один из 2 предмета из вашего источника. Есть 2 простых способов исправить это в зависимости от источника:

Источник никогда не меняется один раз UI показан

В этом случае вы можете просто убедиться, что ваш источник полностью заполняется, прежде чем инициализировать окно.

public class MainWindow { 
    public List <string> People { get; set; } 

    public MainWindow() { 
     People = new List <string>(); 

     //fancy code here that fully populates People 

     InitializeComponent(); 
    } 
} 

Источник может измениться после того, пользовательский интерфейс показан

В этом случае вы можете изменить ваш источник быть или унаследовать от ObservableCollection, уведомляющий цели, когда его коллекция меняется.

public class MainWindow { 
    public ObservableCollection <string> People { get; set; } 

    public MainWindow() { 
     People = new ObservableCollection <string>(); 
     InitializeComponent(); 

     People.Add ("new person"); 

     //other code that modifies People after components are initialized 
    } 
} 

Существует больше способов, но эти 2 являются действительно легкими.