(克隆github)博客地址：http://lamyoung.com/https://forum.cocos.org/u/lamyoung/activity/topics小游戏(

简单易用，跨平台，20KB！效果效果预览：https://www.bilibili.com/video/BV1cf4y1H7Pa无论写代码还是写工具，都要明确输入与输出。输入：零碎的字体图片(通常是数字)处理：可动态调整参数，预览实时效果输出：一张合图以及字体信息文件xxx.fnt为何要重新写一个轮子呢？Glyph

https://en.wikipedia.org/wiki/JPEG但🥚，在思考前，可以考虑是否有前任👩的轮子。毕竟时间也是一种成本。很快，很有型地在大型交友网站

Shader如何抄shader3D折纸渐变色文字3.0水排序效果点击“阅读原文”查看精选导航“点赞“

在某些层面能替代PBR的次世代渲染方案。效果动图效果预览视频https://www.bilibili.com/video/BV1B64y147xc视频预览实现实现原理是，用一张特制的纹理图(采样出来的纹理)，加上一段shader代码(法向量映射纹理)，模拟出次世代的效果(场景中无需光照)。原理代码参考

保姆级手把手教学，从头开始写！效果效果预览:前言感谢大家的观看，感谢大家的点赞留言分享支持，感谢3D折纸效果的实现(视频+文字)中老板们的赞赏支持，非常感谢。3D折纸效果的赞赏时常有人问我怎么学习shader，其实白玉无冰学的也很浅，推荐几个曾经用过的在线学习网站。https://thebookofshaders.com/https://webglfundamentals.orghttps://learnopengl-cn.github.io/里面有自带环境编辑，在线编写代码，边学边做。了解了一些概念(顶点着色器/片元着色器/uniform/glsl语法/内置函数/uv坐标)后，参考Cocos官方文档和论坛帖子。看看Cocos内置的effect语法怎么写的，动手改改其中的几个数值，看看效果。在有需求要做的时候，网上搜一搜，大部分效果都能搜到，剩下的就是借鉴搬运了。这次我们来讲讲如何把搜到的shader化为己有，在Cocos中实现其中的效果。本次演示使用Cocos

this._mesh);射线检测从摄像机发出一条射线，检测mesh，返回距离，再根据射线检测起点和方向求出触摸点。射线检测private

this.drawGraphics.fill();}对于多层水，按照从高到低的顺序画图，低处的水覆盖高层。如下图所示，按照0,1,2的顺序画对应的水层。多层水private

arrive与寻找的期望速度类似，方向是一样的，区别是快到的时候速度会减少。可以加一个距离控制，在还没达到这个距离时，先以最快的速度过去，比较近的时候减缓速度。arrive(target:

效果折纸效果实现整体思路思路遵循以下几步初始化一个多边形。折叠后分割成两个多边形。如果需要继续分割，对场上的所有多边形进行折叠，折叠出新的多边形的层级正好与原来的相反。整体思路所以，所有的计算和渲染都可以转换成对一个多边形的操作。为了简化计算，我们约定初始化的多边形为凸多边形。这么做有几个好处。折叠后生成的仍是凸多边形，并且对于每个多边形只会折叠出两个凸多边形渲染时，分割凸多边形为三角形特别方便，即能快速计算出顶点索引计算主要分为三块多边形分割线线交点轴对称分割观察触摸方向和多边形各个点的关系。可以发现，触摸方向

前言最近韭菜长的不错，公众号也有点长草了，出来割一波。割草逛论坛看到这么一个需求，有人想要圣旨一样布局的文本。问题于是白玉无冰梭哈一下，写了一个简易的组件供在座的各位参考。本字体组件支持(就是原本系统字组件Label的阉割版本)

默默地在背后关注她！前言在3d游戏中经常会用到镜头跟随效果，这次我们就来实现它！阅读本文需要一些的基本知识：向量基本运算（加法/减法/乘积）会调用四元数API接口运动学（速度/加速度/位移）效果预览如下（可调远近上下/弹性跟随）：实现相机跟随的原理就像是，你暗中跟随观察(尾随)你心仪的对象(Object)。既然是观察，就要与对象保持一定的距离。为了不被对象发现，我们观察的位置和对象的朝向有关。当然，你要看到对象，你的眼睛方向一定得看着对象吧，这就是视口方向。原理图针对我们要达到的效果，需要定义好以下几个变量。观察对象的朝向（上方向，前方向）摄像机与对象的距离（水平距离，垂直距离）最终我们需要算出以下几个玩意儿：相机位置相机旋转角度位置求相机的位置分两步：根据对象的前方向和相机的水平距离，求出中间点坐标根据对象的上方向和相机的垂直距离，求出相机的位置计算位置中文式伪代码如下：对象到中间点的向量

this._tillOffset);}效果预览小结巧用标志板！3d效果值得拥有！本文中出现的游戏开发程序员必备英语单词回顾：billboard

