真3D麻将游戏桌面适配任意分辨率

大部分同学应该都处理过2D麻将桌的适配，从iPhoneX(目前最长的移动设备）到iPad（目前最短的移动设备）

无非就是根据长宽比来选择最适合的适配方式。麒麟子之前写过一遍，传送门：棋牌UI全分辨率适配方案

但3D的适配则不是通过缩放来的，因为3D看到的画面，大部分是调整摄相机参数得来的。我们常见的设备有以下分辨率

2.16 : 1 iPhoneX系列为代表

2:1 华为、小米等2018年后出的Android手机为代表

16:9 苹果6以及同时期的Android手机为代表

1024:768 iPad为代表。

麒麟子打开了麻将的代表作，欢乐麻将。在不同设备下玩了一圈后总结出了欢乐麻将的适配规则。

1、设计分辨率是 16:9, （常见的就是1280 x 720)

2、在宽于16:9的设备上，它什么都没做，只是简单地把桌面保持左右撑满。

3、在高于16:9的设备上，它会保持左右两边不变，让高显示得更多一点。

要实现以上目标，我们需要做如下处理就行。

1、U3D编辑器中，使用16:9的预览窗口，调整好摄相机和画面。

2、切换为1024x768的分辨率，保持摄相机不动（最好是在运行模式下调，这样16:9的参数就不会影响），调整好桌面的缩放和位置。

3、记录下1024x768的参数缩放和位移。

4、在代码中，通过真实横纵比(宽/高) 与设计横纵比(1280/720) 进行比较

a、如果更宽(真实横纵比 > 设计横纵比)，则将背景的scaleX放大，放大倍数 = 真实横纵比 / 设计横纵比。

b、如果更高(真实横纵比 > 设计横纵比)，则将桌面缩小和位移。

缩小的方式就是插值，设计分辨率下的缩放和位移，我们作为初值，1024 x 768下的值作为目标值（刚刚U3D编辑器中编辑的时候，我们需要把这个值记下来）。插值的计算如下：（代码中的Laya.stage.height / Laya.stage.width 就是真实高/真实宽，大家根据自己用的引擎来调整即可）

         let fromRatio = 720 / 1280;let targetRatio = 768 / 1024;let curRatio = Laya.stage.height / Laya.stage.width;let factor = (curRatio - fromRatio) / (targetRatio - fromRatio);

有了这个factor我们只需要做一个线性插值，就能得到不同分辨率下的桌面缩放和位移了。

最后上几张图

代码与工程相关比较多，不方便抽出来，如果有需要的朋友，可以联系我一起探讨。

真3D麻将游戏桌面适配任意分辨率相关推荐

3D麻将游戏开发通用算法
通常的3D麻将开发胡牌方式为满足N * ABC + M *DDD +EE 的形式,及存在一个对子(EE),剩余牌均能组成顺子(ABC)或者刻子(DDD). 三国游网络科技专注3D麻将游戏开发多年专 ...
有效解决3D游戏边缘锯齿现象及全面理解LayaAir引擎游戏屏幕适配！
有的时候看到一些3D游戏锯齿感特别明显,与一些开发者沟通后发现,其实很多人并不清楚怎么能去掉明显的锯齿感,而这并不是只有新开发者才遇到的问题,很多游戏研发经验丰富的开发者,甚至是使用LayaAir引擎 ...
无缝切地图的3D赛车游戏火了，小哥花16个月用JS打造，浏览器免费就能玩
萧箫发自凹非寺量子位 | 公众号 QbitAI 一位小哥耗时16个月打造的3D版赛车游戏,这两天忽然火了起来. 只需一个浏览器,就能驾车从森林.海滩,"无缝切换"到广袤的沙漠 ...
【转】265行JavaScript代码的第一人称3D H5游戏Demo
译文:http://blog.jobbole.com/70956/ 原文:http://www.playfuljs.com/a-first-person-engine-in-265-lines/ 这是 ...
淘宝人生3周年，聊聊我们3D互动游戏的项目经验
本文将分享3D互动游戏在开发过程中的思考和经验. 今年我们迈出的第一步今年是淘宝人生上线 3 周年,我们去年从灵犀互娱手中接过这根接力棒,经过了漫长的开着飞机换引擎的过程.在这之前,我们团队并没有中 ...
Android 3D 魔方游戏的设计与开发
Android 3D 魔方游戏的设计与开发 5.1 Feature 定义魔方是一个有趣的益智游戏,相信很多人都玩过.本次毕业设计,欲完成的主要的功能如下: (1) 开始游戏:开始一个新的游戏 (2) ...
原来微信里有这么多好玩的3D小游戏了
自从<跳一跳>打开微信小游戏之门伊始,小游戏之势已然燎原.小编体验了上千款微信小游戏,虽然当前仍是以2D休闲游戏为主,但是3D小游戏也越来越多了(悄悄的说一下,小编已知的3D游戏里除了2款 ...
【干货】通过真机实现页面自动化适配（含直播回放）
本文根据4月15日淘系技术前端团队出品的「阿里淘系用户体验优化前端实战系列直播」--<通过真机实现页面自动化适配>整理而成. (直播回放) ‍ 引言作为前端大家是否遇到过在项目快上线的时 ...
万众期待！！！微店首款 Creator 3D 小游戏来啦，你猜是谁？
原文作者:杨宗宝排版视频:张晓衡哈哈,「杨宗宝」我又来了! 这次是我的一个 Cocos Creator 3D 小游戏哦!估计明天就能上架了晓衡微店了. 你拿到项目后,会有两个项目文件夹: Eude ...
白鹭引擎助力《迷你世界》研发团队开发3D小游戏版
<迷你世界>作为国内第一的放置类3D沙盒游戏,依靠三四线城市的游戏市场及垂直媒体的传播途径,研发团队用了短短3年时间就创造出了8000万活跃玩家.5000万玩家原创作品,仅2020年上半年 ...

真3D麻将游戏桌面适配任意分辨率

真3D麻将游戏桌面适配任意分辨率相关推荐

最新文章

热门文章