更改 ListBox 的 UniformGrid 列数的最佳方法是什么？

Question

我有一个带有UniformGrid 布局的ListBox，我正在尝试更改“列”属性，但我不知道最好的方法。我尝试绑定到属性或以编程方式创建新布局，但我无法弄清楚。

<ListBox x:Name="ImagesList" ItemsSource="{Binding Path=GridImages}">
        <ListBox.ItemsPanel>

            <ItemsPanelTemplate>
                <UniformGrid IsItemsHost="True" Columns="3" VerticalAlignment="Top" />
            </ItemsPanelTemplate>

        </ListBox.ItemsPanel>
</ListBox>

当用户单击两个按钮时，我正在尝试在 1 列和 3 列之间进行更改。我尝试与Columns="{Binding Path=MyColumnCount}" 绑定，但它从未改变，并尝试设置x:Name 并从我的代码访问，但没有成功。我还尝试实例化一个新的UniformGrid，但我已经读到我需要一个工厂，所以我不能设置不同的Columns 值。

Answer 1

我想也许ItemsPanelTemplate 没有继承ListBox'DataContext，但确实如此，所以你的Binding 应该可以工作：

<ListBox x:Name="ImagesList" ItemsSource="{Binding Path=GridImages}" >
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <UniformGrid IsItemsHost="True" Columns="{Binding Path=MyColumnCount}"
                         VerticalAlignment="Top" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>

    <ListBox.ItemTemplate>
        <DataTemplate>
            <Image Source="{Binding}" />
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

试试这个简单的 ViewModel，它会在计时器上更新 MyColumnCount：

public class ImagesVM : INotifyPropertyChanged
{
    private System.Threading.Timer _timer;
    private int _colIncrementor = 0;

    public ImagesVM()
    {
        _timer = new System.Threading.Timer(OnTimerTick, null,
                                            TimeSpan.FromSeconds(1),
                                            TimeSpan.FromSeconds(1));
        _gridImages = new string[] {
            "http://www.anbg.gov.au/images/flags/semaphore/a-icon.gif",
            "http://www.anbg.gov.au/images/flags/semaphore/b-icon.gif",
            "http://www.anbg.gov.au/images/flags/semaphore/c-icon.gif",
            "http://www.anbg.gov.au/images/flags/semaphore/d-icon.gif",
            "http://www.anbg.gov.au/images/flags/semaphore/e-icon.gif",
            "http://www.anbg.gov.au/images/flags/semaphore/f-icon.gif",
        };
    }
    private void OnTimerTick(object state)
    {
        this.MyColumnCount = (_colIncrementor++ % 3) + 1;
    }

    private int _myColumnCount = 3;
    public int MyColumnCount
    {
        get { return _myColumnCount; }
        set
        {
            _myColumnCount = value;
            this.PropertyChanged(this, new PropertyChangedEventArgs("MyColumnCount"));
        }
    }

    private string[] _gridImages = null;
    public string[] GridImages
    {
        get { return _gridImages; }
    }

    public event PropertyChangedEventHandler PropertyChanged = (s, e) => { };
}