再聊 cocos2dx -quick 适配

适配原理:同比例缩放。

因为只有宽和高同比例缩放,才会

1 图片不会变形

2 在逻辑上构成的长宽坐标的比例才会一致。比如 宽 2pt代表4个像素,高2pt代表4个像素,不会出现相同的逻辑长度实际代表的像素长度是不同的。

比如:

适配主要是针对背景图片和ui元素。

1 一张背景图片 宽960像素 高480像素。我想让这张图片在设备垂直方向上完全填满显示。通过缩放可以做到。也一定可以获得一个缩放的比例值 r,也就是 图片高度/设备高度 。为什么要求在垂直方向上填满设备?因为我这里的目的是想让某些布局在垂直方向上的图片显示时不超出设备的屏幕。

2 ui元素怎么保证?比如高480像素的设备,我的一张图片是20像素*20像素的大小,那么设置图片位置时(考虑锚点在图片中心),很容易知道y坐标范围是(0+10,480-10)。超出范围就会出现图片显示不全,或者完全不显示。这里我们是因为知道设备的分辨率是 480像素,图片的大小是20像素*20像素,所以很容易控制。但是,如果设备高变成240像素呢?

怎么保证同样这张20像素*20像素的ui元素依然 在垂直方向上面完全显示呢?也就是同一套资源在不同的设备下现实问题。

是的,所有图片都缩小 2 倍。这时候,ui元素y坐标范围是(0+5,240-5)。也就是说代码是要改。这样肯定不好。我们用过quick就知道,这里是不用修改代码的。原因是高的适配已经做了,引擎会自动帮我们处理。实际上第二次y的坐标就是 在之前的基础上 乘以2而已。所以我们不用管,我们还是认为设备高依旧是480像素。因为我们目标是保证在垂直方面填满设备,所以问题来了,水平方向会产生副作用。为什么?因为我们要保证图片看上去不能变形,所以一张图片高和宽的缩放比例要是一致的。也就是图片的宽也要用 r值进行缩放(图片高度/设备高度),这样图片宽缩放后,可能比设备的宽长或者短。比如图片960像素,缩小2倍,在宽是400像素的设备上显示,很明显水平方向就有部分图片看不到。在宽是500像素的设备上显示,很明显水平方向就不能完全填满,会有空隙。这里我们在水平方向上可以接受的是不能有空隙。也就是图片的宽缩放后,长度要不能小于设备的宽度。如果只有一种设备,比如设备宽400像素,那么图片宽缩放后是480,这个没问题。可是还有其他设备,怎么保证图片的宽缩放后,水平方向都没问题?

问题其实是:怎样让图片在垂直方向上把设备完全填满,同时水平方向上不能留有空隙。

我们的图片的高是固定的,需要计算的是图片的宽美术应该做多大。看下面

从这个图片我们得出结论:宽度的最小值 = 所有需要适配设备里面宽高比的最小值 x 图片高度

时间: 2024-10-12 10:49:03

再聊 cocos2dx -quick 适配的相关文章

再聊移动端页面的适配

再聊移动端页面的适配 https://www.w3cplus.com/css/vw-for-layout.html  原文网址 Flexible承载的使命 Flexible到今天也有几年的历史了,解救了很多同学针对于H5页面布局的适配问题.而这套方案也相对而言是一个较为成熟的方案.简单的回忆一下,当初为了能让页面更好的适配各种不同的终端,通过Hack手段来根据设备的dpr值相应改变<meta>标签中viewport的值: <!-- dpr = 1--> <meta name=

cocos2d-x quick 学习 一 环境

最近几天都在学习quick 一直也在查找资料. 本来这篇文章在昨晚就能写好的.可是昨晚环境遇到点问题自己没想通. 正题:首先是环境配置: 由于我在mac下 所以在网上找了很多资料提前看了.  我之前也在电脑里安装了cocos2d-x2.2  去年装的.一直也在用所以也没换. 最近由于没事  把系统升级了 . Mac  10.9.4   xcode 5.1.1   quick 2.2.5 环境安装很简单. 说说昨晚为什么没有安装成功.是因为我把xcode的名字改成版本号.所以它一直没有 安装qui

