////如有侵权 请联系我进行删除 email:YZFHKM@163.com

1、游戏屏幕适配

屏幕适配是为了让我们的项目能够跑在各种电子设备上(手机,平板,电脑)

那么了解是适配之前首先要了解两个知识点:

1-1、什么是像素?

单位面积中构成图像的点的个数。

特点:单位面积内的像素越多,分辨率越高,图像的效果就越好。

1-2、什么是分辨率?

分辨率可以从显示分辨率与图像分辨率两个方向来分类。

示分辨率(屏幕分辨率)是屏幕图像的精密度,是指显示器所能显示的像素有多少.分辨率的单位有:(dpi点每英寸)、lpi(线每英寸)和ppi(像素每英寸)。

特点:

图像的分辨率越高,所包含的像素就越多,图像就越清晰,印刷的质量也就越好。

同时,它也会增加文件占用的存储空间。

1-3、移动设备分辨率 –以iphone 为例

Paste_Image.png

2、什么是适配?

什么是适配?

适应、兼容各种不同的情况

游戏开发中,适配的常见种类

¤系统适配

针对不同版本的操作系统进行适配,例如Unity3D 5.4系统

¤屏幕适配

针对不同大小的屏幕尺寸进行适配,例如Iphone5s,iphone7

iPhone的尺寸

3.5inch、4.0inch、4.7inch、5.5inch

iPad的尺寸

7.9inch、9.7inch

屏幕方向

竖屏

横屏

3、Unity3D 中的屏幕分辨

3-1.

屏幕的宽高比(Aspect Ratio) = 屏幕宽度/屏幕高度

3-2.

Unity2D中摄像机镜头的尺寸决定了我们实际看到游戏内容的多少,在编辑器中我们可以通过调整摄像机Camera的orthographicSize属性值来调整摄像机的大小

Paste_Image.png

注:Unity3D中这个比例的默认值是100,即100像素等于1单位。

如果我们的游戏屏幕有640像素高,那么实际换算成单位高度则是6.4个单位,

当我们摄像机的orthographicSize值是3.2时,摄像机大小刚好与屏幕大小相等

4、Unity3D中的屏幕适配设置

4-1:像素适配设置(固定分辨率)

Paste_Image.png

2、屏幕宽高比

屏幕的宽高比Aspect Ratio = 屏幕宽度/屏幕高度

Paste_Image.png

5、Unity3D中的摄像机设置

Unity编辑器中只能直接调整摄像机的高度,那摄像机的宽度是如何确定的呢?

答案就是我们最前面提到的屏幕宽高比。Unity会根据当前屏幕实际的宽高比和摄像机的orthographicSize值来计算出摄像机的宽度值,即:

摄像机实际宽度 = 摄像机orthographicSize * 2 * 屏幕宽高比

即是

摄像机实际宽度 = 摄像机高度 * 屏幕宽高比

我举个例子说明一下,iPhone4的屏幕像素为640*960,宽高比为2:3,假设Pixels To Units值为100,那么如果设摄像机高度size值为4.8,那么摄像机实际宽度按照公式算出6.4,刚好就是屏幕的单位宽度。

6、Unity3D中的图片像素比设置

Paste_Image.png

6、Unity3D:关于适配的一些UI问题解决

这里就是重中之重,也是坑点较多的地方

调整相机为设计尺寸,添加Canvas到场景中进行UI设计,但是Canvas默认大小和相机并不重合。

怎么办?

6-1:办法1:

调整Canvas的Render Mode属性为Screen Space - Camera:

将映射游戏内容的Camera拖入Render Camera中,下一个属性Plane Distance表示UI

与Camera的在Z轴距离(其实就是变相反映了UI的Z轴位置)。

接着在Canvas Scaler属性里将Ui Scale Mode属性设置为Scale With Screen Size,

表示Canvas会根据屏幕比例缩放。

下面的Reference Resolution,表示UI宽和高一半的大小。例如设计尺寸为640x960,

则x应为640 / 2 = 320,宽应为960 / 2 = 480。

下面的Screen Match Mode属性选中Match Width Or Height,表示采用宽度(上文有提到过)

或高度(Unity自带适配方式)适配。然后Match调整为0或1,0表示完全宽度适配,

1表示完全高度适配,其他值表示介于两者之间采用比例适配

Paste_Image.png

6-2:办法2:

调整Canvas的Render Mode属性为World Space

1、将Event Camera设置为映射游戏内容的Camera。

2、然后调整Rect Transform组件中的Width和Height为设计尺寸的宽和高,同时将Scale属性的X和Y都调整为0.01(对应unity2d默认情况下像素Pixels与引擎单位Unit对应比例100)。这时,Canvas的宽高正好与摄像机相同。

