具有固定列号的平铺视图,并且可以充分调整主窗口大小

时间:2014-02-09 18:24:47

标签: c# wpf xaml uniformgrid

我正在尝试创建一个平铺视图,下面的代码会创建一个,但是当窗口调整大小时,平铺之间的空间会增长。相反,我希望瓷砖与窗户一起成长,我看了很少的地方,但我找不到它的解决方案,是否有人能够提供帮助

public class MainWindowViewModel : INotifyPropertyChanged
{
    private ObservableCollection<PersonEntity> people ;
    public ObservableCollection<PersonEntity> People
    {
        get { return people; }
        set { people = value; OnPropertyChanged("People"); }
    }

    public MainWindowViewModel()
    {
        people = new ObservableCollection<PersonEntity>();
        AddPeople();
    }

    private void AddPeople()
    {
        for (int i = 0; i < 20; i++)
        {
            people.Add( new PersonEntity() {Id=1, FirstName="A person", LastName="with surname", Address= new Address() { Id=1, Street="Somwhere", Town="Big city"}});
            people.Add(new PersonEntity() { Id = 2, FirstName = "A second person", LastName = "with second surname", Address = new Address() { Id = 2, Street = "Somehwere else", Town = "Small village" } });
        }
    }

    public event PropertyChangedEventHandler PropertyChanged = delegate { };
    private void OnPropertyChanged(string property)
    {
        PropertyChanged(this, new PropertyChangedEventArgs(property));
    }
}




public class PersonEntity
{
    public int Id { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public Address Address { get; set; }
}

public class Address
{
    public int Id { get; set; }
    public string Street { get; set; }
    public string Town { get; set; }
}

用户控制

<UserControl x:Class="WpfApplication2.Views.PersonView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:localViewModel ="clr-namespace:WpfApplication2.ViewModels"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<UserControl.DataContext>
    <localViewModel:MainWindowViewModel/>
</UserControl.DataContext>
<UserControl.Resources>
    <Style TargetType="ListBox">
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <UniformGrid  Columns="4" Grid.IsSharedSizeScope="True"/>
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <DataTemplate x:Key="MyImagesItemTemplate">
        <Grid>
            <Border BorderThickness="2" Background="LightSteelBlue" >
                <StackPanel Margin="0,0,15,0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                    <TextBlock Text="{Binding FirstName}" />
                    <TextBlock Text="{Binding LastName}" />
                    <TextBlock Text="{Binding Address.Street}" />
                </StackPanel>
            </Border>
        </Grid>
    </DataTemplate>
</UserControl.Resources>
<Grid>
    <ListBox ItemsSource="{Binding Path=People}" ItemTemplate="{StaticResource MyImagesItemTemplate}" ScrollViewer.HorizontalScrollBarVisibility="Disabled"/>
</Grid>

主窗口

<Window x:Class="WpfApplication2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525"
    xmlns:localViewModel="clr-namespace:WpfApplication2.ViewModels"
    xmlns:localViews="clr-namespace:WpfApplication2.Views">
<Grid>
    <localViews:PersonView/>
</Grid>

随着窗户的增长,我希望瓷砖能够生长。

1 个答案:

答案 0 :(得分:0)

您需要将 HorizontalContentAlignment VerticalContentAlignment 设置为 {上的 Stretch {1}} ,以便它可以根据可用空间增长。否则,它将根据其内容大小进行调整。在ListBox的ItemContainerStyle中设置值。

ListBoxItem