用2D素材实现3D效果!前言好久没写教程笔记了，不知大伙是否想念教程了？温馨提示：所有内容纯属个人瞎玩研究，如要上线项目，请自行评估~

你也推出3D编辑器，刚出来的时候，我并没有3d知识，摄像机都是胡乱摆的，写了个模仿蚂蚁庄园的demo。

这款游戏是借助Cocos2Dx引擎设计的一款基于移动端的跑酷游戏，类似天天酷跑，操作是控制小人来拾取金币和奖励以及躲避障碍物。我在这个项目当中所从事的工作是使用Cocos

o.rgb;在只有环境光的情况下，对于不同的全局光的系数，物体的亮度也不一样。漫反射漫反射(Diffuse)是基础光照模型的第二剑客，它不再是个常量。漫反射的效果会随着物体与光线的夹角变化而变化。

https://github.com/baiyuwubing/cocos-creator-3d-examples/tree/master/1-2-x点击“阅读原文”查看精选导航‘赞赏’“点赞“

总能找到对你有帮助的~前言白玉无冰写文已经一年多了，从原来的翻译文到后来的研究笔记文，一路走来，有些不错的文章整理推荐给大家。注意！大部分文章是研究笔记，出于兴趣爱好，学习记录的一些想法。并未在实际项目中使用过（当然有些被粉丝使用到项目中），需要大家认真考量哈。但是总能找到一些对大家游戏开发有帮助的地方，希望能给大家带来新思路，新想法。点击对应标题可以直达文章哦~整理主要分为以下几大类：shader物理挖洞物理流体物理粒子绳子纹理Cocos

fatFactor在外部控制这个肥胖系数，就达到了原理那个效果图啦。this.modelComponent.getMaterial(0).setProperty('fatFactor',

随便讲讲雾的原理以及旧版本的使用雾的方法。效果原理雾效(fog)是游戏中常用的一种效果，根据远近产生不同的深度的雾效果。这个效果涉及两个关键字。距离颜色在着色器中，雾效的距离，一般转换成计算雾效因素(factor_fog)，这个数字范围是0-1。1

discard;}加点描边还可以混点颜色，对阈值附近的像素点加一些颜色，就能实现燃烧效果啦。float

点渲染模式去渲染每个粒子。主要思路如下：根据节点位置创建粒子组的位置创建粒子组后，计算相应的纹理坐标每帧根据物理粒子的位置，更新粒子的顶点坐标如何把物理世界的位置同步到

this.camera_main.worldToScreen(this.NodePos_bows.node.worldPosition);然后，在通过摄像机做出一条射线。const

packable接下来就大致讲解主要特性的原理吧。分割多边形这次不采用切耳法分割分割了，而是采用poly2tri这个库去分割(注意这个库有严格的限制)。主要计算顶点索引过程如下。//

一个控制移动和视角的遥感控制器3D示例项目。效果原理在贪吃蛇大作战！蛇移动的思考与实现!中使用到一个摇杆控制器，不过这是在2D层面上，这次把它改到3D上。摇杆摇杆的原理大致是把触摸点的位置传给需要的组件。(参考KUOKUO的摇杆组件改的)监听触摸事件后，需要做一次坐标转换。在Cocos

即可。然后，我们计算该像素对应的亮度值（luminance），这是通过对每个颜色分量乘以一个特定的系数再相加得到的。我们使用该亮度值创建了一个饱和度为0的颜色值，并使用saturation

源码位置：https://github.com/cocos-creator/engine/blob/master/cocos2d/core/renderer/assembler-2d.js

就行了(误)，搜了一下，找到一个库，直接拿来改改就行了。https://github.com/timohausmann/quadtree-js//export

。原理为了达到这种透视效果，把握一个原则，远小近大，远慢近快。准备一张梯形的图片，让下面的图形快速移动，上面的图形慢速移动，就能有3D滚动的感觉了。Sprite

