fxhomeSoft-silverlight版地图引擎开发教程 之 底图控件制作
返回目录查看更多
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
下边的代码还没有更新上来
我先把XAP发上来 让大家看看效果吧
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
概述：
底图控件分为预显层和图形层，预显层用来辅助画图者更准确的绘制图型，图形层用来显示操作者绘制好的图形。
底图控件提供“捕捉鼠标操作实现绘图功能”（见目标1）
预显层需要实现“绘线辅助提示功能”（见目标2）
图形层需要实现“绘图预显功能”（见目标3）
底图控件（代码如下）
1、捕捉鼠标操作实现绘图功能
代码
<UserControl x:Class="fxhomeSoftMaps.baseMap"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400" xmlns:my="clr-namespace:fxhomeSoftMaps">
<Grid x:Name="LayoutRoot">
<Grid x:Name="previewLayer" Background="#FF00D6B4"
MouseLeftButtonDown="previewLayer_MouseLeftButtonDown"
MouseMove="previewLayer_MouseMove"
KeyDown="previewLayer_KeyDown"
>
<my:baseMap_point VerticalAlignment="Top" x:Name="bPoint" HorizontalAlignment="Left" Visibility="Collapsed"/>
<my:baseMap_previewLine x:Name="bLine" VerticalAlignment="Top" HorizontalAlignment="Left" Visibility="Collapsed"/>
</Grid>
<Grid x:Name="graphicsLayer">
</Grid>
</Grid>
</UserControl>
代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace fxhomeSoftMaps
{
public partial class baseMap : UserControl
{
public baseMap()
{
InitializeComponent();
}
#region 属性
//线路集合
private List<Line> _lineList;
public List<Line> lineList
{
get
{
return _lineList;
}
set
{
_lineList = value;
}
}
//画线开关
private bool _lineState = true;
public bool lineState
{
get
{
return _lineState;
}
set
{
_lineState = value;
}
}
//线段开关
private bool lineSegment = false;
#endregion
#region 预览图层-画线操作
//鼠标按下
private void previewLayer_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
if (lineState)
{
//设置预显开始点
bPoint.X = e.GetPosition(null).X;
bPoint.Y = e.GetPosition(null).Y;
bPoint.Visibility = Visibility.Visible;
//设置预显线
bLine.X1 = bPoint.X;
bLine.Y1 = bPoint.Y;
bLine.X2 = bPoint.X;
bLine.Y2 = bPoint.Y;
bLine.Visibility = Visibility.Visible;
//打开线段开关
lineSegment = true;
if (lineSegment == false)
{
}
}
}
//鼠标移动
private void previewLayer_MouseMove(object sender, MouseEventArgs e)
{
if (lineState)
{
bLine.X2 = e.GetPosition(null).X;
bLine.Y2 = e.GetPosition(null).Y;
}
}
//按键
private void previewLayer_KeyDown(object sender, KeyEventArgs e)
{
//如果按ESC 取消画线
if (e.Key == Key.Escape)
{
bPoint.Visibility = Visibility.Collapsed;
bLine.Visibility = Visibility.Collapsed;
}
}
#endregion
#region 图形图层操作
#endregion
}
}
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
2、绘线辅助提示功能（如图）
（1）
1.1 预显线开始点控件（代码如下）
代码
<UserControl x:Class="fxhomeSoftMaps.baseMap_point"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Width="4" Height="4">
<Grid x:Name="LayoutRoot" Margin="-2,-2,0,0">
<Ellipse x:Name="baseMapPoint">
<Ellipse.Fill>
<RadialGradientBrush>
<GradientStop Color="#FF00A7FF" Offset="0"/>
<GradientStop Color="#FF44FBFF" Offset="1"/>
<GradientStop Color="#FF14C0FF" Offset="0.575"/>
</RadialGradientBrush>
</Ellipse.Fill>
</Ellipse>
</Grid>
</UserControl>
代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace fxhomeSoftMaps
{
public partial class baseMap_point : UserControl
{
public baseMap_point()
{
InitializeComponent();
}
public Double X
{
get { return (Double)GetValue(XProperty); }
set { SetValue(XProperty, value); }
}
// Using a DependencyProperty as the backing store for X. This enables animation, styling, binding, etc...
public static readonly DependencyProperty XProperty =
DependencyProperty.Register("X", typeof(Double), typeof(baseMap_point), new PropertyMetadata(null));
public Double Y
{
get { return (Double)GetValue(YProperty); }
set { SetValue(YProperty, value); }
}
// Using a DependencyProperty as the backing store for Y. This enables animation, styling, binding, etc...
public static readonly DependencyProperty YProperty =
DependencyProperty.Register("Y", typeof(Double), typeof(baseMap_point), new PropertyMetadata(null));
}
}
1.2 预显线结束控件（代码如下）
代码
<UserControl x:Class="fxhomeSoftMaps.baseMap_previewArrow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="30" d:DesignWidth="30">
<Grid x:Name="LayoutRoot" Margin="-15,-15,0,0">
<Line StrokeThickness="2" Y2="30" X2="15" X1="15" Stroke="#FFC00000" StrokeStartLineCap="Round" StrokeEndLineCap="Round"/>
<Line Y1="15" X2="30" Y2="15" Stroke="#FFC00000" StrokeThickness="2" StrokeStartLineCap="Round" StrokeEndLineCap="Round"/>
<Ellipse HorizontalAlignment="Left" Height="10" Margin="10,10,0,0" StrokeThickness="2" VerticalAlignment="Top" Width="10">
<Ellipse.Fill>
<RadialGradientBrush>
<GradientStop Color="#FF5AFF00" Offset="0"/>
<GradientStop Color="Transparent" Offset="1"/>
</RadialGradientBrush>
</Ellipse.Fill>
</Ellipse>
</Grid>
</UserControl>
代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace fxhomeSoftMaps
{
public partial class baseMap_previewArrow : UserControl
{
public baseMap_previewArrow()
{
InitializeComponent();
}
}
}
1.3 预显线控件[包含以上两个控件]（代码如下）
代码
<UserControl x:Name="userControl" x:Class="fxhomeSoftMaps.baseMap_previewLine"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400" xmlns:my="clr-namespace:fxhomeSoftMaps">
<Grid x:Name="LayoutRoot">
<Line x:Name="baseMapLine" Stroke="#FFC00000" StrokeThickness="2" StrokeDashArray="2 2" X1="{Binding X1, ElementName=userControl, Mode=TwoWay}" Y1="{Binding Y1, ElementName=userControl, Mode=TwoWay}" X2="{Binding X2, ElementName=userControl, Mode=TwoWay}" Y2="{Binding Y2, ElementName=userControl, Mode=TwoWay}"/>
<my:baseMap_previewArrow x:Name="baseMap_previewArrow"/>
</Grid>
</UserControl>
代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace fxhomeSoftMaps
{
public partial class baseMap_previewLine : UserControl
{
public baseMap_previewLine()
{
InitializeComponent();
}
#region 附加属性
public Double X1
{
get { return (Double)GetValue(X1Property); }
set { SetValue(X1Property, value); }
}
// Using a DependencyProperty as the backing store for X1. This enables animation, styling, binding, etc...
public static readonly DependencyProperty X1Property =
DependencyProperty.Register("X1", typeof(Double), typeof(baseMap_previewLine), new PropertyMetadata(null));
public Double X2
{
get { return (Double)GetValue(X2Property); }
set
{
SetValue(X2Property, value);
baseMap_previewArrow.Margin = new Thickness(baseMapLine.X2, baseMapLine.Y2, 0, 0);
}
}
// Using a DependencyProperty as the backing store for X2. This enables animation, styling, binding, etc...
public static readonly DependencyProperty X2Property =
DependencyProperty.Register("X2", typeof(Double), typeof(baseMap_previewLine), new PropertyMetadata(null));
public Double Y1
{
get { return (Double)GetValue(Y1Property); }
set { SetValue(Y1Property, value); }
}
// Using a DependencyProperty as the backing store for Y1. This enables animation, styling, binding, etc...
public static readonly DependencyProperty Y1Property =
DependencyProperty.Register("Y1", typeof(Double), typeof(baseMap_previewLine), new PropertyMetadata(null));
public Double Y2
{
get { return (Double)GetValue(Y2Property); }
set
{
SetValue(Y2Property, value);
baseMap_previewArrow.Margin = new Thickness(baseMapLine.X2, baseMapLine.Y2, 0, 0);
}
}
// Using a DependencyProperty as the backing store for Y2. This enables animation, styling, binding, etc...
public static readonly DependencyProperty Y2Property =
DependencyProperty.Register("Y2", typeof(Double), typeof(baseMap_previewLine), new PropertyMetadata(null));
#endregion
}
}
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
3、绘图预显功能
