欢乐坦克大战学习笔记 typescript版本

1)笔记

1)创建一个标准项目
  (1)项目路径,不要使用中文和空格;

  (2)Canvas: Node + cc.Canvas组件(设计分辨率 + 适配策略)
     Main Camera: Node + cc.Camera

  (3)做一个规范的项目要有一个清晰的目录结构;

  (4)导入地图

2)创建游戏场景
  瓷砖铺地图(节省资源,铺更大的地方)
  添加widget: 让在左下角

  (1)Sprite: Tiled模式,能够使用小的砖块,平铺游戏地图;
  (2)注意一下节点的层次关系,节点的命名要规范;

3)制作游戏摇杆
  向量: x, y--> cos sin

4)搭建物理地图,开启物理引擎
  step1: 给物体加一个刚体cc.RigidBody-->物理计算-->形状不会发生变化
     注意类型是: 动态还是静态
       坦克可以动,因此是dynamic;
       墙壁不可以动,因此是static

  step2: 给这个物体加一个形状; 
      tank: 1个PhysicsCircleCollider 
      墙壁: 4个 PhysicsBoxCollider

  step3: 编写脚本来开启物理引擎
  	a.打开物理引擎;
  	b.配置物理引擎的重力大小;
  	c.配置物理引擎的调试区域;

  注意: 
  	重力默认值(0, -320);
  	碰撞组件和物理引擎的是2个东西;     
  	开启物理引擎一定是在onLoad,在start里面是没有效果的;
  	不想看到,则在aabb包围盒去掉;

5)摇杆控制坦克移动
  (1)编写坦克控制的脚本;
  (2)定义一些属性:坦克的速度speed, joystick摇杆对象;
  (3)获取摇杆的方向,根据摇杆方向来操作坦克的物理刚体,给坦克的物理刚体一个摇杆方向的线性速度;
  (4)已知向量(x,y),求角度: 
    var r = Math.atans(y, x);
    var degree = r * 180 / math.PI;

    degree = 360 - degree; // 逆时针 转 顺时针
    degree = degree + 90;  // 转换为cocos的角度

  (5)rotation:顺时针
      angle:数学中的逆时针

6)游戏地图滚动
  (1)实现地图滚动的方式: 坦克移动,带着摄像机移动,摄像机变化了,拍摄画面也跟着变了;
  (2)摄像机是如何拍摄画面的:
    以摄像机为中心,以屏幕大小为范围来拍摄画面;
  (3)让摄像机跟着玩家走,玩家走到哪里,摄像机就拍摄到哪里;
  (4)当我们的刚体,碰到边界的时候,由于摩擦力,导致我们有了角速度,所以我们需要固定旋转;
  (5)游戏的UI,和地图要独立开,地图的滚动,不会影响UI:
     添加分组,单独创建一个UI摄像机,专门负责绘制UI,游戏摄像机专门负责绘制游戏地图相关;

  笔记:
    拖动摄像机,发现拍摄的画面变化,因此有了思路;

    摩擦力引起的旋转-->Fixed Rotation勾选上;

7)打包发布微信小游戏

 

发布了1512 篇原创文章 · 获赞 135 · 访问量 166万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 程序猿惹谁了 设计师: 上身试试

分享到微信朋友圈

×

扫一扫,手机浏览