宣武高端网站开发：MoscrifSDK-移动开发人员跨平台开发工具简介

宣武高端网站开发在过去的几年里，移动设备变得非常流行。这种流行程度仍在上升，移动设备显然正在将老式的个人电脑和笔记本电脑挤出市场。即使IOS和安卓是目前为止最受欢迎的移动平台，更新平台的数量也在不断增加，从而使得开发者很难达到期望和广泛的受众。

因此，不可能单独为每个平台开发一个应用程序/游戏，仅仅因为它太昂贵和耗时。相反，许多开发人员现在已经开始使用跨平台解决方案，让他们只需开发一次移动应用程序，就可以轻松地将其移植到多个移动设备上。MoscrifSDK就是这样一个工具。

MoscrifSDK

Moscrif是一个适合现代移动开发人员的跨平台开发工具。目前，它支持80%的设备，而且随着SDK的每一个新版本，这个数字都在上升。除了著名的iOS和Android平台，Moscrif还支持Kindle、Bada和Nook。对新发布的WindowsPhone的支持定于2013年年中发布。

与其他类似解决方案相比，主要优势是：

• 免费许可证

  -Moscrif提供免费许可证，使其成为所有开发商的理想选择。

• JavaScript

  Moscrif基于JavaScript，因此不需要学习任何高级编程语言。大多数开发人员已经熟悉这种语言，而且由于JavaScript非常容易学习，所以它也是初学者的理想选择。

• 高性能

  Moscrif是唯一的跨平台开发工具，它为移动游戏提供了惊人的50 fps，即使使用最复杂的图形也可以使它们顺利运行。

[数据源]

在我们开始之前

在我们开始开发之前，我们需要为环境做好准备。Moscrif附带了它自己的IDE，包括在SDK下载中。准备完整的环境只需9分钟，所以您可以非常快地开始键入第一行代码！

Moscrif可在其主页上免费获得：http://moscrif.com/get-started.

用Moscrif构建Billiard游戏应用程序

为了便于介绍，我们将使用MoscrifSDK创建一个简单的Billiard游戏演示。

物理发动机

模拟现实世界的行为可能是一项艰巨的任务。因此，Moscrif依赖于众所周知的Box2x物理引擎，除了开源之外，还被许多主要平台使用，比如任天堂DS和Wii。甚至流行的“愤怒的小鸟”游戏也依赖于这个引擎。

典型的Box2x模拟包括几个关键元素，如世界、身体和关节。所有这些共同合作，提供一个真实的世界可信的模拟。世界元素本身定义了影响其内部所有物体的重力，并提供了几个被称为当这些物体相互碰撞时发生的事件。

基本上有两种类型的物体会影响最终行为-静态和动态。静态物体(如本演示中的障碍物)从不移动。另一方面，根据世界上的力(重力等)，对动态物体进行充分的模拟和运动。台球是物体，或身体，包含一些其他重要的性质，影响他们的行为。根据Moscrif的API，这些是：

• 密度：

  身体的密度。

• 摩擦：

  身体的摩擦力影响身体的附着力。

• 反弹：

  弹跳值通常设置在0到1之间。考虑把球扔到桌子上。值为零意味着球不会反弹。这叫做非弹性碰撞。一个1的值意味着球的速度会被精确地反射出来。这被称为完全弹性碰撞。当我们碰撞两个不同弹跳的物体时，Box 2d使用一个值较大的物体来模拟弹跳。

物理Scene

宣武高端网站开发在Moscrif，Box2d世界由物理Scene班级，等级。在我们的演示中，这个类负责绘制对象，如表、它周围的边框、洞、球和球杆。场景中还包含了力条层，这些层绘制了负责控制命中力的条形图。

改写场景，改写画方法称为绘制所需对象。只有当球不移动时，球杆才会被拉出来。

