关于贝塞尔曲线曲线我们再前面的文章提到过《Unity 教程之-在Unity3d中使用贝塞尔曲线》,那么本篇文章我们来深入学习下,并自定义实现贝塞尔曲线编辑器,贝塞尔曲线是最基本的曲线,一般用在计算机 图形学和 图像处理。贝塞尔曲线可以用来创建平滑的曲线的道路、 弯曲的路径就像 祖玛游戏、 弯曲型的河流等。看下效果图 !

一条贝塞尔曲线是由一组定义的控制点 P0到 Pn,在 n 调用它的顺序 (n = 1 为线性,2 为二次,等.)。第一个和最后一个控制点总是具有终结点的曲线;然而,中间两个控制点 (如果有的话) 一般不会位于曲线上 。

贝塞尔曲线包含两个控制点即 n = 2 称为线性的贝塞尔曲线

贝塞尔曲线包含三个控制点即 n = 3 称为二次贝塞尔曲线

贝塞尔曲线包含四个控制点即 n = 4,所以称为三次贝塞尔曲线。

贝塞尔曲线返回点的贝塞尔函数,使用线性插值的概念作为基础。所以,让我们了解什么首先是线性插值。

两个点之间的线性插值的点获取那两个点之间,0 <= t <= 1,像 Mathf.Lerp 。

插值点,与 P 公式P0和 P1可以写成,

P = P0+ t (P1 – P0),0 <= t <= 1

在这里,为得到插值的点我们添加 tth指向 P 的分数与这两个之间的距离0.所以,

For T = 0,P = P0.

For T = 1,P = P1.

For T = 0.5,P = P0和 P1间的点.

线性的贝塞尔曲线:

线性的贝塞尔曲线有两个控制点。为给出了两个点 P0和 P1一个线性的贝塞尔曲线是只是这两个点之间的直线。曲线是相当于线性插值给出,

B(t) = P0+ t (P1 – P0) = (1-t) P0 + tP1 ,0 <= t <= 1

线性贝塞尔曲线如何计算出来的是如下所示:

二次贝塞尔曲线:

二次贝塞尔曲线具有三个控制点。二次贝塞尔曲线是点对点的两个线性贝塞尔曲线的线性插值。为给出了三个点 P0、P1和 P2一条二次贝塞尔曲线,其实是两条线性的贝塞尔曲线,线性贝塞尔曲线的 P0和 P1和 线性贝塞尔曲线P1和 P2. 所以,给出二次贝塞尔曲线 :

B(t) = (1-t) BP0P1(t) + t BP1P2(t),0 <= t <= 1

B(t) = (1-t) [(1-t) P0 + tP1] + t [(1-t) P1+ tP2],0 <= t <= 1

通过重新排列上述方程,

B(t) = (1-t)2P0+ 2 (1-t) tP1 + t2P2, 0 <= t <= 1

二次贝塞尔曲线动画计算如下所示:

三次贝塞尔曲线:

三次方贝塞尔曲线具有四个控制点。二次贝塞尔曲线是 点对点的两条二次贝塞尔曲线的线性插值。对于给出的四个点 P0、P1、P2和 P3三次方贝塞尔曲线,是二次贝塞尔曲线P0、P1和 P2和 二次贝塞尔曲线P1、P2和 P3 得到的 线性插值 .所以,给出三次方贝塞尔曲线

B(t) = (1-t) BP0,P1,P2(t) + t BP1,P2,P3(t),0 <= t <= 1

B(t) = (1-t) [(1-t)2P0+ 2 (1-t) tP1 + t2P2] + t [(1-t)2P1+ 2 (1-t) tP2 + t2P3],0 <= t <= 1

通过重新排列上述方程中,

B(t) = (1-t)3P0 + 3(1-t)2tP1+ 3 (1-t) t2P2 + t3P3 0 <= t <= 1

三次贝塞尔曲线计算如下所示:

所以,一般可以作为点对点的线性插值获得从两个相应的贝赛尔曲线的程度 n-1 的两个点定义程度 n 的贝塞尔曲线(就是高级的是两个低一级的线性插值)。

在大多数应用程序使用两种二次或三次方贝塞尔函数。然而,你总可以使用更高程度贝塞尔函数绘制更复杂的曲线,但较高程度贝塞尔函数的计算是比较复杂和增加处理开销。所以,而不是使用更高的学位贝塞尔函数绘制更复杂的曲线,你可以多次使用两种二次或三次方贝塞尔函数。在这里,我创建了一个演示和绘制的∞形曲线,使用三次方贝塞尔函数中循环,如下所示。

