-
July 15th, 2011, 05:05 PM
#1
How do I handle a requirement to put a magnifying glass feature onto my Silverlight a
How do I handle a requirement to put a magnifying glass feature onto my Silverlight app?
It is not as easy as one might think.
The previous programmer did it and thought it looked cool.
It works by manipulating the scaling operation. It is a lot like the zoom feature in a browser.
Anyway, in my program it requires I change the Z level of some of the objects so that they appear on top of other objects in the window. How do I do that?
The problem is that I have a grid with two rows. Naturally, in XAML, whatever is listed last, appears "on top" of whatever is described at the top of the XAML page. Does this make any sense? If the components in the top part of the grid are scaled up, they hide behind the bottom row. I don't want that.
-
July 30th, 2011, 07:13 PM
#2
Re: How do I handle a requirement to put a magnifying glass feature onto my Silverlig
The magnifying glass trick is an interesting one. There are a couple popular examples floating around the internet. I remember one where there were two identical images in a canvas one on top of the other (z-index), and whenever a piece needed to be magnified, the image further back was scaled and brought to the front.
To adjust the z-index inside of a grid as in
<Grid x:Name="MyGrid">
<Rectangle x:Name="BottomRectangle" Canvas.ZIndex="0" Canvas.Left="10" Canvas.Top="10" Fill="Orange" Height="20" Width="20"></Rectangle>
<Rectangle x:Name="TopRectangle" Canvas.ZIndex="1" Canvas.Left="10" Canvas.Top="10" Fill="Blue" Height="20" Width="20"></Rectangle>
</Grid>
you can set the Canvas.ZIndex property. Then in your .cs file you can say
public void FlipZIndexTest()
{
Canvas.SetZIndex(BottomRectangle, 1);
Canvas.SetZIndex(TopRectangle, 0);
}
The higher valued ZIndex will appear on top.
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|