在想cocos适配之前,我们想想网页是怎么适配的。浏览器有各种规格,网页的一般做法是:背景图片铺满,网页内容保持在背景图片上居中,就实现了适应或者适配。css一般这样:

.bg{
height:582px;
background-image:url('images/top_team_bg.png');
background-size:auto 100%;
background-position: center center;
background-repeat: no-repeat;
} .content {
width:1000px;
margin:0 auto;
}

 核心:

background-position: center center;

因为是背景图片,所以横向显示可以不全,但永远会显示中间的部分,就是我们的网页内容。content部分宽度是固定的,并且是居中的。
回到cocos上,原理完全一样,让背景铺满,内容居中。
背景铺满,在背景是顶级节点的情况下(和canvas平级),可以用Widget,left:0;right:0;
content居中我们用js去控制,下面的代码,在编辑器里我们设置content的宽度是2048,ts代码:

adaptScreen(items: Array<cc.Node>) {
if(cc.director.getVisibleSize().width <= 2048) return;
if(items instanceof Array) {
items.forEach(item => {
try {
item.x += Math.floor((cc.director.getVisibleSize().width - 2048) / 2 )
} catch(e) {
cc.log(e)
}
})
} else {
cc.log(items)
cc.log('传入的参数必须是数组')
}
}

  

cocos creator游戏适配这事的更多相关文章

  1. Cocos Creator 游戏开发

    Cocos Creator 游戏开发 https://www.cocos.com/products#CocosCreator 一体化编辑器: 包含了一体化.可扩展的编辑器,简化了资源管理.游戏调试和预 ...

  2. cocos creator屏幕适配的一些知识点

    一. cocos creator 提供的几种适配策略 EXACT_FIT: 整个应用程序在指定区域可见,无需尝试保留原始纵横比.可能会出现失真,应用程序会被拉伸或压缩.也就是说设计分辨率的长和宽不会等 ...

  3. kbengine_js_plugins 在Cocos Creator中适配

    kbengine_js_plugins 改动(2017/7/6) 由于Cocos Creator使用严格模式的js,而原本的kbengine_js_plugins是非严格模式的,因此为了兼容和方 便C ...

  4. Cocos Creator iPhoneX适配的解决办法

    研究了5个小时的iPhoneX适配. 从catalog,storyboard,safearea等一系列文章中发现.如果我们想完全撑满全屏.那直接建一个storyboard就好了.但撑满全屏后,流海就是 ...

  5. Cocos Creator采坑:原来使用Cocos Creator做游戏,是有服务器!!!

    我傻傻的以为,我们没有服务器. 今天上传测试代码,测试才发现! 原来我们真的是有服务器的!只不过是一个本地的服务器~!需要服务器打开,然后,扫码才能访问!! 为了证明我们是有服务器的,我做了一下测试 ...

  6. Cocos Creator实现的《点我+1》

    一.前言 在学习Cocos中,需要一些东西来练手,于是前段时间就开发仿照一款公司之前的产品<点我+1>来做,仿照过程中,所有的算法逻辑都是自己研究的,并没有参考公司代码,也没有使用公司的美 ...

  7. Cocos Creator代码编辑环境配置

    1,可以使用较为适合js的webstorm,亦可以采用VS: 2,若需要webstorm,在下载之后,在文件,设置内外部编辑器选用webstorm.exe,即可: 3,Visual Studio Co ...

  8. Cocos Creator中按钮组件数组的使用

    Cocos Creator游戏开发中经常使用到按钮,特别是大量按钮的情况,此时使用数组来管理这些按钮就显得更具通用性.我大致走了一下官方的示例,好像没有发现有这个小内容(或者有,但我却是没有找到),于 ...

  9. 反复横跳的瞄准线!从向量计算说起!基于射线检测的实现!Cocos Creator!

    最近有小伙伴问我瞄准线遇到各种形状该怎么处理?如何实现反复横跳的瞄准线?最近刚好在<Cocos Creator游戏开发实战>中看到物理系统有一个射线检测,于是,基于这个射线检测,写了一个反 ...

随机推荐

  1. Android首次启动时间长优化之预编译提取Odex

        提示!应用程序的安装有两种情况,第一:首次启动系统时安装.第二:系统启动完毕后安装. 本篇博文基于第一种安装场景.在系统首次启动的场景中,系统会对/system/app./system/pri ...

  2. Project Perfect让Swift在server端跑起来-引言(一)

    编者语:今天是大年初一.先和大家简单说一句猴年快乐! watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/ ...

  3. “2014年ArcGIS影像高级培训班——5月份北京站”火热报名中!

    您从事遥感类的相关工作吗?您正对着一景景影像数据不知从何下手吗?您有TB级甚至更高量级的影像数据须要有效管理.即时分享吗?您须要构建Web端的应用实现影像实时处理.在线分析吗? 您是否已经找到有效的解 ...

  4. kafka01

    消息队列松耦合 消息队列

  5. bzoj4668

    并查集+最小生成树 首先我们发现这题可以lct维护最小生成树,但是发现如果生成树在之后是不会修改的,那么就想到了并查集,然后就不知道怎么做了... 其实当我们连接两个连通块的时候,两个连通块只能通过这 ...

  6. oracle 分页方法

    我分享两种: 1.用rownum select * from (select p.* , rownum rn  from t_premium p where rn<= page * 10) a ...

  7. codevs1486愚蠢的矿工(树形dp)

    1486 愚蠢的矿工  时间限制: 1 s  空间限制: 128000 KB     题目描述 Description Stupid 家族得知在HYC家的后花园里的中央花坛处,向北走3步,向西走3步, ...

  8. [jzoj NOIP2018模拟10.23]

    丢分主要是下面几个方面: 1.T2代码交错了,有个特判没写丢了10分 2.T1线段树加等差数列写错了(其实二维差分就可以,但我当时不会) 3.T3思考再三还是为了10分写上了主席树,还是写错了 总体评 ...

  9. [Swift通天遁地]七、数据与安全-(10)文件的加密压缩和解压加密压缩

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  10. akka设计模式系列-消息模型

    通过前面的文章我们总结了几个常见的actor设计模式,但此处不得不提前介绍一下在Akka中消息的设计模式.随着对Akka的使用,我们会发现,使用Akka设计系统其实就是面向消息编程.actor之间消息 ...