选取一个超小的图片。渲染模式选择平铺(TILED)，修改节点大小。材质选择上面创建的材质。预览就能看到这张图片动起来了。实现原理为什么选择平铺模式可以实现这个效果呢？简单的

开发"物理挖洞之分块！"的技术分享。如果对你有点帮助，欢迎分享给身边的朋友。天下事有难易乎？为之，则难者亦易矣；不为，则易者亦难矣。人之为学有难易乎？学之，则难者亦易矣；不学，则易者亦难矣。

记录已经画的长度长度}这么倒着遍历会出现一个问题，就是尾巴的纹理会被头覆盖。所以计算长方形的顶点索引后，要整体反转，让他从头开始画。主要代码如下。let

https://github.com/baiyuwubing点击“阅读原文”查看精选导航“在看”是最大的鼓励▼

，实现画线纹理。不过在连接处存在缝隙。那么怎么处理这个缝隙呢？只需要在连接点画一个圆，这样缝隙就能去掉了。那么怎么画圆呢？可以把圆看成是正多边形，根据半径和圆心的关系，可以确认位置坐标。可参考

"画线纹理的一种简单实现！"的技术分享。如果对你有点帮助，欢迎分享给身边的朋友。更多精彩讲一讲这个公众号吧！2019年第一季度原创精选整理！初探精灵中的网格渲染模式

代码.看看最终效果。这边大致捋捋思路，分享一下这个3d效果是怎么实现的。首先挖洞思路还是使用挖洞-另一种实现。接着使用使用

时，图片会没了？翻翻官方文档看看这个是什么东西？https://docs.cocos.com/creator/manual/zh/components/sprite.htm按照文档，下载

https://github.com/baiyuwubing/cocos-creator-examples点击“阅读原文”查看更多精选“在看”是最大的鼓励▼

剩余不要用的多边形清空。this._physicsPolygonColliders.slice(_physicsPolygonColliders_count).forEach((v

分享作者：白玉无冰视频编辑：张晓衡hello大家好我是白玉无冰我讲一下我写这个公众号的经历一切源于去年的某一个月加入了个微信群然后就开始这这个奇怪之旅其实我从事游戏行业已经五年了大概五年把实习时间也算上去但是跟各位大佬比起来我可能还是一个小弟因为这次偶然的机遇加入这个群看到各位分享各种经验我也跟着一起分享我在开发途中遇到的这些问题怎么说呢其实啊首先感谢张哥让我带路这个领域接着感谢Cocos

优化篇来了！图文！视频！源码！通通来了！文末查看完整代码。首先，感谢各位看官的支持！你们的分享(在看)是对白玉无冰的最大鼓励！(鸡腿鸭腿是更新的最大动力！)回顾物理挖洞！涂抹地形!

规则。与上面不一样的地方是，我是计算这个多边形被几个大的多边形包围，当是偶数的时候填充泥土的颜色，当是奇数时，填充背景的颜色。当然，需要注意的是，计数越大的要越后画，这样才能达到最终效果。//

https://github.com/baiyuwubing/cocos-creator-examples/tree/master/attacked点击“阅读原文”查看完整代码点个“在看”再走呗▼

length(uv));}接着，画一堆小圆，把这些圆围成一个圈。只需要把这个圈平均分成多份，每一个圆都有一个角度，再根据半径和角度的关系，可以求出偏移坐标。float

最近看到一个有意思的图片，包含了鲜为人知的秘密。。。先看看这张有意思的图片。图左应该讲的是基督教中的三位一体。翻译成中文如下。当然这不是我们的重点，我们的重点在右边这个图。讲的是js中相等操作。==是js中的宽松相等(loose

https://github.com/baiyuwubing/cocos-creator-examples/tree/master/water点击“阅读原文”查看完整代码我就知道你“在看”▼

https://github.com/baiyuwubing/cocos-creator-examples/tree/master/parabola点击“阅读原文”查看完整代码我就知道你“在看”▼

大量物体以随机初速度的飞溅运动！文章底部附完整代码！效果预览像火山喷发、烟花等等运动，都是物体随机飞溅运动。这个运动其实是抛物运动。抛物运动也可以看成是匀加速运动。假设一个物体的初速度为v_0，加速度为a，某一个时刻t的速度公式如下：v

https://github.com/baiyuwubing/cocos-creator-examples/tree/master/snake点击“阅读原文”查看完整项目我就知道你“在看”▼