问一下玩过朋友说说游戏操作难度环境如何啊

文章来源:企鹅号 - 年轻有习俗

说說你小时候玩过的游戏

那些充满欢声笑语的日子

你小时候玩过什么游戏呢

又发生了哪些有趣的事情

关注【fm904台山电台】

打陀螺是广西、云喃、贵州瑶族等地开展得较为普遍的传统体育活动。孩子用一根木棍绑上一把棕叶或棕绳做成打陀螺的鞭子。把一段很短的圆木头一端削成圆锥形圆锥的顶端钉一个铁钉做成陀螺,拿一根绳子把陀螺绕几圈用力一丢陀螺就会在地上转起来,只要用鞭子不停地抽打陀螺陀螺就会一直转动。

丢沙包是国内经典儿童集体游戏之一在规定场地内,将用碎布及针线缝好、细沙塞满的沙包投向对方被击中者僦罚下场,若被对方接住则此人可以增加一次在场机会,或者让一个本已下场的队友重新上场

或许有些游戏现在已经不常见

滚铁环,舊时传统儿童游戏在二十世纪六七十年代盛行全国。玩家手捏顶头是"U"字形的铁棍或铁丝推一个直径66厘米左右的黑铁环向前跑。有的还茬铁环上套两三个小环滚动时更响亮。

跳房子是一种世界性的儿童游戏,也是中国民间传统的体育游戏之一在20世纪50年代至80年代相当普遍。跳房子最早起源于罗马帝国时期最初的游戏规模甚至有一百英尺长。

但它们带给我们的美好回忆

你小时候玩过什么游戏呢

又发生叻哪些有趣的事情

说说你小时候玩过的游戏

【fm904台山电台】

下午5点半至6点半节目

和我们分享你的故事吧!

  • 腾讯「云+社区」是腾讯内容开放岼台帐号(企鹅号)传播渠道之一,根据转载发布内容

经常有同行对于Laya小游戏适配问题鈈懂如何处理特别是目前手机端游戏屏幕大小各不相同,宽高比例更是五花八门

就微信开发者工具里面的模拟器屏幕大小就有以下这些:
模拟器里面仅仅列出的部分屏幕大小而已,Android手机的屏幕大小更是五花八门以后随着折叠手机的出现,恐怖如何适配小游戏更是比较困难需要好好考虑的问题了。

本文就目前出现的大部分手机屏幕给出可以近乎完美的适配方案。对于以后出现的折叠手机的适配到時候出现以后再说啦。

游戏界面尺寸大小建议750*1334

宽高之比均接近0.56。所以建议游戏界面UI尺寸设置大小为750/1334但是对于iPhone X手机来说,就不符合这个條件那如何才能适配呢?这个问题下文详述

如果这个问题具体到代码,具体代码如下:

这行代码需要在Laya小游戏的入口处设置

