[WPF] positioning

[Verwijderd]

Hallo,

Ik ben wat aan het experimenteren met wpf. Nu zit ik vast op het volgende probleem en vind er geen oplossing voor:

Ik heb in de viewModel een ObservableCollection object. Al deze objecten stellen rechthoeken voor.
Wanneer ik deze wil tekenen (grootte en positie heb ik even statisch in de code gezet om te testen) komen de rechthoeken niet over elkaar te staan maar onder elkaar. Ze worden dus t.o.v. elkaar gepositioneerd:s

code:

<Window ...>

    <DockPanel LastChildFill="True">
        <Rectangle Height="100" Name="Lens" Stroke="Black" Width="100" DockPanel.Dock="Bottom"/>

        <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <ItemsControl ItemsSource="{Binding Lenses}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                            <views:RechthoekView />
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </Grid>
    </DockPanel>
</Window>

RechthoekView.xaml.cs:

code:

<UserControl ...
    >

    <Rectangle Width="100" Height="50" Stroke="Black" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,0,0,0"/>
    

</UserControl>

[MTWZZ]

De MSDN documentatie zegt het volgende over layered order:

Child elements of a Grid are drawn in the order in which they appear in markup or code. As a consequence, layered order (also known as z-order) can be achieved when elements share the same coordinates.

Dus ik denk dat je op de RechHoekView de Grid.Column en Grid.Row expliciet moet zetten zodat ze dezelfde coordinaten krijgen.

[CyBoB]

Dat is logisch sinds ItemsControl de layout overlaat aan het opgegeven ItemsPanel. Default is deze van het type StackPanel met Orientation gezet op Vertical. Als je de layout bepaling wil aanpassen zou je kunnen kijken naar een ItemsPanelTemplate i.c.m. de ItemsPanel property van ItemsControl waarmee je de positionering kan bepalen.

Als je alles over elkaar heen getekend wil hebben dan kan je proberen of je met een grid uit de weg kunt. Als ik echter een beetje uit je verhaal begrijp dat je data objecten ook de positie bepalen, dan zou je kunnen gaan voor een Canvas en in je datatemplate iets doen met de Canvas.Left en Canvas.Top attached properties.

[ Voor 3% gewijzigd door CyBoB op 08-02-2010 11:30 ]

[Verwijderd]

Ok bedankt.

De rechthoeken worden goed getekend. Enkel zou de grid ook nog een standaard rechthoek moeten bevatten maar dit geeft nog problemen ( de vetgedrukte regel dus)

code:

<Window ...>

    <DockPanel LastChildFill="True">
        <Rectangle Height="100" Name="Lens" Stroke="Black" Width="100" DockPanel.Dock="Bottom"/>

        <ItemsControl ItemsSource="{Binding Lenses}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
                        [b]<Rectangle Width="10" Name="Pointer1" Fill="Red" Margin="0,0,0,0"  HorizontalAlignment="Left" Height="10" VerticalAlignment="Top"></Rectangle>[/b]
                    </Grid>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <views:LensView />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </DockPanel>
</Window>

[Verwijderd]

Via ItemsControl zet ik dus alle elementen van een ObservableCollection in een Grid (itemspaneltemplate). Maar nu zou ik dus m.a.w. naast deze items ook nog andere items in dezelfde grid willen hebben.

Is dit eigenlijk mogelijk?

[CyBoB]

Verwijderd schreef op maandag 08 februari 2010 @ 22:58:
Via ItemsControl zet ik dus alle elementen van een ObservableCollection in een Grid (itemspaneltemplate). Maar nu zou ik dus m.a.w. naast deze items ook nog andere items in dezelfde grid willen hebben.

Is dit eigenlijk mogelijk?

Nee dit is dus niet mogelijk. Het is een beetje afhankelijk van wat je er mee wil bereiken, maar je kan hetgeen je wil ook gewoon over het ItemsControl heen renderen. Dus iets als:

XML:

<Window ...>
   <DockPanel LastChildFill="True">
      <Rectangle Height="100" Name="Lens" Stroke="Black" Width="100" DockPanel.Dock="Bottom"/>
      <Grid>
         <ItemsControl ItemsSource="{Binding Lenses}">
            <ItemsControl.ItemsPanel>
               <ItemsPanelTemplate>
                  <Grid/>
               </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
               <DataTemplate>
                  <views:LensView />
               </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
        <Rectangle Width="10" Name="Pointer1" Fill="Red" Margin="0,0,0,0"  HorizontalAlignment="Left" Height="10" VerticalAlignment="Top"/>
      </Grid>
   </DockPanel>
</Window>

Andere method zou kunnen zijn dat je de Template van ItemsControl herdefinieerd met die Rectangle erin.

XML:

            <ItemsControl.Template>
                <ControlTemplate TargetType="{x:Type ItemsControl}">
                    <Grid>                        
                        <ItemsPresenter/>
                        <Rectangle Width="10" Fill="Red" Margin="0,0,0,0"  HorizontalAlignment="Left" Height="10" VerticalAlignment="Top"/>
                    </Grid>
                </ControlTemplate>
            </ItemsControl.Template>

Je kan dan weer niet met (x:)Name werken, dus is even afhankelijk van wat je wil bereiken.