Вопрос по wpf – Расположение элементов ListView по горизонтали
Я работаю с ListView, который сгруппирован по одному из свойств (ресурса) источника данных. Мое требование состоит в том, чтобы каждая группа была выровнена горизонтально с другими группами, но моя реализация (как показано ниже) показывает группы, выровненные по вертикали
<ListView x:Name="listViewResourceHours" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="0" SelectionMode="Single" Height="100" Width="300" >
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="GroupItem">
<StackPanel Orientation="Horizontal">
<ContentPresenter/>
<ItemsPresenter/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Label VerticalAlignment="Center" Margin="0" Content="{Binding Hours}" />
<Label VerticalAlignment="Center" Margin="2,0,0,0" Content="{Binding WorkingHoursType, Converter={StaticResource ResourceKey=hoursTypeConverter}}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Вот пример того, что этот код приводит:
PSE: 0 (B) 0 (NB)
PSC: 0 (B) 0 (NB)
PM: 0 (B) 0 (NB)
EIA: 0 (B) 0 (NB)
Вот пример того, как я хочу, чтобы он выглядел
PSE: 0 (B) 0 (NB) PSC: 0 (B) 0 (NB) PM: 0 (B) 0 (NB) EIA: 0 (B) 0 (NB)
Любая помощь приветствуется.
4
ответа
<ListBox Height="50" VerticalAlignment="Top">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
<ListBoxItem Content="aaaaaaaaaaa"/>
</ListBox>
В этом случае вы должны определить Panel для группы, например:
<GroupStyle.Panel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
После мода ваш xaml выглядит так:
<ListView x:Name="listViewResourceHours" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="0" SelectionMode="Single" Height="100" Width="300" >
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="GroupItem">
<StackPanel Orientation="Horizontal">
<ContentPresenter/>
<ItemsPresenter/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Label VerticalAlignment="Center" Margin="0" Content="{Binding Hours}" />
<Label VerticalAlignment="Center" Margin="2,0,0,0" Content="{Binding WorkingHoursType}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Спасибо гаураверма! Это сработало для меня.
Arpit Khandelwal
Вот окончательный код после следующей гауравермы
<ListView x:Name="listViewResourceHours" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" BorderThickness="0" SelectionMode="Single" Height="100" Width="500" >
<ListView.GroupStyle>
<GroupStyle>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock FontWeight="Bold" Text="{Binding Name, StringFormat={}{0}:}" />
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.ContainerStyle>
<Style TargetType="{x:Type GroupItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="GroupItem">
<StackPanel Orientation="Horizontal">
<ContentPresenter Margin="0,0,0,0" VerticalAlignment="Center" />
<ItemsPresenter Margin="0,0,0,0" VerticalAlignment="Center"/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</GroupStyle.ContainerStyle>
</GroupStyle>
</ListView.GroupStyle>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left" VerticalAlignment="Center" >
<Label VerticalAlignment="Center" Margin="0" Content="{Binding Hours}" />
<Label Name="lblWorkingHours" VerticalAlignment="Center" Margin="0,0,0,0" Content="{Binding WorkingHoursType, Converter={StaticResource ResourceKey=hoursTypeConverter}}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Правильный способ сделать это, это:
<ListView Grid.Row="4" Name="btView">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"></StackPanel>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<RadioButton Name="Octave1" Content="Octave 1"/>
<RadioButton Name="Octave2" Content="Octave 2"/>
<RadioButton Name="Octave3" Content="Octave 3"/>
<RadioButton Name="Octave4" Content="Octave 4"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
<ListItem/>
</ListView>
Похожие вопросы
Другие могут найти<a href="http://stackoverflow.com/questions/359217/how-do-i-make-wpf-listview-items-repeat-horizontally-like-a-horizontal-scrollba">this link</a> также полезно.