cocos2dx 屏幕适配策略

cocos2dx的常用函数: CCEGLView::sharedOpenGLView()->setDesignResolutionSize() //设计分辨率大小(即开发时为基准的屏幕分辨率) CCEGLView::sharedOpenGLView()->setFrameSize()    //设置win32模拟器的分辨率 CCEGLView::sharedOpenGLView()->getFrameSize()    //屏幕分辨率,实际的硬件参数 3种填充策略: kResolutio

Cocos2D-X屏幕适配新解

” 阅读器 为了适应移动终端的各种分辨率大小,各种屏幕宽高比,在 Cocos2D-X(当前稳定版:2.0.4) 中,提供了相应的解决方案,以方便我们在设计游戏时,能够更好的适应不同的环境. 而在设计游戏之初,决定着我们屏幕适配的因素有哪些?简而言之只有两点:屏幕大小和宽高比.这两个因素是如何影响游戏的呢? •屏幕大小: 从小分辨率 480×320 到 1280×800 分辨率,再到全高清 1080p,从手机到平板,还有苹果设备的 Retina屏,这么多不同的分辨率,而且大小差距甚大,不可能做到一

cocos2d-x多分辨率适配方案:setDesignResolutionSize使用

1. setDesignResolutionSize使用方法及主要的三种适配模式 在cocos2d-x 2.0里,提供了一个叫做setDesignResolutionSize的方法,直接一次设置就可以自动适配各种分辨率.这个方法的注释如下: enum ResolutionPolicy { kResolutionExactFit, kResolutionNoBorder, kResolutionShowAll, kResolutionFixedHeight, kResolutionFixedWid

cocos2d-x屏幕适配原理分析

cocos2d-x作为著名的cocos2d游戏开发框架的C++实现者,最近一年发展迅猛.越来越多的app使用它实现快速多平台部署,从最初的ios,android,win32等到新近的html5,实现移动,客户端到浏览器全覆盖,不得了~~ 开发移动应用的屏幕适配和爱情一样是一个从洪荒时代就存在的永恒命题,根本目的是实现在不同设备上用户体验的统一. cocos2d-x在cocos2d-2.0-x-2.0.4版本之前没有提供解决的方案,开发者只能自己解决,其中一些方法见 这里从2.0-x-2.0.4开

Cocos2d-x 屏幕适配解决方案

1. setDesignResolutionSize使用方法及主要的三种适配模式 在cocos2d-x 2.0里,提供了一个叫做setDesignResolutionSize的方法,直接一次设置就可以自动适配各种分辨率.这个方法的注释如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 enum ResolutionPolicy { kResolutionExactFit , kResolutionNoBorder , kResolutio

再聊HDFS Erasure Coding

前言 在之前我的一篇文章中,已经聊到过一次关于HDFS EC方面的内容(文章链接Hadoop 3.0 Erasure Coding 纠删码功能预分析),所以本文算是对其内容的一次补充.之前的文章中主要是从宏观的层面上阐述了HDFS EC的作用以及相应的使用场景,并没有深入到内部相关架构设计以及具体EC算法的的内容.本文主要=阐述的内容正在于这两方面. Erasure Coding技术 EC是Erasure Coding的缩写,中文名叫做纠删码,是一种能够进行数据错误纠正的技术.EC比较常见的一个

cocos2dx屏幕适配方案

我们在利用cocos2dx来开发游戏时,在开始时就不可避免的会遇到屏幕适配问题,来使我们的游戏适应移动终端的各种分辨率大小.目前,大家采用的屏幕适配方案不一,网上的资料也比较丰富,下面我也将自己使用的方案做下记录.由于我的Mac系统下只有一个分辨率的虚拟机,所以这次使用的是VS2010,使用的是cocos2dx2.2.2版本. 我这里采用的方案是为不同分辨率的屏幕设置不同资源目录的方案,根据我们的需求需要准备多套资源,但是由于部分分辨率较为接近,所以也不必为所有分辨率都去单独准备资源,可以几种分