I am working with a ListView which is grouped on one of the properties (Resource) of Data Source. My requirement is to display each group aligned horizontally with other groups but my implementation (as below) shows the groups aligned veritcally
<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>
Here is a sample of what this code results:
PSE: 0 (B) 0 (NB)
PSC: 0 (B) 0 (NB)
PM: 0 (B) 0 (NB)
EIA: 0 (B) 0 (NB)
Here is a sample of what I actually want it to look like
PSE: 0 (B) 0 (NB) PSC: 0 (B) 0 (NB) PM: 0 (B) 0 (NB) EIA: 0 (B) 0 (NB)
Any help appreciated.
In this case you should define the Panel for Group as well like:
<GroupStyle.Panel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
After the mod your xaml looks like:
<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>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With