WPF: Canvas et zIndex? Comment ça marche?

Question

J'ai la layou suivante:

<s:SurfaceWindow x:Class="Prototype_Concept_2.SurfaceWindow1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:s="http://schemas.microsoft.com/surface/2008" 
    Title="Prototype_Concept_2" 
    > 
    <s:SurfaceWindow.Resources> 
    <ImageBrush x:Key="WindowBackground" Stretch="None" Opacity="0.6" ImageSource="pack://application:,,,/Resources/WindowBackground.jpg"/> 
    </s:SurfaceWindow.Resources> 

    <Grid Background="{StaticResource WindowBackground}" > 

      <Grid Name="ProjectsGrid"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto"></RowDefinition> 
        <RowDefinition Height="*"></RowDefinition> 
        <RowDefinition Height="Auto"></RowDefinition> 

       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="Auto"></ColumnDefinition> 
        <ColumnDefinition Width="*"></ColumnDefinition> 
       </Grid.ColumnDefinitions> 
       <TextBox Name="ProjectsHeader" Grid.ColumnSpan="2" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" FontSize="25" Text="Please choose one of the following projects" Grid.Row="0"></TextBox> 
       <s:SurfaceButton Name="BottomButton" HorizontalAlignment="Right" FontSize="20" Width="100" Grid.Column="1" Grid.Row="2" Foreground="White" Content="Refresh"></s:SurfaceButton> 
       <s:SurfaceListBox Background="Black" Grid.ColumnSpan="2" Name="ProjectsList" Grid.Row="1" ItemsSource="{Binding Projects}"></s:SurfaceListBox> 
       <Label Name="ProjectsFooter" Grid.Column="0" Grid.Row="2" Grid.ColumnSpan="2" FontSize="15" Content="Fetching projects data ..."></Label> 

      </Grid> 

     <Grid ShowGridLines="True" Name="SmellHeader" Visibility="Collapsed"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="256"></ColumnDefinition> 
      <ColumnDefinition Width="256"></ColumnDefinition> 
      <ColumnDefinition Width="256"></ColumnDefinition> 
      <ColumnDefinition Width="256"></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="38"></RowDefinition> 
        <RowDefinition Height="*"></RowDefinition> 
       </Grid.RowDefinitions> 

      <Rectangle Grid.Column="0" Grid.Row="0" Fill="Black"></Rectangle> 
      <Viewbox Grid.Column="0" Grid.Row="0" s:Contacts.PreviewContactDown="BrainClass_PreviewContactDown"> 
       <Label Background="Black" Foreground="White" Content="BrainClass" HorizontalContentAlignment="Center"></Label> 
      </Viewbox> 

      <Rectangle Grid.Column="1" Grid.Row="0" Fill="Black"></Rectangle> 
      <Viewbox Grid.Column="1" Grid.Row="0"> 
       <Label Background="Black" Foreground="White" Content="God Class" HorizontalContentAlignment="Center"></Label> 
      </Viewbox> 

      <Rectangle Grid.Column="2" Grid.Row="0" Fill="Black"></Rectangle> 
      <Viewbox Grid.Column="2" Grid.Row="0"> 
       <Label Background="Black" Foreground="White" Content="Tradition Breaker" HorizontalContentAlignment="Center"></Label> 
      </Viewbox> 

      <Rectangle Grid.Column="3" Grid.Row="0" Fill="Black"></Rectangle> 
      <Viewbox Grid.Column="3" Grid.Row="0"> 
       <Label Background="Black" Foreground="White" Content="RefusedParent Bequest" HorizontalContentAlignment="Center"></Label> 
      </Viewbox> 
     </Grid> 
     <Canvas Name="RootLayer" Grid.Row="1" Grid.ColumnSpan="4"> 
     </Canvas> 
    </Grid> 
</s:SurfaceWindow> 

Au RootLayer ajouter un peu Ellipse. Plus tard, je veux les ré-encoder:

internal void setFocus(SourceManager manager) 
     { 
      Console.WriteLine("Set focus to class " + getFullName()); 

      foreach (SourceFile sf in manager.getBrainClasses()) 
      { 
       sf.getVisualizer().Fill = Brushes.Red; 
       Canvas.SetZIndex(sf.getVisualizer(), 0); 
      } 

      this.getVisualizer().Fill = Brushes.Blue; 

      Canvas.SetZIndex(this.getVisualizer(), 1); 

      manager.window.RootLayer.InvalidateArrange(); 
      manager.window.RootLayer.InvalidateVisual(); 
     } 

L'Ellipse est référencée par this.getVisualizer(); Cependant, rien ne change? Comment puis-je amener une Ellipse à l'avant?

Answer 1

Il est pas tout à fait clair à partir de votre code postal comment les ellipses sont ajoutés à la toile, mais voici un petit échantillon qui fait essentiellement ce que vous voulez faire:

<Grid> 
    <Canvas x:Name="RootLayer" Width="500" Height="500" /> 
</Grid> 

Et dans le constructeur du code derrière , créer des ellipses:

for (int i = 0; i < 10; i++) 
{ 
    Ellipse e = new Ellipse 
    { 
     Width = 100, 
     Height = 100, 
     Fill = new SolidColorBrush(
       Color.FromArgb(0xDD, 
        (Byte) r.Next(255) 
        (Byte) r.Next(255) 
        (Byte) r.Next(255))), 
     Stroke = Brushes.Black, 
     StrokeThickness = 1, 
    }; 
    e.MouseUp += new MouseButtonEventHandler(e_MouseUp); 
    Canvas.SetLeft(e, r.Next(400)); 
    Canvas.SetTop(e, r.Next(400)); 
    RootLayer.Children.Add(e); 
} 

gestionnaire d'événements pour gérer clic de souris sur le bouton de sélection

void e_MouseUp(object sender, MouseButtonEventArgs e) 
{ 
    foreach (UIElement item in RootLayer.Children) 
    Panel.SetZIndex(item, 0); 

    Panel.SetZIndex((UIElement)sender, 1); 
} 

Avec le code ci-dessus, chaque fois que l'on clique sur une ellipse (avec la souris vers le haut), elle relèvera au-dessus de toutes les autres ellipses de cette toile.