WPF UniformGrid动态含量

Question

我有一个统一的网格，我想动态地显示内容/视图。它可以显示1、2、4或6内容。我设置了均匀网格行、col绑定和内容可见性绑定。这在视图/内容的情况下不起作用，但在矩形的情况下是有效的。为什么会这样呢？如何修改它以处理视图/内容。样本MainWindow.xaml代码.

<StackPanel>
    <ComboBox HorizontalAlignment="Left" Width="50" SelectedIndex="{Binding SelectedIndex}">
        <ComboBoxItem IsSelected="True" Content="1" />
        <ComboBoxItem Content="2" />
        <ComboBoxItem Content="4" />
        <ComboBoxItem Content="6" />
    </ComboBox>

    <!-- NOT CORRECT, SHOWS 6 ITEMS ALWAYS -->
    <UniformGrid Rows="{Binding ScreenRows}" Columns="{Binding ScreenCols}">
        <local:ScreenView Grid.Row="0" Grid.Column="0" Visibility="{Binding VisibleScreen[0]}" />
        <local:ScreenView Grid.Row="0" Grid.Column="1" Visibility="{Binding VisibleScreen[1]}" />
        <local:ScreenView Grid.Row="0" Grid.Column="2" Visibility="{Binding VisibleScreen[2]}" />
        <local:ScreenView Grid.Row="1" Grid.Column="0" Visibility="{Binding VisibleScreen[3]}" />
        <local:ScreenView Grid.Row="1" Grid.Column="1" Visibility="{Binding VisibleScreen[4]}" />
        <local:ScreenView Grid.Row="1" Grid.Column="2" Visibility="{Binding VisibleScreen[5]}" />
    </UniformGrid>

    <!-- OK, SHOWS 1,2,4, or 6 RECT DEPENDING ON SelectedIndex -->
    <UniformGrid Rows="{Binding ScreenRows}" Columns="{Binding ScreenCols}">
        <Rectangle Width="20" Height="20" Grid.Row="0" Grid.Column="0" Fill="Red" Visibility="{Binding VisibleScreen[0]}" />
        <Rectangle Width="20" Height="20" Grid.Row="0" Grid.Column="1" Fill="Orange" Visibility="{Binding VisibleScreen[1]}" />
        <Rectangle Width="20" Height="20" Grid.Row="0" Grid.Column="2" Fill="Yellow" Visibility="{Binding VisibleScreen[2]}" />
        <Rectangle Width="20" Height="20" Grid.Row="1" Grid.Column="0" Fill="Green" Visibility="{Binding VisibleScreen[3]}" />
        <Rectangle Width="20" Height="20" Grid.Row="1" Grid.Column="1" Fill="Blue" Visibility="{Binding VisibleScreen[4]}" />
        <Rectangle Width="20" Height="20" Grid.Row="1" Grid.Column="2" Fill="Violet" Visibility="{Binding VisibleScreen[5]}" />
    </UniformGrid>

</StackPanel>

基本上，我有一个组合框。如果选择1，我的ViewModel将动态地更改rows=1、cols=1，其中第一个内容可见，而其他内容则崩溃。它适用于矩形，但不适用于视图。为什么会这样呢？如何修复它，使其适用于视图？

任何好奇的人，以下是MainWindowViewModel中的代码(Prism MVVM)

class MainWindowViewModel : BindableBase
{
    private const int SCREEN_MAX = 6;

    private int screenRows = 1;
    public int ScreenRows
    {
        get { return screenRows; }
        set { SetProperty(ref screenRows, value); }
    }

    private int screenCols = 1;
    public int ScreenCols
    {
        get { return screenCols; }
        set { SetProperty(ref screenCols, value); }
    }

    private Visibility[] visibleScreen = new Visibility[SCREEN_MAX];
    public Visibility[] VisibleScreen
    {
        get { return visibleScreen; }
        set { SetProperty(ref visibleScreen, value); }
    }

    private int selectedIndex;
    public int SelectedIndex
    {
        get { return selectedIndex; }
        set 
        { 
            SetProperty(ref selectedIndex, value);
            ChangeScreen(selectedIndex);                    
        }
    }

    private void ShowScreens(int num_screens)
    {
        // make all collapse
        for (int i = 0; i < SCREEN_MAX; i++)
            VisibleScreen[i] = Visibility.Collapsed;

        // show only X num screens
        for (int i = 0; i < num_screens; i++)
            VisibleScreen[i] = Visibility.Visible;

        RaisePropertyChanged("VisibleScreen");
    }

    public void ChangeScreen(int idx)
    {
        switch (idx)
        {
            case 0: ScreenRows = 1; ScreenCols = 1; ShowScreens(1); break;
            case 1: ScreenRows = 1; ScreenCols = 2; ShowScreens(2); break;
            case 2: ScreenRows = 2; ScreenCols = 2; ShowScreens(4); break;
            case 3: ScreenRows = 2; ScreenCols = 3; ShowScreens(6); break;
        }
    }
}

The ScreenView.xaml

<UserControl...>
    <!-- SOME HOW IT IS THIS DATACONTEXT CODE MESS UP THE UI -->
    <UserControl.DataContext>
        <local:ScreenViewModel x:Name="vm"/>
    </UserControl.DataContext>
    <StackPanel>
        <TextBlock>TEST</TextBlock>
    </StackPanel>
</UserControl>

样本输出

​

​

从样本输出中可以看到，我的组合体选择是1，所以它应该显示1测试，而1平方显示的是正确的。但它为什么要给我看6次测试？如何使它显示1次测试？

这是一个核心输出

​

​

谢谢!

Answer 1

selectedIndex的初始值为0( int字段的默认值)。但是VisibleScreen数组的内容与selectedIndex不匹配--您需要在初始化期间调用ChangeScreen，例如：

public MainWindowViewModel()
{
    SelectedIndex = 0;
}

顺便说一句，Grid.Row和Grid.Column对UniformGrid没有影响。UniformGrid按照添加的顺序排列项目

不要在DataContext中设置UserControls。

而不是Visibility[]创建ScreenViewModel of in MainWindowViewModel (ObservableCollection<ScreenViewModel>)的集合。

在bool IsVisible中添加ScreenViewModel属性。

更改ShowScreens方法如下：

private void ShowScreens(int num_screens)
{
    for (int i = 0; i < SCREEN_MAX; i++)
        VisibleScreen[i].IsVisible = i < num_screens ? Visibility.Visible : Visibility.Collapsed;
}

更改视图：

<ItemsControl ItemsSource="{Binding VisibleScreen}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
             <UniformGrid Rows="{Binding ScreenRows}" Columns="{Binding ScreenCols}"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <local:ScreenView Visibility="{Binding IsVisible}"/>
    </ItemsControl.ItemTemplate>
</ItemsControl>

ItemTemplate将为VisibleScreen集合中的每个项创建一个本地:屏幕视图，并将其分配给本地:屏幕视图的DataContext