若要创建一条曲线,如上所示,请创建场景,如下所示:

现在,将Bezier.cs脚本附加到 Bezier Manager

Bezier.cs:

using UnityEngine;

using System.Collections.Generic;

[RequireComponent(typeof(LineRenderer))]

public class Bezier : MonoBehaviour

{

public Transform[] controlPoints;

public LineRenderer lineRenderer;

private int curveCount = 0;

private int layerOrder = 0;

private int SEGMENT_COUNT = 50;

void Start()

{

if (!lineRenderer)

{

lineRenderer = GetComponent();

}

lineRenderer.sortingLayerID = layerOrder;

curveCount = (int)controlPoints.Length / 3;

}

void Update()

{

DrawCurve();

}

void DrawCurve()

{

for (int j = 0; j

{

for (int i = 1; i <= SEGMENT_COUNT; i++)

{

float t = i / (float)SEGMENT_COUNT;

int nodeIndex = j * 3;

Vector3 pixel = CalculateCubicBezierPoint(t, controlPoints [nodeIndex].position, controlPoints [nodeIndex + 1].position, controlPoints [nodeIndex + 2].position, controlPoints [nodeIndex + 3].position);

lineRenderer.SetVertexCount(((j * SEGMENT_COUNT) + i));

lineRenderer.SetPosition((j * SEGMENT_COUNT) + (i - 1), pixel);

}

}

}

Vector3 CalculateCubicBezierPoint(float t, Vector3 p0, Vector3 p1, Vector3 p2, Vector3 p3)

{

float u = 1 - t;

float tt = t * t;

float uu = u * u;

float uuu = uu * u;

float ttt = tt * t;

Vector3 p = uuu * p0;

p += 3 * uu * t * p1;

p += 3 * u * tt * p2;

p += ttt * p3;

return p;

}

}

在这里,CalculateCubicBezierPoint 函数是 Cubiz 贝塞尔函数,我已解释了上面执行。DrawCurve 函数绘制两条 三次方贝塞尔曲线。

Between P0, P0- control Point1, P1- control Point1 and P1.

Between P1, P1- control Point1, P0- control Point2 and P0.

任何控制点 可处理其相应的曲线的曲率。你可以在任何时间改变曲线,通过拖动任意控制点,如下所示:

0

原文:http://www.xici.net/d224478514.htm

Unity3d游戏中自定义贝塞尔曲线编辑器[转]的更多相关文章

  1. 【Unity3d游戏开发】游戏中的贝塞尔曲线以及其在Unity中的实现

    RT,马三最近在参与一款足球游戏的开发,其中涉及到足球的各种运动轨迹和路径,比如射门的轨迹,高吊球,香蕉球的轨迹.最早的版本中马三是使用物理引擎加力的方式实现的足球各种运动,后来的版本中使用了根据物理 ...

  2. Unity游戏中使用贝塞尔曲线

    孙广东   2015.8.15 比方在3D rpg游戏中.我们想设置弹道,不同的轨迹类型! 目的:这篇文章的主要目的是要给你关于在游戏怎样使用贝塞尔曲线的基本想法. 贝塞尔曲线是最主要的曲线,一般用在 ...

  3. NGUI研究院之在Unity中使用贝塞尔曲线(六)[转]

    鼎鼎大名的贝塞尔曲线相信大家都耳熟能详.这两天因为工作的原因需要将贝塞尔曲线加在工程中,那么MOMO迅速的研究了一下成果就分享给大家了哦.贝塞尔曲线的原理是由两个点构成的任意角度的曲线,这两个点一个是 ...

  4. 在Unity中使用贝塞尔曲线(转)

    鼎鼎大名的贝塞尔曲线相信大家都耳熟能详.这两天因为工作的原因需要将贝塞尔曲线加在工程中,那么MOMO迅速的研究了一下成果就分享给大家了哦.贝塞尔曲线的原理是由两个点构成的任意角度的曲线,这两个点一个是 ...

  5. NGUI研究之在Unity中使用贝塞尔曲线

