[VB.NET] Traslazioni

[GliderKite]

Ho un oggetto Path che viene creato all'interno di una Grid. Le proprietà di questo oggetti sono tali da fare in modo che le sue coordinate vadano oltre i bordi del contenitore stesso.

Per fare un esempio, la griglia ha una dimensione di 600x600 e il Path in questione è un rettangolo da 200x200. Il rettangolo viene posizionato con un margine sinistro di 500, quindi è per metà dentro e per l'altra metà fuori (rispetto alla griglia). In questo caso viene correttamente visualizzata solo la metà sinistra (quella dentro il contenitore).

Ora però decido di effettuare una trasformazione di traslazione (TranslateTransform) del rettangolo verso sinistra per un valore pari a 300. Mi aspetto quindi che il rettangolo venga visualizzato con un margine sinistro pari a 200, cosa che effettivamente accade, tuttavia il problema è che viene comunque sempre visualizzata la metà sinistra del rettangolo, come se prima fosse stato disegnato senza traslazione e poi la parte visualizzabile sia stata traslata.

Come posso evitare questo comportamento?
Grazie.

[GliderKite]

Per chi fosse interessato, la soluzione consiste nell'utilizzo di un oggetto Canvas al posto dell'oggetto Grid come contenitore.

[U235]

Originariamente inviato da GliderKite
Per chi fosse interessato, la soluzione consiste nell'utilizzo di un oggetto Canvas al posto dell'oggetto Grid come contenitore.

ciao, con la Grid devi sempre considerare che il margine dell'oggetto contenuto è relativo alla riga o alla colonna che lo contiene, quindi in buona sostanza, se tu hai la colonna 1 a 200 (ad esempio), il margine dell'oggetto contenuto (supponendo che sia 0) sarà a 200 dall'inizio della griglia, infatti se invece nel margine dell'oggetto metti -200 ti troverai l'oggetto in posizione 0 rispetto all'inizio della griglia, ma è possibile che venga parzialmente coperto se nella prima colonna (quella "invasa") è presente un oggetto che è stato scritto (nello xaml) dopo e occupa tutta la cella.

per capirci meglio, se io ho due rectangle dichiarati cosi :

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="50*" />
            <RowDefinition Height="249*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="50*" />
            <ColumnDefinition Width="244*" />
        </Grid.ColumnDefinitions>
        <Rectangle Grid.Column="1" Fill="Black" Grid.Row="1" Height="50" HorizontalAlignment="Left"  Name="rectangle1" Stroke="Black" VerticalAlignment="Top" Width="100">
            <Rectangle.RenderTransform>
                <TranslateTransform X="-50" Y="-50" />
            </Rectangle.RenderTransform>
        </Rectangle>
        <Rectangle Grid.Column="0" Fill="White" Grid.Row="0" Height="51" HorizontalAlignment="Left"  Name="rectangle2" Stroke="White" VerticalAlignment="Top" Width="100" >
            
        </Rectangle>
    </Grid>

io vedrò solo metà rectangle nero in quanto, avendo invaso con la traslazione la cella del rectangle bianco, ed essendo ad un livello inferiore nell'ordine Z (infatti è dichiarato prima nello xaml), una parte (quella della cella invasa) non la vedrò in quanto "sotto" l'altro rectangle.

Quindi il motivo del funzionamento col Canvas è che non puoi impostare righe e colonne, ma se le tue traslazioni non le fai "uscire" dall'area della cella, puoi usare anche la Grid (se ti serve quella! ).

[GliderKite]

Capisco, tuttavia nel mio caso non erano definite righe o colonne per la Griglia, semplicemente definivo un margine sinistro che portava il rettangolo oltre il bordo destro della griglia, e la trasformazione traslava unicamente la parte rimasta all'interno della Griglia. Con il Canvas ciò invece non accade. Questo diverso comportamento è essenzialmente dovuto ad un diverso comportamento di layout dell'elemento Panel nei confronti dei suoi childrens, ovvero di come WPF gestice il rendering a seconda del contenitore utilizzato.
Fortunatamente per il momento non ho la necessità di utilizzare una Grid rispetto ad un Canvas, che oltretutto dovrebbe essere più efficiente sotto questi aspetti, in caso contrario mi farò sentire per ulteriori consigli.

