Макет ItemsControl с вложенным списком - каждая оболочка под собой

моя цель - положить 3-ю обертку под 2-ю. Для этого макета я использую сочетание док-панели и стек-панели.

1-я обертка представляет собой стековую панель этикеток
2-я оболочка - это элемент управления (список членов) с док-панелью в качестве шаблона.
3-я оболочка — это элемент управления с док-панелью в качестве шаблона (вложенный список адресов каждого члена).

Просмотреть

<Grid>
        <ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible">
            <DockPanel>
                <StackPanel DockPanel.Dock="Top"  Orientation="Horizontal">
                    <Label Style="{StaticResource MinWidthLeft}" Content="Typ Adresu"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Imie"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Nazwisko"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Nazwa Firmy"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="NIP"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="REGON"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Ulica"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Adres"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Kod pocztowy"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Miasto"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Kraj"/>
                    <Label Style="{StaticResource MinWidthLeft}" Content="Dodatkowe informacje"/>
                </StackPanel>

                <ItemsControl ItemsSource = "{Binding listContractorAddAddress}" >
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <StackPanel DockPanel.Dock="Top" Orientation="Horizontal">
                                <Button Style="{StaticResource MinWidth}" Content="Dodaj Adres" Command="{Binding Path=AddAddress}"/>
                                <TextBlock Style="{StaticResource MinWidth}" Text="{Binding Member.Login}"/>
                                <TextBlock Style="{StaticResource MinWidth}" Text="{Binding Member.Email}"/>

                                <ItemsControl ItemsSource = "{Binding Addresses}" >
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                                            <StackPanel DockPanel.Dock="Top" Orientation="Horizontal">
                                                <Button Style="{StaticResource MinWidth}" Content="Edytuj" Command="{Binding Path=EditAddress}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.TypAdresu}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Imie}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Nazwisko}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.NazwaFirmy}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.NIP}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.REGON}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Ulica}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Adres}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.KodPocztowy}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Miasto}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Kraj}"/>
                                                <TextBlock Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.DodatkoweInformacje}"/>
                                            </StackPanel>
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                    <ItemsControl.ItemsPanel>
                                        <ItemsPanelTemplate>
                                            <!--<DockPanel/>-->
                                            <StackPanel DockPanel.Dock="Top" Orientation="Vertical" />
                                        </ItemsPanelTemplate>
                                    </ItemsControl.ItemsPanel>
                                </ItemsControl>
                            </StackPanel>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <!--<DockPanel/>-->
                            <StackPanel DockPanel.Dock="Top"  Orientation="Vertical" />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                </ItemsControl>
            </DockPanel>
        </ScrollViewer>
    </Grid>

Я потратил на это много времени, я пытался использовать:

только стековая панель с горизонтальной/вертикальной ориентацией (я сделал такой же макет, как и с док-панелью).
только сетка, но у меня это доза не работает - беда и пустая трата времени (мне сложно сказать, что я делал не так, каждый ряд был с нужной стороны, а не один под другим)

Спасибо!

wpf stackpanel dockpanel

szkut 20.06.2018 источник

comment

не уверен, что понимаю, чего вы пытаетесь достичь - FoggyFinder 20.06.2018

Ответы (1)

arrow_upward
0
arrow_downward

Пришлось все перестраивать и пересматривать рисунок сетки:

<Grid IsSharedSizeScope="True">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition SharedSizeGroup="A" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>

    <StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal">
        <Label Style="{StaticResource MinWidthLeft}" Content="Typ Adresu"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Imie"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Nazwisko"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Nazwa Firmy"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="NIP"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="REGON"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Ulica"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Adres"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Kod pocztowy"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Miasto"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Kraj"/>
        <Label Style="{StaticResource MinWidthLeft}" Content="Dodatkowe informacje"/>
    </StackPanel>

    <ItemsControl Grid.Row="1" Grid.Column="0" ItemsSource="{Binding listContractorAddAddress}" >
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Vertical" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <StackPanel Grid.Row="0" Orientation="Horizontal">
                        <Button Style="{StaticResource MinWidth}" Content="Dodaj Adres" Command="{Binding Path=AddAddress}"/>
                        <TextBlock Style="{StaticResource MinWidth}" Text="{Binding Member.Login}"/>
                        <TextBlock Style="{StaticResource MinWidth}" Text="{Binding Member.Email}"/>
                    </StackPanel>
                    <StackPanel Grid.Row="1" Orientation="Horizontal">
                        <ItemsControl ItemsSource="{Binding Addresses}">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Vertical" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                            <ColumnDefinition Width="*" />
                                        </Grid.ColumnDefinitions>
                                        <Button Grid.Column="0" Style="{StaticResource MinWidth}" Content="Edytuj" Command="{Binding Path=EditAddress}"/>
                                        <TextBlock Grid.Column="1" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.TypAdresu}"/>
                                        <TextBlock Grid.Column="2" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Imie}"/>
                                        <TextBlock Grid.Column="3" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Nazwisko}"/>
                                        <TextBlock Grid.Column="4" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.NazwaFirmy}"/>
                                        <TextBlock Grid.Column="5" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.NIP}"/>
                                        <TextBlock Grid.Column="6" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.REGON}"/>
                                        <TextBlock Grid.Column="7" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Ulica}"/>
                                        <TextBlock Grid.Column="8" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Adres}"/>
                                        <TextBlock Grid.Column="9" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.KodPocztowy}"/>
                                        <TextBlock Grid.Column="10" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Miasto}"/>
                                        <TextBlock Grid.Column="11" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.Kraj}"/>
                                        <TextBlock Grid.Column="12" Style="{StaticResource MinWidthLeft}" Text="{Binding MemberAddress.DodatkoweInformacje}"/>
                                    </Grid>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </StackPanel>
            </Grid>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>

Html + css для меня гораздо более интуитивно понятен, чем xaml. Уфф, это были сумасшедшие 5 часов :) Foggy Finder, спасибо за интерес.

это шаблон, который помог мне решить проблему

szkut 20.06.2018

Макет ItemsControl с вложенным списком - каждая оболочка под собой

Ответы (1)

Вопросы по теме