首页 > 代码库 > arpg网页游戏之地图(二)

arpg网页游戏之地图(二)

[转]http://www.cnblogs.com/BlueWoods/p/4684557.html

  这一节说说视窗,这个视窗,也就是游戏的视角。现在的网页游戏分为2D游戏,2.5D游戏和3D游戏,2D游戏基本是一些横板的,2.5D基本都是arpg的,可以说游戏画面投影的角度略有不同,3D网页游戏,现在也有不少,效果做的不错的,都是带微端的,不带微端同屏人数过多就会出现卡顿的情况。个人感觉网页还不太适合做3D的,一是效率问题,二是表现效果不如端游炫。端游开发周期较长,世界观比较宏大,玩家呢,要适应游戏世界,并在里面找到自己的定位,这样玩家的忠诚度比较高;而网页游戏的目的不恰恰相反,它主要是迎合玩家的口味,并利用玩家的心理诱导其充值,游戏周期一年左右,玩家玩一个月基本就没什么新东西了。

说的有点跑题了。这个视窗主要是根据玩家的坐标来控制人物层和地图层移动的,它包含四个属性:人物坐标FocusPoint,最大视窗:MaxRect,移动视窗:moveRect,屏幕视窗viewRect

  • 人物坐标fp:你玩网页游戏的时候,你会发现玩家的移动范围。当他移动到地图边界的时候,他才会真正的移向边界;当他远离边界的时候,他基本保持在屏幕的中央。虽然人物位置是按照格子坐标表示的,但是人物移动的时候,还是按照像素移动。
  • 最大范围MaxRect:就是当前地图的宽和高
  • 移动范围moveRect:玩家在此范围内移动,不会改变地图层的坐标,在游戏中我设置的可移动范围是100*100。其实你可以想象下:在屏幕的最中央,有100*100的矩形中,玩家在此移动是不会推图的,有助于提高玩家的体验,提升效率。
  • 屏幕视窗ScreenRect:就是舞台的宽高

算法代码如下:

public function setFocusPoint(p:Point) : void
{
    _orx = _viewRect.x;
    _ory = _viewRect.y; // 记录原始视窗坐标(记录的作用?)
    _focusPoint.x = p.x >> 0;
    _focusPoint.y = p.y >> 0;
    focusPointChanged(); //触发视角变化事件
}

 

 

private function focusPointChanged() : void
{<br>    // 检测时否改变屏幕视窗的坐标
    if (_focusPoint.x < _movableRect.x)
    {
        _viewRect.x = _focusPoint.x - _viewRect.width / 2 + _movableRect.width / 2;
    }
        if (_focusPoint.x > _movableRect.right)
        {
        _viewRect.x = _focusPoint.x - _viewRect.width / 2 - _movableRect.width / 2;
      }
    if (_focusPoint.y < _movableRect.y)
    {
        _viewRect.y = _focusPoint.y - _viewRect.height / 2 + _movableRect.height / 2;
    }
    if (_focusPoint.y > _movableRect.bottom)
    {
        _viewRect.y = _focusPoint.y - _viewRect.height / 2 - _movableRect.height / 2;
    }


===========================================================================
checkViewRectOffset();//检测边界<br><br>    setMovableOffset(); // 屏幕视窗XY改变了,需要变化移动视窗的坐标
<em id="__mceDel">  moveMap();//加载地图
}
</em>
// 因为移动处于屏幕视窗的中央,屏幕视窗变化了,移动视窗也要重新计算其xy坐标<br>private function setMovableOffset() : void
{
    _movableRect.x = _viewRect.x + (_viewRect.width - _movableRect.width) * 0.5;
    _movableRect.y = _viewRect.y + (_viewRect.height - _movableRect.height) * 0.5;
}
//检测屏幕视窗的边界<br>private function checkViewRectOffset() : void
{
    if (_viewRect.x < 0)
    {
        _viewRect.x = 0;
    }
    if (_viewRect.y < 0)
    {
        _viewRect.y = 0;
    }
    if (_viewRect.x + _viewRect.width > _maxRect.width)
    {
        _viewRect.x = _maxRect.width - _viewRect.width;
    }
    if (_viewRect.y + _viewRect.height > _maxRect.height)
    {
        _viewRect.y = _maxRect.height - _viewRect.height;
    }
}
这是游戏视窗Manager,根据人物移动坐标变化而变化的代码,地图层是根据屏幕的坐标去判断加载哪块地图的。

arpg网页游戏之地图(二)