Как использовать Expander для отображения данных множественного связывания из материала проекта в WPF? - PullRequest
Новая
       43

Как использовать Expander для отображения данных множественного связывания из материала проекта в WPF?

0 голосов
/ 26 апреля 2019

вопрос выше может быть немного беспорядочным, поэтому я объясню здесь.

в настоящее время я использую Expander в моем WPF

ниже мой код 

 <materialDesign:Card Background="{DynamicResource MaterialDesignBackground}">

         <StackPanel x:Name="spItemDisplay" DataContext="{Binding itemDisplayList}">

            <Expander x:Name="expander1" HorizontalAlignment="Stretch" Header="{Binding ItemName}">

                 <StackPanel Orientation="Vertical" TextBlock.Foreground="{DynamicResource MaterialDesignBody}" Margin="24,8,24,16">
                      <Grid>
                            <Grid.ColumnDefinitions>
                               <ColumnDefinition/>
                               <ColumnDefinition/>
                             </Grid.ColumnDefinitions>
                              <Grid.RowDefinitions>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                        <RowDefinition/>
                                    </Grid.RowDefinitions>

                                    <Label FontWeight="Bold" Content="Item Code" Grid.Column="0" Grid.Row="0" />
                                    <TextBlock Text="{Binding ItemCode}" Grid.Column="1" Grid.Row="0"/>

                                    <Label FontWeight="Bold" Content="Item Name" Grid.Column="0" Grid.Row="1" />
                                    <TextBlock Text="{Binding ItemName}" Grid.Column="1" Grid.Row="1"/>

                                    <Button Click="btnRemoveItem_Click" Grid.Row="9" Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Center" Style="{StaticResource MaterialDesignFloatingActionMiniAccentButton}" Width="30" Height="30" Padding="0" Background="{x:Null}" BorderBrush="{x:Null}">
                                        <materialDesign:PackIcon Background="Transparent" Foreground="#FF3580BF" Kind="RemoveShoppingCart" Width=" 30" Height="30"/>
                                    </Button>

                                </Grid>


                            </StackPanel>

                        </Expander>
                     </StackPanel>

                </materialDesign:Card>

мой интерфейс выглядит так

enter image description here

в основном этот интерфейс работает так: когда пользователь вставит штрих-код, код элемента отобразится в расширителе. он получает детали из привязки из кода.

В настоящее время этот расширитель работает правильно. но я могу добавить только 1 предмет. когда я добавляю второй элемент, он не появляется в расширителе.

Я хочу, чтобы, когда пользователь добавил второй элемент, расширитель увеличился до 2.

можно ли так сделать?

itemDisplayList взято из этого кода 

cashierViewModel.AddItemToList(item);
spItemDisplay.DataContext = null;
spItemDisplay.DataContext = CashierViewModel.itemDisplayList;

Я делал это раньше, используя DataGrid, и он работает, но я хочу, чтобы он отображался в чем-то вроде экспандера

в основном itemDisplayList содержит все добавленные элементы.

1 Ответ

2 голосов
/ 26 апреля 2019

StackPanel - неправильный контейнер для использования здесь.Вам необходимо использовать контейнер, который может отображать несколько связанных элементов данных.ItemsControl - хороший выбор, но учтите, что он использует ItemsSource для данных, и вам нужно будет установить DataContext на уровень выше этого. 

<materialDesign:Card Background="{DynamicResource MaterialDesignBackground}">
        <ItemsControl x:Name="spItemDisplay" ItemsSource="{Binding itemDisplayList}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Expander x:Name="expander1" HorizontalAlignment="Stretch" Header="{Binding ItemName}">

                        <StackPanel Orientation="Vertical" TextBlock.Foreground="{DynamicResource MaterialDesignBody}" Margin="24,8,24,16">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition/>
                                    <ColumnDefinition/>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                    <RowDefinition/>
                                </Grid.RowDefinitions>

                                <Label FontWeight="Bold" Content="Item Code" Grid.Column="0" Grid.Row="0" />
                                <TextBlock Text="{Binding ItemCode}" Grid.Column="1" Grid.Row="0"/>

                                <Label FontWeight="Bold" Content="Item Name" Grid.Column="0" Grid.Row="1" />
                                <TextBlock Text="{Binding ItemName}" Grid.Column="1" Grid.Row="1"/>

                                <Button Click="btnRemoveItem_Click" Grid.Row="9" Grid.Column="0" Grid.ColumnSpan="2" HorizontalAlignment="Center" Style="{StaticResource MaterialDesignFloatingActionMiniAccentButton}" Width="30" Height="30" Padding="0" Background="{x:Null}" BorderBrush="{x:Null}">
                                    <materialDesign:PackIcon Background="Transparent" Foreground="#FF3580BF" Kind="RemoveShoppingCart" Width=" 30" Height="30"/>
                                </Button>

                            </Grid>


                        </StackPanel>

                    </Expander>
                </DataTemplate>

            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </materialDesign:Card>
...