[Silverlight动画]转向行为 - 路径跟随

简介: 路径跟随这名字一听就知道要干嘛了:机车会沿着一个预定的路线行驶。虽然在地图或者游戏中,路径是以图形的形式被表示的,而在转向行为中,其不过是一系列航点。其策略真是简单到不行。只要从第一个航点开始挨个寻找下去即可。

路径跟随这名字一听就知道要干嘛了:机车会沿着一个预定的路线行驶。虽然在地图或者游戏中,路径是以图形的形式被表示的,而在转向行为中,其不过是一系列航点。
其策略真是简单到不行。只要从第一个航点开始挨个寻找下去即可。

File?id=df5kjk97_1155cmc2g8d2_b

 

        private int _pathIndex = 0;
        private double _pathThreshold = 20;
        public void followPath(List<Vector2D> path,bool loop) {
            if (path.Count==0)
            {
                return;
            }
            Vector2D wayPoint = path[_pathIndex];
            if (wayPoint==null)
            {
                return;
            }
            if (_postion.dist(wayPoint)<_pathThreshold)
            {
                if (_pathIndex>=path.Count-1)
                {
                    if (loop)
                    {
                        _pathIndex = 0;
                    }

                }
                else
                {
                    _pathIndex++;
                }
            }
            if (_pathIndex>=path.Count-1&&!loop)
            {
                arrive(wayPoint);
            }
            else
            {
                seek(wayPoint);
            }
        }
路径索引(pathIndex)相当于是数组索引,用于指向下一个航点。路径阈值(pathThreshold)相当于航点间距。
首先是取得当前航点,如果航点不是一个有效2D向量,就返回,这么作就是说,即使传递一个空数组也不会报错。接着是判断,到航点间的距离是否足以切换到下一个航点,然后根据循环再判断最后一个航点索引是否归零。写起来是很啰嗦,实际上画出航点后,按部就班的执行以上逻辑,就会发现是很直观的。
有了航点就能移动了,以此调用最后一行的寻找函数已经有了不俗表现,但为了更优美一点,假设是最后一个航点又不要循环的话,采用到达行为可以使机车慢慢的靠近终点,而不会在终点左右摇摆。
测试:
<UserControl
    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"
    xmlns:local="clr-namespace:Steer" xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing" x:Class="Steer.PathTest"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    
    <Grid x:Name="LayoutRoot" Background="White">

    	<local:SteeredVehicle x:Name="myTarget" HorizontalAlignment="Left" Height="40" VerticalAlignment="Top" Width="40" RenderTransformOrigin="0.5,0.5">
    		<ed:RegularPolygon Fill="#FFFD00FF" Height="40" InnerRadius="1" PointCount="5" Stretch="Fill" Stroke="Black" StrokeThickness="0" UseLayoutRounding="False" Width="40"/>
    	</local:SteeredVehicle>

    </Grid>
</UserControl>

    public partial class PathTest : UserControl
    {
        private List<Vector2D> _path;
        
        public PathTest()
        {
            InitializeComponent();
            Loaded += new RoutedEventHandler(PathTest_Loaded);
        }

        void PathTest_Loaded(object sender, RoutedEventArgs e)
        {
            _path = new List<Vector2D>();
            LayoutRoot.MouseLeftButtonUp += new MouseButtonEventHandler(LayoutRoot_MouseLeftButtonUp);
            CompositionTarget.Rendering += new EventHandler(CompositionTarget_Rendering);
        }

        void CompositionTarget_Rendering(object sender, EventArgs e)
        {
            myTarget.followPath(_path, true);
            myTarget.update();
        }

        void LayoutRoot_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
        {
            _path.Add(new Vector2D(e.GetPosition(null).X, e.GetPosition(null).Y));
        }
    }

 

相关文章
|
容器
Silverlight & Blend动画设计系列二:旋转动画(RotateTransform)
原文:Silverlight & Blend动画设计系列二:旋转动画(RotateTransform)   Silverlight的基础动画包括偏移、旋转、缩放、倾斜和翻转动画,这些基础动画毫无疑问是在Silverlight中使用得最多的动画效果,其使用也是非常简单的。
965 0
|
容器 数据可视化 内存技术
Silverlight & Blend动画设计系列一:偏移动画(TranslateTransform)
原文:Silverlight & Blend动画设计系列一:偏移动画(TranslateTransform)   用户界面组件、图像元素和多媒体功能可以让我们的界面生动活泼,除此之外,Silverlight还具备动画功能,它可以让应用程序“动起来”。
794 0
Silverlight & Blend动画设计系列四:倾斜动画(SkewTransform)
原文:Silverlight & Blend动画设计系列四:倾斜动画(SkewTransform)   Silverlight中的倾斜变化动画(SkewTransform)能够实现对象元素的水平、垂直方向的倾斜变化动画效果。
796 0
|
容器
Silverlight & Blend动画设计系列五:故事板(StoryBoards)和动画(Animations)
原文:Silverlight & Blend动画设计系列五:故事板(StoryBoards)和动画(Animations)   正如你所看到的,Blend是一个非常强大的节约时间的设计工具,在Blend下能够设计出很多满意的动画作品,或许他具体是怎么实现的,通过什么方式实现的我们还是一无所知。
912 0
Silverlight & Blend动画设计系列七:模糊效果(BlurEffect)与阴影效果(DropShadowEffect)
原文:Silverlight & Blend动画设计系列七:模糊效果(BlurEffect)与阴影效果(DropShadowEffect)   模糊效果(BlurEffect)与阴影效果(DropShadowEffect)是两个非常实用和常用的两个特效,比如在开发相册中,可以对照片的缩略图添加模糊效果,在放大照片的过程中动态改变照片的大小和模糊的透明度来达到一个放大透明的效果。
1046 0
Silverlight & Blend动画设计系列六:动画技巧(Animation Techniques)之对象与路径转化、波感特效
原文:Silverlight & Blend动画设计系列六:动画技巧(Animation Techniques)之对象与路径转化、波感特效   当我们在进行Silverlight & Blend进行动画设计的过程中,可能需要设计出很多效果不一的图形图像出来作为动画的基本组成元素。
1003 0
|
API
Silverlight & Blend动画设计系列十:Silverlight中的坐标系统(Coordinate System)与向量(Vector)运动
原文:Silverlight & Blend动画设计系列十:Silverlight中的坐标系统(Coordinate System)与向量(Vector)运动   如果我们习惯于数学坐标系,那么对于Silverlight中的坐标系可能会有些不习惯。
1232 0

热门文章

最新文章