    鼎鼎大名的贝塞尔曲线相信大家都耳熟能详.这两天由于工作的原因须要将贝塞尔曲线加在project中.那么我迅速的研究了一下成果就分享给大家了哦.贝塞尔曲线的原理是由两个点构成的随意角度的曲线,这两个点一 ...

  6. 贝塞尔曲线:原理、自定义贝塞尔曲线View、使用!!!

    一.原理 转自:http://www.2cto.com/kf/201401/275838.html Android动画学习Demo(3) 沿着贝塞尔曲线移动的Property Animation Pr ...

  7. svg path中的贝塞尔曲线

    首先介绍以下什么是贝塞尔曲线 贝塞尔曲线又叫贝茨曲线(Bezier),由两个端点以及若干个控制点组成,只有两个端点在曲线上,控制点不在曲线上,只是控制曲线的走向. 控制点个数为0时,它是一条直线; 控 ...

  8. Unity3d 游戏中集成Firebase 统计和Admob广告最新中文教程

    之前写过俩相关的教程,最近发现插件官方更新了不少内容,所以也更新一篇Firebase Admob Unity3d插件的教程,希望能帮到大家. Firebase Admob Unity3d插件是一个Un ...

  9. Canvas中绘制贝塞尔曲线

    ① 什么是贝塞尔曲线? 在数学的数值分析领域中,贝济埃曲线(英语:Bézier curve,亦作“贝塞尔”)是计算机图形学中相当重要的参数曲线.更高维度的广泛化贝济埃曲线就称作贝济埃曲面,其中贝济埃三 ...

随机推荐

  1. 初学者利用git 上传代码到Coding的简单操作步骤

    1.首先登陆coding网站注册账号https://coding.net/ (注册完后需登陆邮箱激活邮件) 2.登陆刚注册的coding账号 ,添加项目 添加项目—〉输入项目名称—〉输入对项目的简单描 ...

  2. Nim教程【三】

    这是国内第一个关于Nim的系列教程 (至少我百度和必应是没有找到类似的教程) 先说废话 有人说 Golang的编译器/工具链也学互联网行业跟风拿用户当测试,简直一点素质没有. 还有人说 Go社区的风气 ...

  3. 解决IIS Express 80端口被占用的情况

    VS2012运行站点的时候提示“无法启动IIS Express Web服务器,端口80正在使用” 于是CMD查看了一下端口使用情况,并且在任务管理器中查看相应的进程,但始终觉得不对,因为显示是Syst ...

  4. [WinAPI] API 9 [文件的删除、复制和移动功能]

    Windows系统为文件的删除.复制.重命名或移动文件提供了相应的API函数.删除文件使用DeleteFile函数:复制文件使用CopyFile函数:重命名文件和移动文件实际是一个操作,使用MoveF ...

  5. SQL——字符串处理函数

    1) ASCII Format:ASCII ( character_expression ) Function:返回表达式最左端字符的ASCII值. eg: select ASCII('abcdef' ...

  6. 深入理解JavaScript 事件

    本文总结自<JavaScript高级程序设计>以及自己平时的经验,针对较新浏览器以及 DOM3 级事件标准(2016年8月),对少部分内容作了更正,增加了各种例子及解析. 如无特殊说明,本 ...

  7. paip.元数据驱动的转换-读取文件行到个list理念 uapi java php python总结

    paip.元数据驱动的转换-读取文件行到个list理念 uapi java php python总结 #两个思路 1.思路如下:使用file_get_contents()获取txt文件的内容,然后通过 ...

  8. paip.gui控件tabs控件加载内容的原理以及easyui最佳实现

    paip.gui控件tabs控件加载内容的原理以及easyui最佳实现 //////////////tabs控件的加载 同form窗体一样,俩个方式 两个方式:一个是url,简单的文本可以使用这个,不 ...

  9. 白条VS花呗,快餐式消费金融成巨头新战场

    在这一次的国庆假期前,90后网红密子君吃空麦当劳事件引发了网友们的热议.短短半个小时,这位90后网红就吃光了25包薯条,随后又吃下两杯麦旋风,其疯狂举动引得四周食客纷纷围观拍照.那么,是什么刺激这位9 ...

  10. 更新日志 - fir.im 主题壁纸来了

    fir.im 产品开发团队最近主要在优化应用管理后台和 BugHD 后台,新版应用管理后台很快会与大家见面. 本周其他更新内容简单概述如下: 1.fir.im 工具页添加壁纸主题包 有很多用户很喜欢 ...