[WPF] Bring toolbox item to front

See more:

C#

VB

WPF

Hi,

How bring a grid to front? I have 5 grid(gd_1,gd_2....gd_5) and a rectangle(rec_dim) on top of the grids. I'm doing animation when user click on the each grid, it will dim the screen using rec_dim and maximize selected grid to view full page image but on top of rec_dim. So the other 4 grids will stay behind rec_dim. How to do this in code?

EDITED:
My xaml as below:-

<Grid x:Name="gd_GF" HorizontalAlignment="Left" Height="289.35" Margin="38,0,0,209.82" VerticalAlignment="Bottom" Width="500" RenderTransformOrigin="0.5,0.5">
    <Grid.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform/>
            <TranslateTransform/>
        </TransformGroup>
    </Grid.RenderTransform>
    <Rectangle Margin="0,0,0,49.35">
        <Rectangle.Fill>
            <ImageBrush ImageSource="/Images/Floor_GF.png" />
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock Margin="161,0,138.69,0" TextWrapping="Wrap" Text="Ground Floor" VerticalAlignment="Bottom" Foreground="White" FontSize="32" FontFamily="/Fonts/#Century Gothic" TextAlignment="Center" FontWeight="Bold" d:LayoutOverrides="Width"/>
</Grid>
<Grid x:Name="gd_LG" HorizontalAlignment="Left" Height="289.35" Margin="548.751,0,0,209.82" VerticalAlignment="Bottom" Width="500" RenderTransformOrigin="0.5,0.5">
    <Grid.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform/>
            <TranslateTransform/>
        </TransformGroup>
    </Grid.RenderTransform>
    <Rectangle Height="240" Margin="0,0,0,49.35" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="500">
        <Rectangle.Fill>
            <ImageBrush ImageSource="/Images/Floor_LG.png" />
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock Margin="0,0,67.628,0" TextWrapping="Wrap" Text="Lower Ground Floor" VerticalAlignment="Bottom" Foreground="White" FontSize="32" FontFamily="/Fonts/#Century Gothic" TextAlignment="Center" HorizontalAlignment="Right" FontWeight="Bold"/>
</Grid>
<Grid x:Name="gd_1F" HorizontalAlignment="Left" Height="287.85" Margin="38,0,0,541.32" VerticalAlignment="Bottom" Width="500">
    <Rectangle Margin="0,0,0,47.85">
        <Rectangle.Fill>
            <ImageBrush ImageSource="/Images/Floor_1F.png" />
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock Margin="0,0,191.377,0" TextWrapping="Wrap" Text="1st Floor" VerticalAlignment="Bottom" Foreground="White" FontSize="32" FontFamily="/Fonts/#Century Gothic" TextAlignment="Center" HorizontalAlignment="Right" FontWeight="Bold"/>
</Grid>
<Grid x:Name="gd_2F" HorizontalAlignment="Right" Height="287.85" Margin="0,0,31.249,541.32" VerticalAlignment="Bottom" Width="500" d:IsHidden="True">
    <Rectangle Height="240" Margin="0,0,0,47.85" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="500">
        <Rectangle.Fill>
            <ImageBrush ImageSource="/Images/Floor_2F.png" />
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock Margin="0,0,159.628,0" TextWrapping="Wrap" Text="2nd Floor" VerticalAlignment="Bottom" Foreground="White" FontSize="32" FontFamily="/Fonts/#Century Gothic" TextAlignment="Center" HorizontalAlignment="Right" FontWeight="Bold"/>
</Grid>
<Grid x:Name="gd_3F" HorizontalAlignment="Left" Margin="38,758.83,0,868.32" Width="500" d:IsHidden="True">
    <Rectangle Margin="0,0,0,52.85" Height="240">
        <Rectangle.Fill>
            <ImageBrush ImageSource="/Images/Floor_3F.png" />
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock Margin="0,0,186.997,0" TextWrapping="Wrap" Text="3rd Floor" VerticalAlignment="Bottom" Foreground="White" FontSize="32" FontFamily="/Fonts/#Century Gothic" TextAlignment="Center" HorizontalAlignment="Right" FontWeight="Bold"/>
</Grid>
<Grid x:Name="gd_4F" HorizontalAlignment="Right" Margin="0,763.83,31.249,868.32" Width="500" d:IsHidden="True">
    <Rectangle Height="240" Margin="0,0,0,47.85" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="500">
        <Rectangle.Fill>
            <ImageBrush ImageSource="/Images/Floor_4F.png" />
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock Margin="0,0,159.628,0" TextWrapping="Wrap" Text="4th Floor" VerticalAlignment="Bottom" Foreground="White" FontSize="32" FontFamily="/Fonts/#Century Gothic" TextAlignment="Center" HorizontalAlignment="Right" FontWeight="Bold"/>
</Grid>
<Grid x:Name="gd_5F" Height="291.733" Margin="261.751,432.83,318.249,0" VerticalAlignment="Top" d:IsHidden="True">
    <Rectangle Height="240" Margin="0,0,0,51.733" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="500">
        <Rectangle.Fill>
            <ImageBrush ImageSource="/Images/Floor_5F.png" />
        </Rectangle.Fill>
    </Rectangle>
    <TextBlock Margin="181.968,0,134.628,-0.001" TextWrapping="Wrap" Text="5th Floor" VerticalAlignment="Bottom" Foreground="White" FontSize="32" FontFamily="/SunwayPutraApp;component/Fonts/#Century Gothic" TextAlignment="Center" FontWeight="Bold"/>
</Grid>
<Rectangle x:Name="rec_dim" Height="1920" HorizontalAlignment="Left" Stroke="{x:Null}" VerticalAlignment="Top" Width="1080.001" Margin="-1080.001,0,0,0" RenderTransformOrigin="0.5,0.5" d:LayoutOverrides="HorizontalAlignment">
    <Rectangle.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform/>
            <TranslateTransform/>
        </TransformGroup>
    </Rectangle.RenderTransform>
    <Rectangle.Fill>
        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#CC000000" Offset="0.745"/>
            <GradientStop Color="#33000000"/>
            <GradientStop Color="#95000000" Offset="0.295"/>
        </LinearGradientBrush>
    </Rectangle.Fill>
</Rectangle>

The rec_dim will fill the whole screen and I maximize the grid to fit the screen using animation. The screen will focus only selected grid eg: user press LG, it will bring the LG to max, if 1F, it will being 1F to max..