例子：画表与画

          function draw(canvas)
      {
          canvas.clear(0xffaaaaaa);
          canvas.drawBitmapRect(res.image.table, 0, 0, res.image.table.width, res.image.table.height, res.number.tableLeft, res.number.tableTop, res.number.tableLeft + res.number.tableWidth, res.number.tableTop + res.number.tableHeight);
          var (x, y);
          if (!this.ballsMoving) {
              // save canvas without transalation
              canvas.save();
              // restirct the drawing area
              canvas.clipRect(res.number.tableLeft + res.number.mantinel, res.number.tableTop + res.number.mantinel, res.number.tableLeft + res.number.tableWidth - res.number.mantinel, res.number.tableTop + res.number.tableHeight-res.number.mantinel, #intersect );
              (x, y) = this.whiteBall.getPosition();
              x = x.toInteger();
              y = y.toInteger();
              canvas.translate(x, y);
              canvas.rotate(this.angle*180.0/Math.PI - 90);
              canvas.drawLine(0, 0, 0, res.number.lineLength, res.paint.line);
              // restore saved canvas
              canvas.restore();
          } 
          // draw box2d world 
          super.draw(canvas);
           
          if (!this.ballsMoving) {
              (x, y) = this.whiteBall.getPosition();
              x = x.toInteger();
              y = y.toInteger();
              // save canvas without transalation 
              
              canvas.save();
              // move and rotate canvas
              
              canvas.translate(x, y);
              canvas.rotate(this.angle*180.0/Math.PI);
              // draw cue
              canvas.drawBitmap(res.image.cue, -1*res.image.cue.width - this._cuePosition, res.image.cue.height / -2);
              // restore saved canvas
              canvas.restore();
          }
          // draw FPS
          canvas.drawText(String.printf("FPS: %2.f", System.avgFPS), 50, 50, res.paint.textPaint);
      }

创造边界

桌子的边框由6个静止的物体组成，放在桌子的操场周围。因为他们的弹跳属性被设置为1.0，一旦球击中边界，它就会以同样的力量反弹回来。这些屏障由多边形体表示，并由CreatePolygonBody方法。提供了一个所有体顶点的数组作为参数。这些顶点由x和y坐标设置，以物体形状中心的像素为单位。

例子：*创建表的边界

          function _createBarriers()
      {
          // top
          var shape = [
              {x: res.number.tableWidth / -4 + res.number.holeRadius, y : res.number.mantinel / 2 },
              {x: res.number.tableWidth / -4 + res.number.holeRadius + res.number.mantinel, y : res.number.mantinel / -2 },
              {x: res.number.tableWidth / 4 - res.number.holeRadius, y : res.number.mantinel / -2 },
              {x: res.number.tableWidth / 4, y : res.number.mantinel / 2},
          ];
                
          this.addPolygonBody(null, #static, 1.0, 0.0, 1.0, shape).setPosition(res.number.tableLeft + res.number.tableWidth / 4, res.number.tableTop + res.number.mantinel / 2);
          
          shape = [
              {x: res.number.tableWidth / -4, y : res.number.mantinel / 2 },
              {x: res.number.tableWidth / -4 + res.number.holeRadius, y : res.number.mantinel / -2 },
              {x: res.number.tableWidth / 4 - res.number.mantinel - res.number.holeRadius, y : res.number.mantinel / -2 },
              {x: res.number.tableWidth / 4 - res.number.holeRadius, y : res.number.mantinel / 2},
          ];
          
          this.addPolygonBody(null, #static, 1.0, 0.0, 1.0, shape).setPosition(res.number.tableLeft + 3*res.number.tableWidth / 4, res.number.tableTop + res.number.mantinel / 2);
          
          ...      
      }

球分布

球分布在桌子右半部分的等边三角形上，交替地是满球和半球。

例子：*分发球

      function _createBalls()
      {
          this.balls = new Array();
          var gap = Math.sqrt((res.number.ballRadius*res.number.ballRadius)/2);
          var shape = new b2CircleShape(res.number.ballRadius / this.scale);
          var ball = 0;
          var number = 0;
          for (var i = 0; i < 5; i++)
              for (var q = 0; q < i+1; q++) {
                  ball = PhysicsSprite.create(this, res.images.sonicRoll, shape, #dynamic, 1.0, 0.0, 1.0, Ball);
                  ball.setPosition(res.number.ballX + 2*i*gap, res.number.ballY + i*gap - 2*q*gap);
                  ball.bullet = true;
                  ball.setLinearDamping(res.number.tableDamping);
                  ball.color = res.ballColor[number];
                  ball.ballType = res.ballType[number];
                  ball.id = #ball;
                  number++;
                  this.balls.push(ball);
              }
          this.balls[4].color = 0xff000000;
          this.balls[4].ballType = #full;
      }

控制CUE

提示及其命中力由用户的触摸控制。当用户点击屏幕时，后压方法被调用，并计算出线索的第一个角度。

例子：管理指针按下事件

      function pointerPressed(x, y)
      {
          super.pointerPressed(x, y);
          // if some ball is moving do nothing
          if(this.ballsMoving)
              return;
                
          if (x<System.width - res.number.barWidth) {
              // compute actual distance from the white ball
              var (ballX, ballY) = this.whiteBall.getPosition();
              var distanceX = x - ballX;
              var distanceY = y - ballY;
              // calculate angle
              this.angle=Math.atan2(distanceY, distanceX);
              
              this._control = #angle;
          }
      }

当用户的触摸在屏幕上移动时，后拖方法被调用，并计算出一个新的提示角。

例子：管理指针拖动事件

        function pointerDragged(x, y)
        {
          super.pointerDragged(x, y);
          if(this.ballsMoving)
              return;
          if (this._control == #angle) {
              // compute actual distance from start position
              var (ballX, ballY) = this.whiteBall.getPosition();
              var distanceX = x - ballX;
              var distanceY = y - ballY;   
              
              this.angle=Math.atan2(distanceY, distanceX);
              this._direction = {
                  x   : x,
                  y   : y,
              }
          }
        }

力控制

击球力由桌子右侧的杆控制。这个条是在一个单独的层中创建的，并响应用户的点击，非常类似于提示。旁边后压和后拖事件时，它还会响应后释放事件，当用户从屏幕上释放手指时调用该事件。

例子：：将脉冲应用于白球>

       function pointerReleased(x, y)
      {
          if (this._control == #power) {
              // this.force -> from 0.0 to 1.0
              var force = this.force * res.number.maxForce;
              // linear velocity on x and y axis
              var velox = force*Math.cos(game.table.angle)/this.scale;
              var veloy =-force*Math.sin(game.table.angle)/this.scale;
              
              // set linear velocity to the ball
              game.table.whiteBall.setLinearVelocity(velox, veloy);
              game.table.ballsMoving = true;
              this._control = #nothing;
              this.force = 0.0;
          }
      }

源代码

最后的源代码可以从附件中下载。压缩文件。宣武高端网站开发该项目是一个完全工作的Billiard(池)游戏三个移动平台：iOS，Android和Bada。只要稍加调整，这个演示就可以很容易地转变成一个完整的游戏，为应用商店做好准备。

摘要

本文的目的是向您介绍MoscrifSDK作为一个易于使用的跨平台工具，为最常见的平台开发移动游戏。