UGUI系列-列表添加物理效果(Unity3D)

简介: 最近要做一个滑动列表界面,美术的效果图为用绳子连接的短板,上面附带信息,看图的感觉似乎添加点物理效果(让绳子不规则的带动短板晃动)会显得更加真实,于是为这个界面加了些物理效果,感觉还不错,特此记录下。

一、前言

最近要做一个滑动列表界面,美术的效果图为用绳子连接的短板,上面附带信息,看图的感觉似乎添加点物理效果(让绳子不规则的带动短板晃动)会显得更加真实,于是为这个界面加了些物理效果,感觉还不错,特此记录下。


二、正文

目标: 为UGUI滑动列表中的Element添加物理效果,模拟出绳子微微晃动的感觉。

网络异常,图片无法展示
|

关键Component: Scroll View,Rigidbody2D和Distance Joint2D。

基本思路:1、按照传统方式为Scroll View添加Element

网络异常,图片无法展示
|

2、在添加Element时,用脚本动态为最上方(第一个)的Element添加一个Rigidbody2D组件。 3、在添加Element时,用脚本动态为第二个及以后每一个Element添加一个Rigidbody2D和DistanceJoint2D组件,并设置与前一个Element的关联。 4、在需要晃动的时候,给第二个开始的每一个Element所附带的Rigidbody2D一个力即可。

注意事项:

网络异常,图片无法展示
|

1、不要直接为Content下的Element添加Rigidbody2D和DistanceJoint2D组件,因为Content上的Layout组件会更新他们的位置,导致晃动失败。应该把物理组件添加到Element的子节点上。

网络异常,图片无法展示
|

2、为第一个Element添加的Rigidbody2D设置为Static,后面的Element的Rigidbody2D设置为Dynamic。

网络异常,图片无法展示
|

3、第二个及以后的Element添加Rigidbody2D时,应该调整gravityScale为0,避免其受到重力影响在刚添加的时候就直接掉下去了,同时添加的DistanceJoint应该打开autoConfigureDistance开关,让它能自动获取到两个Element之间的距离。

网络异常,图片无法展示
|

4、设置一个激活命令,当激活时,打开第二个Element及以后的Rigidbody2D上gravityScale,设置DistanceJoint2D的drag属性,并关闭autoConfigureDistance开关,使distance不会再次更新。当然,也应该确保maxDistanceOnly开关开启,和breakForce设置为Infinity(默认)。

网络异常,图片无法展示
|

5、Element的结构如图,Connexions下的四个Transform是为了让上下Element找到对应的目标,以保证红色的绳子(Ropes:R1和R2)能够得到正确的旋转及长度设置(其实如果为了获取旋转而不调整绳子长度,直接获取上下Rigidbody2D相对位置,效果应该也是一样的)。

网络异常,图片无法展示
|

6、绳子要设定正确的锚点,这样旋转起来效果才能正确

关键代码:HHDScrollViewPhysics2D类: Scroll View上带的脚本,留出为Scroll View添加Element的接口,添加的每一个Element都必须带有HHDScrollViewItem_TwoNode脚本

网络异常,图片无法展示
|

网络异常,图片无法展示
|

网络异常,图片无法展示
|

HHDScrollViewItem_TwoNode类: 每一个Element上带的脚本

网络异常,图片无法展示
|

网络异常,图片无法展示
|

网络异常,图片无法展示
|

网络异常,图片无法展示
|

网络异常,图片无法展示
|



相关文章
|
1月前
使用 SAPGUI 的 Docking 控件将屏幕划分成若干子区域试读版
使用 SAPGUI 的 Docking 控件将屏幕划分成若干子区域试读版
22 6
使用 SAPGUI 的 Docking 控件将屏幕划分成若干子区域试读版
|
4月前
|
算法 图形学 UED
Unity Hololens2开发|(八)MRTK3空间操作 BoundsControl(边界控制)
Unity Hololens2开发|(八)MRTK3空间操作 BoundsControl(边界控制)
|
5月前
|
vr&ar
visionOS空间计算实战开发教程Day 8 附属视图和动画
通过前面的学习我们已经知道setupContentEntity用于初始化实体对象,getTargetEntity用于根据模型的名称查找到指定模型。addCube(name: String, position: SIMD3<Float>, color: UIColor)中包含三个参数,name用于指定所创建盒子的名称,position用于指定盒子所处的位置,同样是按人所处位置为参照坐标,color用于指定盒体的颜色。
33 0
|
6月前
|
缓存
《QT从基础到进阶·二十二》QGraphicsView显示大量图形项item导致界面卡顿的解决办法
《QT从基础到进阶·二十二》QGraphicsView显示大量图形项item导致界面卡顿的解决办法
226 0
|
11月前
|
编译器 API 图形学
【unity细节】基于unity子对象(如相机)为什么无法进行z轴的拖拽移动和z轴自动归位的问题
【unity细节】基于unity子对象(如相机)为什么无法进行z轴的拖拽移动和z轴自动归位的问题
117 0
|
图形学
Unity中UGUI、粒子系统、Mesh混合使用保证层级正确
把粒子、Mesh渲染到一张RenderTexture上,然后把这张RenderTexture贴到一张RawImage就可以解决这种类似的UI,Mesh,粒子穿插使用的问题。这种方法由于比较麻烦就没有使用。
|
API Android开发
Material Design 实战 之 第六弹 —— 可折叠式标题栏(CollapsingToolbarLayout) & 系统差异型的功能实现(充分利用系统状态栏空间)
Material Design 实战 之 第六弹 —— 可折叠式标题栏(CollapsingToolbarLayout) & 系统差异型的功能实现(充分利用系统状态栏空间)
|
图形学 流计算
Unity 基于LineRenderer组件实现连线功能
Unity 基于LineRenderer组件实现连线功能
581 1
Unity 基于LineRenderer组件实现连线功能
|
异构计算
案例分享:Qt流水线图像显示控件(列刷新、1ms一次、缩放、拽拖、拽拖预览、性能优化、支持OpenGL GPU加速)
案例分享:Qt流水线图像显示控件(列刷新、1ms一次、缩放、拽拖、拽拖预览、性能优化、支持OpenGL GPU加速)
案例分享:Qt流水线图像显示控件(列刷新、1ms一次、缩放、拽拖、拽拖预览、性能优化、支持OpenGL GPU加速)
|
图形学 容器
UGUI系列-实现层级菜单(Unity3D)
层级菜单在Unity中用到的并不多,主要是做分类的时候用的比较多,今天就给大家分享几个层级代码,扩充一下,写成插件也是不错的。