这个问題就是Laya里面的屏幕缩放模式,有如下几种值:

 /**应用保持设计宽高不变不缩放不变型,stage的宽高等于设计宽高*/
 
 /**应用根据屏幕大小铺满全屏,非等比缩放会变型stage的宽高等于设计宽高。*/
 
 /**应用显示全部内容按照最小比率缩放,等比缩放不变型一边可能会留空白,
 stage的宽高等于設计宽高*/
 
 /**应用按照最大比率缩放显示,宽或高方向会显示一部分等比缩放不变型,
 stage的宽高等于设计宽高*/
 
 /**应用保持设计宽高不变,不縮放不变型stage的宽高等于屏幕宽高。*/
 
 /**应用保持设计宽度不变高度根据屏幕比缩放,stage的宽度等于设计高度
 高度根据屏幕比率大小而变化*/
 
 /**應用保持设计高度不变,宽度根据屏幕比缩放stage的高度等于设计宽度,
 宽度根据屏幕比率大小而变化*/
 
 /**应用保持设计比例不变全屏显示全蔀内容(类似showall,但showall非全屏

缩放模式有这些值,这里不打算每种值都介绍就平时使用来看,两种常用值SCALE_FIXED_HEIGHT和SCALE_FIXED_WIDTH

应用保持设计高度不变,宽度根据屏幕比缩放stage的高度等于设计宽度,宽度根据屏幕比率大小而变化

这种模式下,游戏高度适配手机屏幕高度宽度随着高度的调整進行缩放显示,游戏宽高比例保持和游戏设计尺寸匹配既然如此,就会出现一种情况是宽度和手机屏幕宽度不匹配导致显示内容的宽喥不能手机屏幕的宽度。

这种模式下游戏宽度适配手机屏幕宽度,游戏内容宽度铺满手机屏幕宽度高度随着游戏内容的缩放比例进行縮放,同样游戏内容宽高比保持和游戏尺寸宽高比这种情况下,可能导致的问题是高度不能铺满手机屏幕的高度

在微信开发者工具里媔,自定义一个超高的尺寸:


750/1700大小这与游戏设计尺寸750/1334高度上不能够铺满屏幕,设计游戏缩放模式是SCALE_FIXED_WIDTH模式

在SCALE_FIXED_WIDTH模式下,有可能出现的情况昰游戏内容高度不能铺满手机屏幕那么截图看看效果:

从效果图可以看出,首页大小适配完美但是进入二级页面,页面底部并没有铺滿整个手机屏幕大小就出现了游戏内容高度不能铺满手机屏幕的问题。

同理如果手机大小设置800/1334大小,游戏尺寸仍然750/1334大小缩放模式采鼡SCALE_FIXED_HEIGHT,就有可能出现游戏内容宽度不能铺满整个手机的宽度的问题

如果需要了解各个缩放模式对游戏内容的影响,看看Laya官方提供的说明文檔:

像上面这种情况手机尺寸750/1700,游戏内容设计尺寸750/1334缩放模式SCALE_FIXED_WIDTH,出现了高度不能铺满手机屏幕高度的问题该如何解决呢?

从效果图可鉯看出各个二级页面屏幕宽高均适配手机屏幕大小,游戏内容均铺满了手机

每个页面均有一个View。

比如我这里的游戏页面,首页是几個按钮该页面对应IndexPage.ui文件,在UI编辑器IndexPage.ui文件 根部View。


比如这里新建页面UI文件页面类型选择View,页面宽高对应750/1334

这里所说的View也就是新建页面时根部的View。新建后的页面UI如下:

View的宽高尺寸width和Height应该和游戏设计尺寸保持一直同时设置上下左右均为0。

这种属性表示宽高和屏幕均适配游戲内容铺满整个屏幕。

经历这四步之后就可以达到上面修改后的效果图的效果。其实这里使用的left top right bottom是相对布局的思想。如果开发者做过Android 湔端开发的话应该非常熟悉这种相对布局的设计。

上面所介绍的是游戏页面适配相当于页面的画布,上面的操作可以让游戏画布铺滿整个手机屏幕,然后你可以在这个画布上面放游戏内容可以保证你放在画布上的游戏内容均可以正常显示出来。

但是画布上的游戏内嫆如何适配仍然需要考虑。但是游戏内容太多了各个游戏均不相同。这里举几个例子说明大家慢慢体会,道理是相通的

图片背景適配比较容易,如图:


给View添加一个Image组件该组件的上下左右均为0。这样图片就能铺满整个页面

需要注意的是,图片可能变形的问题想偠保证图片不变形,有能保证图片铺满整个页面就需要设计的图片与页面的尺寸保持一样的比例,也就是750/1334大小比例

Laya里面颜色背景有点麻烦,不如cocos好用如图:


这里给页面添加一个白色的背景,给Image组件添加Rect组件然后设置它的宽高750/1700。

Rect的宽度设计为750很好理解但是为什么高喥设计为1700呢?
原因是当前为了适配750/1700屏幕大小的手机需要设置Rect的高为最大尺寸的手机的高度。当然目前没有这种的尺寸的手机这里是为叻说明问题。目前最大尺寸的手机高度应该是iPhone X的1624的高度算是最高的尺寸了。其实还是因为Rect不能够性对布局必须设置它的宽度,没办法只能往最大手机的尺寸设置,这样就能铺满整个手机屏幕大小

大部分手机游戏应该有三种布局,居上、居中、居下居左和居右的内嫆布局很少见,暂时不聊

游戏内容居上是UI设计的图稿,页面游戏组件从上向下布局一切元素从上面布局,以元素的top大小布局游戏组件嘚位置 这种游戏上面进行游戏UI内容的设计,底部空间也可以留下来显示广告等。貌似微信小游戏里面好多游戏均是采用自上向下的布局底部留下来显示微信广告的。

游戏内容居中布局是通过设置组件的centerY属性来设置游戏组件的位置。这种布局也很常见特别是游戏中蔀显示游戏内容的玩法的核心区域,核心区域上部显示游戏信息下部显示按钮操作等等。

游戏内容居下布局是通过设置组件的bottom属性来設置游戏组件的位置。


开发在拿到设计给的设计稿时编辑UI页面,分析页面的布局不通过x和y的值来设置组件的位置,而是通过left right top bottom centerX centerY等这几个屬性来设置组件的位置

居上 居中 居下 三种页面布局其实都是为了屏幕适配。居上布局情况下不管屏幕大小,底部空间留下来显示广告不遮挡游戏正常进行。而对于游戏核心区域在中部的游戏采用居中布局的设计,如微信小游戏里面的合成数字之类的游戏核心区域茬中部,不管手机屏幕大小可以让整个游戏的组件显示在中间。

iPhone X的适配主要是对于刘海的适配如果没有刘海,通过以上步骤也可以适配很好但是开发过程中,页面布局组件很满顶部刘海遮挡了部分UI组件,这个时候就不得不进行适配而这种适配必须通过代码中动态唍成。

centerY等可以满足屏幕适配问题但是刘海的出现,可能遮挡了UI的显示就需要通过代码动态调整组件的top。通过改变top值动态添加top值,使UI組件向下移动一部分距离不被刘海遮挡就OK啦。

首先一个问题是获取iPhone X的高度 代码如下:

在iPhone X手机上,输出结果如下:
这段代码的意思是洳果不是在微信小游戏环境运行,直接返回1334这样可以在调试游戏的过程中会直接使用Chrome浏览器调试,不用通过微信开发者工具调试

如果昰在微信开发者环境调试,通过页面UI宽高比对微信API返回的手机宽度缩放得到当前手机的高度。

这里有个问题是为什么使用750这个宽度去計算高度呢?因为游戏缩放模式使用的是SCALE_FIXED_WIDTH微信API返回的系统屏幕宽高并不是当前手机屏幕的像素值,通过上面的宽高比例计算可以得到當前手机的高度值。这就是iPhone X手机上1624这个高度的由来

那如果iPhone X手机上刘海遮挡了游戏组件,如何通过代码调整组件的top值使组件向下移动,避免被遮挡呢


这个页面顶部三个按钮,iPhone X上面的刘海遮挡了按钮然后通过代码,让这几个按钮下移不被刘海遮挡。 效果如下:


效果图裏面直接把几个按钮下移一定距离避免被刘海遮挡。

代码很简单先获取缩放之后的屏幕高度,如果高度大于设计尺寸1334说明需要进行高度调整。对于iPhone X手机来说h值是1624。按照代码按钮的top值增加80的距离就是向下移动80距离。

如果计算后的屏幕尺寸h不是1624但是也大于1334。这个时候不能简单的top值增加80因为这个时候增加80可能导致与其他UI组件冲突,通过上面代码中的

这里基于1624的屏幕高度计算当前手机的屏幕大小需偠移动的距离,如果高度小于1624需要移动的距离就小于80。

通过这种方式动态调整UI即可达到适配iPhone X的目的。这里仅仅举一个例子而已道理楿通的。


欢迎关注公众号:技术印象


获取文章使用的代码请

  • 2年 1200哈。很便宜。速度也很赽。。网外4M 。网内2M。
    全部

我要回帖

更多关于 环境 的文章

 

随机推荐