[U235]

non saprei cosa dirti... a me non da problemi con la grid e il margin impostato e con una parte o anche tutto il Path fuori dal bordo
A meno che tu non stia posizionando il "RectangleGeometry" oltre il margine del path (attento al right e bottom) facendolo più grande o impostando il margine (oltre lo 0) anche ad esso.
ecco un esempio con grid e margin impostato fuori dalla grid :

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="32*" />
            <RowDefinition Height="268*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="28*" />
            <ColumnDefinition Width="272*" />
        </Grid.ColumnDefinitions>
        <Path x:Name="Path" Stroke="DarkGoldenRod" StrokeThickness="3" Grid.Column="1"  Grid.Row="1">
            <Path.Data>
                <RectangleGeometry Rect="0,0,200,200"/>
            </Path.Data>
            <Path.Triggers>
                <EventTrigger RoutedEvent="Path.Loaded">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation From= "500" To= "0" RepeatBehavior="Forever" 
                                             Duration="0:0:5"
                           Storyboard.TargetName= "traslazione"
                           Storyboard.TargetProperty= "Y" />
                            <DoubleAnimation From= "500" To= "0" RepeatBehavior="Forever" 
                                             Duration="0:0:5"
                           Storyboard.TargetName= "traslazione"
                           Storyboard.TargetProperty= "X" />
                            <DoubleAnimation From= "0" To= "360" RepeatBehavior="Forever" 
                                             Duration="0:0:3"
                           Storyboard.TargetName= "rotazione"
                           Storyboard.TargetProperty= "Angle" />
                        </Storyboard>                        
                    </BeginStoryboard>
                    </EventTrigger>
            </Path.Triggers>            
            <Path.RenderTransform>
                <TransformGroup>
                    <RotateTransform x:Name="rotazione" Angle="0"/>
                    <TranslateTransform x:Name="traslazione" X="500" Y="200" />                    
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
    </Grid>

comunque come hai detto tu, se non ti serve impaginare con la griglia allora va benissimo anche il Canvas, anche perchè ridimensionando il controllo in runtime (più piccolo) con la grid viene ridimensionato in proporzione (a meno che... magari al prossimo post! ) rischi che non si veda più una parte a causa proprio del ridimensionamento degli spazi che contengono il Path.

[U235]

ops, l'ho scritto ma nel codice mi ero dimenticato proprio di impostare il margin perchè avevo messo la prima traslazione a 500, ma comunque è lo stesso ecco il codice con il margin

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="32*" />
            <RowDefinition Height="268*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="28*" />
            <ColumnDefinition Width="272*" />
        </Grid.ColumnDefinitions>
        <Path x:Name="Path" Stroke="DarkGoldenRod" StrokeThickness="3" Grid.Row="1" Grid.ColumnSpan="2" 
Margin="46,120,10,-120">
            <Path.Data>
                <RectangleGeometry Rect="0,0,200,200"/>
            </Path.Data>
            <Path.Triggers>
                <EventTrigger RoutedEvent="Path.Loaded">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation From= "500" To= "0" RepeatBehavior="Forever" 
                                             Duration="0:0:5"
                           Storyboard.TargetName= "traslazione"
                           Storyboard.TargetProperty= "Y" />
                            <DoubleAnimation From= "500" To= "0" RepeatBehavior="Forever" 
                                             Duration="0:0:5"
                           Storyboard.TargetName= "traslazione"
                           Storyboard.TargetProperty= "X" />
                            <DoubleAnimation From= "0" To= "360" RepeatBehavior="Forever" 
                                             Duration="0:0:3"
                           Storyboard.TargetName= "rotazione"
                           Storyboard.TargetProperty= "Angle" />
                        </Storyboard>                        
                    </BeginStoryboard>
                    </EventTrigger>
            </Path.Triggers>
            
            <Path.RenderTransform>
                <TransformGroup>
                    <RotateTransform x:Name="rotazione" Angle="0"/>
                    <TranslateTransform x:Name="traslazione" X="500" Y="200" />                    
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
    </Grid>