首先说明,这个是部分代码,实现矩形框内才能显示底图;
第一张图显示矩形框,第二张图矩形框内显示底图;
注意:网格底图不再此文的讨论范围内,会在另外一个文中说明;本案例采用两个grid叠加的方式来实现;
顶层的grid定义;
<Grid HorizontalAlignment="Left" Height="450" Margin="450,10,0,0" VerticalAlignment="Top" Width="800" x:Name="Mvgrid"/>
矩形框的定义
Rectangle utRec = new Rectangle();
utRec.Name = "Rec" + 1;
utRec.Margin = new Thickness(15, 5, 0, 0);
utRec.HorizontalAlignment = HorizontalAlignment.Left;
utRec.VerticalAlignment = VerticalAlignment.Top;
utRec.Width = 80;
utRec.Height = 45;
utRec.Stroke = Brushes.Red;
utRec.StrokeThickness = 2;
Mvgrid.Children.Add(utRec);
功能实现的代码;
//给grid添加背景图片
BitmapImage img = new BitmapImage(new Uri(@"img/bg.png", UriKind.Relative));
ImageBrush ImageOne = new ImageBrush();
ImageOne.ImageSource = img;
ImageOne.Stretch = Stretch.Fill;
Mvgrid.Background = ImageOne;
//获取要显示的区域
Rectangle utRec = (Rectangle)Mvgrid.Children[0];
double left = utRec.Margin.Left;
double top = utRec.Margin.Top;
double width = utRec.Width;
double height = utRec.Height;
Console.WriteLine("起点:"+ left + " 顶点" + top + "宽度" + width + "高度" + height);
RectangleGeometry myRectangleGeometry = new RectangleGeometry();
myRectangleGeometry.Rect = new Rect(left, top, width, height);
Mvgrid.Clip = myRectangleGeometry;
待解决的问题:多个矩形框情况下,保证每个框内显示画面的一部分,初步的想法是利用多个canvas进行操作,但考虑浪费资源,此功能再议!
【好文共赏析!】