我看了两篇转载的文章有了些大概的了解。也在hellocpp里面实验过。现在来cocos2d-x屏幕适配总结一下:

主要分两大类:

竖版游戏:

设置解释器的大小,正常解释器的大小应该与设计分辨率的大小是一致的

eglView.init(“HelloCpp”,640,960);

eglView.setFrameSize(640,960);

设计分辨率:640*960

分辨策略:kResolutionFixedWidth(保持传入的设计分辨率宽度不变,根据屏幕分辨率修正设计分辨率的高度。)

例:CCEGLView::sharedOpenGLView()->setDesignResolutionSize(640, 960,kResolutionFixedWidth);

屏幕缩放因子:setContentScaleFactor(最大资源宽度/设计分辨率宽度)

例:Director::getInstance()->setContentScaleFactor(largeResource.size.width/designResolutionSize.width);

应该是:Director::getInstance()->setContentScaleFactor(640/designResolutionSize.width);(让这个图片再宽度上全显示在屏幕上,高度会按宽度的比例等比缩放)

设计分辨率: ResolutionSize

sprite当前分辨率下的位置

精灵应该是相对位置:

百分比形式:sprite->setPosition(Point(Screen.width* sprite.x/ ResolutionSize.width,Screen.Height * sprit.y / ResolutionSize.Hight);

还有一种相对于一个固定控件的方法:(待研究)

测试的一个方法:

注: 游戏底图的高度 需要按照 分辨率最大的设置的高度一致(现在最大的一款大概是480*854) 长宽比1.779,设计是640宽度,算出来最大高度大概是1138.666

所以底图的最大高度就是1138.6666

注:开始也试过不改变画布大小的方法,就是按照640*960来弄, 然后底图换成比较大的,然后设置layout(层容器的setSize),但是设置的时候,他只超向上的方向上缩放,所以导致整体图像不能居中了,这样就有问题了。有人说通过设置锚点来搞定,完全扯淡,

锚点:贴图中——调整位置的点,所以必须是贴图,想layer 那样的东西 设置锚点完全是没用的

说下我怎么实现了这种比较烂的方法:

编辑界面是在cocostduio界面下编辑的:

注意事项:



Panel是画布也就是层容器,这里要设置画布大小:640*1139(保持宽度,高度会跟着宽度来等比缩放)

ImageView 也就是图片控件大小同画布大小(640*1139)这就是底图有底图就弄一个,没有就弄成透明的背景,所有的控件都要建在这个控件上,因为在图片控件建立的控件,

原点是改图片的中心点。x轴向右,y轴向上

cityback 底板: 底板上不能建立控件,因为我们一会要对底板进行拉伸,如果底板上子节点,这样子节点也会拉伸,图标拉伸了。这样肯定不行。

其他的图标我们建在:ImageView 上,大概有个参照,按照640*960的效果图,加控件(1139-960/2上下都要留出这样的大小,也就是居中), 如果是一块不想改变的控件区就弄一个层容器来弄(下面调整位置的时候调整层容器,里面的东西不管了。)

载入我们cocostudio的 .ExportJson 或json文件.ExportJson导出的是大图,也就是资源拼合成一张图,然后通过*.plist定位到了大图的位置,通过Rect来取出相应的图片,提升了渲染速度,json 也就是小图,没有拼合的, cocostudio 导入模板的时候,要是json

640*960 下:

设置读出来的: layout 居中显示 

local VisibleSize = CCDirector:sharedDirector():getVisibleSize()

local layoutw, layouth = layout:getContentSize()

local VisibleOriginPoint = CCDirector:sharedDirector():getVisibleOrigin()

layout:setPosition(VisibleOriginPoint.x/2, VisibleOriginPoint.y/2+VisibleSize.height/2-layouth/2) 

// VisibleOriginPoint 当前屏幕的原点坐标,这种分辨策略是0

这样640*960下就没有任何问题了

我们在480*854 下面查看效果: 鉴于这个高宽比,会显示出来640*1139的大小(也就是上下都有一截黑边,然后图标全都在中间)

在面我们来调整位置和缩放一些底板(这样就保证了图标什么的没有任何问题,只拉伸了底板)

说一下调整位置:很重要的

首先:为什么需要在图片上建控件,不能在层容器上直接建控件。



A 的坐标 (比如:100, 100) B的坐标(100,-100)

在高度上乘以一个大于1的比例: 比如1.2A(100,120) B(100, -120)都是向两边进行放大

在高度上乘以一个小于1的比例:比如0.8A(100, 80) B(100,-80) 都向中间进行缩进

所以就是让所有的东西进行居中对齐了嘛

调整位置函数函数:(只调整高度,因为宽度被保持)

function adjustPosition(layout, nameTabel)

local VisibleSize = CCDirector:sharedDirector():getVisibleSize()

local DesignResolutionSize = CCEGLView:sharedOpenGLView():getDesignResolutionSize()

local scaley = VisibleSize.height / 960

for k, v in pairs(nameTabel) do

local widget = layout:getChildByName(v)

widget:setTouchEnabled(true)

local widgetx, widgety = widget:getPosition()

widget:setPosition(widgetx, widgety*scaley)

CCLuaLog(“widgetx, widgety*scaley = “..widgetx..” “..widgety*scaley)

end

end//缩放底板

function adjustBackScaleY(layout, nameTabel)

local VisibleSize = CCDirector:sharedDirector():getVisibleSize()

local DesignResolutionSize = CCEGLView:sharedOpenGLView():getDesignResolutionSize()

local scaley = VisibleSize.height / 960

for k, v in pairs(nameTabel) do

local widget = layout:getChildByName(v)

widget:setTouchEnabled(true)

widget:setScaleY(scaley)

–local widgetx, widgety = widget:getPosition()

–widget:setPosition(widgetx, widgety*scaley)

–CCLuaLog(“widgetx, widgety*scaley = “..widgetx..” “..widgety*scaley)

end

end

这样就可以了: 同一行上的可以用一个层容器包含起来,那样调位置的时候,只要调这个层容器就可以,不过也可以一个个弄

如果不想改变在960 640 的图标的间隔:

那就见个层容器 640 * 960大小的,把除了底板 和 需要向下对齐的东西 放在里面就可以了。

因为层容器建在图片上,层容器是在下面的,大于1的情况是向下调整的,而我们希望他向上调整,小于1的情况向上调整,而我们希望向下调整。

所以函数做如下调整:

function adjustLayoutPosition(layout, nameTabel)

local VisibleSize = CCDirector:sharedDirector():getVisibleSize()

local DesignResolutionSize = CCEGLView:sharedOpenGLView():getDesignResolutionSize()

local scaley = VisibleSize.height / 960

for k, v in pairs(nameTabel) do

local widget = layout:getChildByName(v)

widget:setTouchEnabled(true)

local widgetx, widgety = widget:getPosition()

widget:setPosition(widgetx, widgety/scaley)

CCLuaLog(“widgetx, widgety*scaley = “..widgetx..” “..widgety/scaley)

end

end

最后效果480*854

<!–more–>



最后看来这是一种很烂的方法,而且还很复杂

横版游戏:

分辨策略:kResolutionFixedHight(保持传入的设计分辨率高度不变,根据屏幕分辨率修正设计分辨率的宽度。)

例:CCEGLView::sharedOpenGLView()->setDesignResolutionSize(640, 960, kResolutionFixedHight);

屏幕缩放因子:setContentScaleFactor(最大资源宽度/设计分辨率宽度)

例:Director::getInstance()->setContentScaleFactor(largeResource.size.height/designResolutionSize.height);

应该是:Director::getInstance()->setContentScaleFactor(960/designResolutionSize.height);(让这个图片在高度上全显示在屏幕上,宽度会按高度的比例等比缩放)

设计分辨率: ResolutionSize

sprite当前分辨率下的位置

精灵应该是相对位置:

百分比形式:sprite->setPosition(Point(Screen.width* sprite.x/ ResolutionSize.width,Screen.Height * sprit.y / ResolutionSize.Hight);