Tôi không thể tưởng tượng ra giải pháp vượt trội cho điều này vì bạn đang cố gắng nhóm các nhóm. Tôi đã thực hiện một ví dụ, nhưng nó không thể thay đổi kích thước chiều rộng của cột trong itemsarea nhưng ở tiêu đề mà không sử dụng Seperators:
Code-Behind
public partial class Window1 {
public Window1() {
InitializeComponent();
this._items.Add(new Item { Name = "one", DateTime = DateTime.Today });
this._items.Add(new Item { Name = "two", DateTime = DateTime.Today.Subtract(new TimeSpan(1, 0, 0, 0)) });
this._items.Add(new Item { Name = "three", DateTime = DateTime.Today.Subtract(new TimeSpan(1, 0, 0, 0)) });
this._items.Add(new Item { Name = "four", DateTime = DateTime.Today.Add(new TimeSpan(1, 0, 0, 0)) });
this._items.Add(new Item { Name = "five", DateTime = DateTime.Today.Add(new TimeSpan(1, 0, 0, 0)) });
this.DataContext = this;
}
private ObservableCollection<Item> _items = new ObservableCollection<Item>();
public ObservableCollection<Item> Items => _items;
}
public abstract class ViewModelBase : INotifyPropertyChanged {
public event PropertyChangedEventHandler PropertyChanged;
[NotifyPropertyChangedInvocator]
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null) {
this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
public class Item : ViewModelBase {
private string _name;
private DateTime _dateTime;
public string Name {
get {
return this._name;
}
set {
if (value == this._name)
return;
this._name = value;
this.OnPropertyChanged();
}
}
public DateTime DateTime {
get {
return this._dateTime;
}
set {
if (value.Equals(this._dateTime))
return;
this._dateTime = value;
this.OnPropertyChanged();
}
}
}
Grouping với nguồn
<Window.Resources>
<CollectionViewSource x:Key="CollectionViewSource" Source="{Binding Items}">
<CollectionViewSource.GroupDescriptions>
<PropertyGroupDescription PropertyName="DateTime" />
</CollectionViewSource.GroupDescriptions>
</CollectionViewSource>
</Window.Resources>
ListBox
<ListBox ItemsSource="{Binding Source={StaticResource CollectionViewSource}}" Width="400" Height="200">
<ListBox.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<GridViewColumnHeader Content="{Binding Name}"/>
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.Panel >
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</ListBox.GroupStyle>
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter>
<Setter Property="VerticalContentAlignment" Value="Stretch"></Setter>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderBrush="DarkGray" BorderThickness="0,0,1,0" Margin="-6,-2,-6,-2">
<StackPanel Margin="6,2,6,2">
<TextBlock Text="{Binding Name}"/>
</StackPanel>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Điểm mấu chốt của giải pháp này là sử dụng GridViewColumnHeader
làm tiêu đề cho GroupStyle.
Có lẽ giải pháp tốt hơn có thể là thay đổi ListBox thành ListView và đặt View
-Property thành GridView
của ListView. Điều này đòi hỏi phải thay đổi datastructure của bạn mặc dù.
Note
nhóm của ListBox không bao giờ có nghĩa là để thực hiện công tác bạn đang cố gắng làm. Cách mặc định với listbox và nhóm là phải có tăng thể trong lĩnh vực nội dung của ListBox như mô tả here
Tôi không có chuyên gia, nhưng bạn cũng không nên thêm 'Dấu tách' vào' MụcPanelTemplate'? –
Vui lòng cung cấp mã XAML đầy đủ. Nó sẽ được dễ dàng hơn để tăng lên trên nó và tìm thấy một giải pháp thực nghiệm. – Kilazur