这两种方法都可以将UI调整为与设计尺寸一致,并且在编辑器中运行与真机中运行效果保持一致。

Paste_Image.png

6-3:办法3:

给摄像机挂下图脚本就可以搞定比例问题:

Paste_Image.png

6-4:设定好就如下图所示

Paste_Image.png

解决屏幕分辨率适配的问题,其实就是解决如何让游戏摄像机尺寸限定在给定范围的问题。

usingSystem.Collections;usingSystem.Collections.Generic;usingUnityEngine;publicclassLeoPlayerSetting:MonoBehaviour {voidUpdate(){//  按ESC退出全屏  if(Input.GetKey(KeyCode.Escape))        {            Screen.fullScreen =false;//退出全屏          }//设置7680*1080的全屏  if(Input.GetKey(KeyCode.B))        {            Screen.SetResolution(1920,1080,true);        }if(Input.GetKey(KeyCode.C))        {            Screen.SetResolution(Screen.width, Screen.height,true);        }//按A全屏  if(Input.GetKey(KeyCode.A))        {//获取设置当前屏幕分辩率  Resolution[] resolutions = Screen.resolutions;//设置当前分辨率  Screen.SetResolution(resolutions[resolutions.Length -1].width, resolutions[resolutions.Length -1].height,true);            Screen.fullScreen =true;//设置成全屏,  }    }}

7、适配总结

1.游戏有效内容,指游戏中一定需要完整显示在屏幕上的内容;

2.游戏实际内容,指全部的游戏内容,包括有效内容和主要是为了适配多分辨率的或其他不重要的目的而增加的内容。

实际的分辨率适配问题与三个尺寸相关,他们分别是:摄像机尺寸,游戏内容尺寸(包括有效内容尺寸和无效内容尺寸)和实际屏幕尺寸。

8、了解游戏中的摄像机

相机(Camera)

是向玩家捕获和显示世界的设备。通过自定义和操纵摄像机,

你可以使你的游戏表现得真正独特。您在场景中摄像机的数量不受限制。

他们可以以任何顺序设定放置在屏幕上的任何地方,或在屏幕的某些部分。

Paste_Image.png

8-1、摄像机属性:

Paste_Image.png

Clear Flags 清除标识

确定了屏幕哪些部分将被清除,方便多个摄像机画不同的游戏元素

Paste_Image.png

Skybox 天空盒:这是默认设置。屏幕上的任何空的部分将显示当前相机的天空盒。

如果当前的相机没有设置天空盒,它会默认在渲染设置(Render Settings )选择天空盒

Solid Color 纯色

任何空部分,屏幕显示为当前相机的背景色。

Depth Only 仅深度

如果你想绘制一个玩家的枪,又不让它内部环境被裁剪,你会设置深度为0的相机绘制环境,

和另一个深度为1的相机单独绘制武器。武器相机的清除标志(Clear Flags )应设置 为depth only。

Don't Clear 不清除

此模式不清除颜色或深度缓存。每一帧在下一帧结束后绘制,看上去像是涂抹(smear-looking)的效果。

这在游戏中不常用,最好是在自定义着色器(custom shader)上使用。

Rendering Path-渲染路径

定义什么绘制方法被用于相机的选项

Paste_Image.png

Use Player Settings 使用玩家设置:在玩家设置(Player Settings.)相机使用哪个渲染路径。

Vertex Lit 顶点光照 :所有被这个相机渲染的物体都将渲染成Vertex-Lit物体。

Forward 正向渲染:所有对象每材质渲染只渲染一次,和Unity 2.x中的标准一样

Deferred 延迟照明:所有物体将在无光照的环境渲染一次,然后在渲染队列尾部将物体的光照一起渲染出来。

Traget Texture-目标纹理:

Paste_Image.png

渲染纹理 (Render Texture)包含相机视图输出。这会使相机渲染在屏幕上的能力被禁止。

补充:Vertex Lit:顶点光照

这个Shader是Vertex-Lit,是最简单的Shader之一。这个Shader渲染代价是非常小的

所有照射在该物体上的光源通过一次光能传递渲染完成并且只计算顶点光源。

因为是Vertex-Lit,所以不会有任何基于像素渲染的效果,例如:Light Cookies,Normal Mapping

和Shadows。这个Shader对模型的细分同样更加敏感,假如在很靠近立方体的地方放置一个

点光源,并且应用这个Shader,这个光源只会在此角落进行计算

General shader performance 通常的着色器性能

Unlit. This is just a texture, not affected by any lighting.�不发光。这只是一个纹理,不被任何光照影响

VertexLit. 顶点光照

Diffuse. 漫反射

Normal mapped. �法线贴图,比漫反射更昂贵:增加了一个或更多纹理(法线贴图)和几个着色器结构

Specular. This adds specular highlight calculation. �高光。这增加了特殊的高光计算

Normal Mapped Specular. Again, this is a bit more expensive than Specular. �高光法线贴图。这比高光更昂贵一点

Parallax Normal mapped. This adds parallax normal-mapping calculation. �视差法线贴图。这增加了视差法线贴图计算

Parallax Normal Mapped Specular..�视差高光法线贴图。这增加了视差法线贴图和镜面高光计算

http://www.ceeger.com/Components/shader-NormalVertexLit.html

http://www.ceeger.com/Components/shader-Performance.html

作者:雷潮

链接:https://www.jianshu.com/p/95cb4621206e

來源:简书

简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

作者:某人在
链接:https://www.jianshu.com/p/9dfa070006d9
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

Unity 手机屏幕适配的更多相关文章

  1. 了解真实的『REM』手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  2. 了解真实的rem手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  3. 真实的『REM』手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  4. Android开发——Android手机屏幕适配方案总结

    )密度无关像素,单位为dp,是Android特有的单位 Android开发时通常使用dp而不是px单位设置图片大小,因为它可以保证在不同屏幕像素密度的设备上显示相同的效果. /** * dp与px的转 ...

  5. Unity ugui屏幕适配与世界坐标到ugui屏幕坐标的转换

    我们知道,如今的移动端设备分辨率五花八门,而开发过程中往往只取一种分辨率作为设计参考,例如采用1920*1080分辨率作为参考分辨率. 选定了一种参考分辨率后,美术设计人员就会固定以这样的分辨率来设计 ...

  6. Unity 手机屏幕翻转问题 横屏

    1920*1080的图在1080*1920的设备上观看效果: 如果要做横屏游戏,就要改Build中的Player Settings,强制左旋转或右旋转,默认是Auto 垂直于地面的手机在横屏下分辨率是 ...

  7. 『REM』手机屏幕适配

    function adapt(designWidth, rem2px){ var d = window.document.createElement('div'); d.style.width = ' ...

  8. CSS3自适配手机屏幕

    @media only screen and (max-width:350px){ .img{ width: 80px; height:70px; background-image: url(./im ...

  9. 了解真实的『REM』多终端屏幕适配

    作者:hbxeagle 链接:github.com/hbxeagle/rem/blob/master/README.md rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使 ...

随机推荐

  1. BBS论坛 home主页与个人站点主页

    五.Home主页与个人站点主页 home首页代码: # views.py视图函数部分代码def home(request): # 将数据库中的所有文章展示到主页 article_list = mode ...

  2. 74HC595点亮8个LED灯

    一.原理介绍 595有两个寄存器,都是8位的,如下所示: 595是串入并出带有锁存功能移位寄存器,它的使用方法简单: - -  在正常使用时 /SCLR接高电平,/G接低电平. - -  从SER每输 ...

  3. 逻辑右移函数 srl()与算术右移函数 sra() (转)

    比如一个有符号位的8位二进制数11001101,逻辑右移就不管符号位,如果移一位就变成01100110.算术右移要管符号位,右移一位变成10100110. 逻辑左移=算数左移,右边统一添0 逻辑右移, ...

  4. wget 下载文件

    # -c 继续执行上次终端的任务# --http-user http用户名# --http-passwd http密码# --no-check-certificate 不检查ssl/tsl证书. wg ...

  5. 浏览器http跳转至https问题

    Chrome 浏览器 地址栏中输入 chrome://net-internals/#hsts 在 Delete domain security policies 中输入项目的域名,并 Delete 删 ...

  6. 转:深入浅出cache写策略

    转自:http://www.ssdfans.com www.ssdfans.com › blog › 2018/07/27 › 深入浅出cach... 随着计算机行业的飞速发展,CPU的速度和内存的大 ...

  7. HTML中的相对路径与绝对路径

    路径 实际工作中,通常新建一个文件夹专门用于存放图像文件,这时再插入图像,就需要采用“路径”的方式来指定图像文件的位置. 路径可以分为: 相对路径和绝对路径 相对路径 图像文件和HTML文件位于同一文 ...

  8. 分布式项目controller项目中web.xml配置文件的编写

    <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" " ...

  9. 干货满满!解密阿里云RPA (机器人流程自动化)的产品架构和商业化发展

    阿里云RPA,作为阿里云自研8年的技术,在资本的热捧下,逐渐从幕后来到台前,成为企业服务市场的黑马.本文将从产品上全面剖析,阿里云RPA这款产品的现阶段情况,同时简单谈谈阿里云RPA的商业化进展. 阿 ...

  10. django简单实现短url

    一.短url的原理 什么是短url: 简单讲就是把普通正常访问的网址,转换成比较短的网址,例如:https://www.cnblogs.com/angelyan/articles/10667354.h ...