Loading

[cocos2d-x]关于屏幕适配

第一步:理解屏幕分辨率和设计分辨率

这里写图片描述

通过这个图可以很容易理解,设计分辨率就是你能够进行纹理绘制的大小,而屏幕分辨率就是你的画框大小。而两者之间的适配,通过cocos2dx自带的几种适配方案来进行适配,这里我就简单说明一下:

1—-ResolutionPolicy::EXACT_FIT :拉伸变形,使铺满屏幕
2—-ResolutionPolicy::NO_BORDER :按比例放缩,全屏展示不留黑边
3—-ResolutionPolicy::SHOW_ALL :按比例放缩,全部展示不裁剪
4—-ResolutionPolicy::FIXED_WIDTH :按比例放缩,宽度铺满屏幕
5—-ResolutionPolicy::FIXED_HEIGHT :按比例放缩,高度铺满屏幕

关于一些属性:origin,visiblesize,winsize

首先要知道,我们设计时要关注的就是屏幕设计分辨率。然后再将屏幕设计分辨率对屏幕分辨率进行适配。

origin:即在屏幕中,framesize的原点在designSize的位置,所有的Layer,sprite都是以这个坐标为原点,visiblesize即designsize在framesize的比例下可以看见的区域大小。

glview->setFrameSize(400, 320);
glview->setDesignResolutionSize(800,320, ResolutionPolicy::NO_BORDER);

//最后的输出
//winsize :800.000000,320.000000
//origin 200.000000,0.000000
//visiblesize 400.000000,320.000000

如图所示:
这里写图片描述
这里写图片描述

(图中origin为200,打错了)
接下来贴出源码:

Vec2 GLView::getVisibleOrigin() const
{
    if (_resolutionPolicy == ResolutionPolicy::NO_BORDER)
    {
        return Vec2((_designResolutionSize.width - _screenSize.width/_scaleX)/2, 
                           (_designResolutionSize.height - _screenSize.height/_scaleY)/2);
    }
    else 
    {
        return Vec2::ZERO;
    }
}//这是origin的获取方法,为(设计分辨率-屏幕分辨率/放缩比率)/2
//上图就是 (800-400/1)/2=200


Size GLView::getVisibleSize() const
{
    if (_resolutionPolicy == ResolutionPolicy::NO_BORDER)
    {
        return Size(_screenSize.width/_scaleX, _screenSize.height/_scaleY);
    }
    else 
    {
        return _designResolutionSize;
    }
}//这是visiblesize,等于屏幕大小/放缩比例
posted @ 2017-08-02 13:53  李正浩  阅读(179)  评论(0编辑  收藏  举报