【游戏技术群】959392658  【游戏出海群】12067810
游戏蛮牛 手机端
开启辅助访问
 找回密码
 注册帐号

扫一扫,访问微社区

开发者专栏

关注:2373

当前位置:游戏蛮牛 技术专区 开发者专栏

__________________________________________________________________________________
开发者干货区版块规则:

  1、文章必须是图文形式。(至少2幅图)
      2、文章字数必须保持在1500字节以上。(编辑器右下角有字数检查)
      3、本版块只支持在游戏蛮牛原创首发,不支持转载。
      4、本版块回复不得无意义,如:顶、呵呵、不错......【真的会扣分的哦】
      5、......
__________________________________________________________________________________
查看: 1537|回复: 26

[士郎] 吃鸡开发实战之倍镜实现

[复制链接]  [移动端链接]
排名
3
昨日变化

7085

主题

7612

帖子

2万

积分

Rank: 16

UID
1231
好友
185
蛮牛币
11082
威望
30
注册时间
2013-7-29
在线时间
3640 小时
最后登录
2018-12-14

社区QQ达人活力之星原创精华达人突出贡献奖财富之证游戏蛮牛QQ群会员蛮牛妹VIP

发表于 2018-9-25 10:56:39 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?注册帐号

x
在吃鸡元年,你们是否也中了吃鸡的毒?在短短的半年时间内,吃鸡这个词仿佛病毒一样疯狂的入侵到每个人的日常生活中,我也不例外.
最近接到项目需求,要对项目引入吃鸡里面的某些功能元素.于是顺手把实现的过程也写成文章来分享一下.这篇文章主要分享吃鸡里面倍镜的实现效果.
在这里我用到的是Unity这个引擎来实现. 单纯的吃鸡倍镜效果实现起来是非常简单的.在这里我用两张图来给大家剖析一下他的实现原理。
1.jpg

1表示我们摄像机中的物体,2代表我们最后呈像的框,3代表我们摄像机渲染区域,可以看成是由无数个平面构成的 如图中4,这样构成一个平面,最后将这些平面按照我们的分辨率投射到呈像框里面.
第二张图是修改了我们摄像机渲染角度后的图片. 可以发现我们的渲染区域缩小了,然后我们的 物体在我们4号的平面里面所占的比例增加了.然后我们把他们两个摄像机所渲染出来的游戏视图展示出来
2.jpg
可以发现,我们的物体在缩小摄像机渲染角度之后,成像大小发生了变化.
这便是我们倍镜的实现原理了.
接下来我们将这个原理运用到我们的实验场景中看一下效果.
第一步
先创建出两个UI, 一个是我们的基础镜,一个是我们的倍镜
3.jpg
4.jpg
注意:镜子一定要放在我们屏幕的中心点,不能有误差,在这里我让镜子偏移五个像素我们看一下效果:
5.jpg

原本我们的点是对着靶子的十环处.放大之后他往下偏移了不少.因为在我们放大镜头的同时,我们的误差也在放大,所以一定要让我们的镜头对准屏幕的正中间.
第二步
通过开关镜的操作修改摄像机的照射角度
6.jpg

注意:在这里摄像机的渲染模式必须是Perspective广角渲染.
上面的原理我们已经分析出来了,就是修改摄像机的渲染角度,在这里并不是说去修改摄像机Transform里面的那个角度,而是要去修改Camera下面Field of View 这个属性的值。
如果说上面的原理分析不能理解的话呢,我们这里举一个栗子.
7.jpg
这就好比我们打开手机的拍照功能,然后放大镜头.会发现我们镜头内的照射区域变小了但是区域内的物体变大了,.在这里修改照射角度就是这个原理.
下面通过代码去修改它的值:
[AppleScript] 纯文本查看 复制代码
 public void OpenMirror(ScopeType _scope)
    {
        Float _timesScope = GetTimesScope(_scope);//获取倍镜缩放倍数
        Scope.gameObject.SetActive(true);//倍镜开启
        baseScope.gameObject.SetActive(false);//基础镜关闭
        mainCamera.fieldOfView /= _timesScope;//摄像机渲染角度修改
        mCurrScopeType = _scope;//将镜子的类型储存起来.
    }

第三步
在update里面进行检测, 当右键按下时判断当前的镜子类型,然后决定调用镜子开/关的方法即可.
[AppleScript] 纯文本查看 复制代码
void Update()
{
   if(Input.GetMouseButtonDown(1))
   {
     if(mCurrScopeType == ScopeType.BaseScope)
     {
         OpenMirror(mCurrChoseScope);
         //mCurrChoseScope存储了所选择的倍镜(尚未开启),mCurrScopeType是当前使用的倍镜
         //在这里注意区分好
     }
     else
     {
         CloseMirror();//关闭倍镜.  
     }
   }
}

最终实现的效果就是下面这样了:
1.1.gif


这也是当前吃鸡以及几款吃鸡手游倍镜的实现方式了.
就我个人观点.这种实现方式其实是不合理的,因为他是将我们整个游戏视图都给放大拉进了,并不是说在镜子区域内局部放大的.例如:彩虹六号里面的倍镜效果做的就比较舒服,他是在镜子区域内去局部放大物体的.
知乎@代码律动

[发帖际遇]: 清风 发帖时在路边捡到 2 蛮牛币,偷偷放进了口袋. 幸运榜 / 衰神榜

跟我念“站长妹纸萌萌哒!”我说站长,你说YO!爱你们么么哒~
回复

使用道具 举报

3偶尔光临
174/300
排名
10942
昨日变化
6

0

主题

39

帖子

174

积分

Rank: 3Rank: 3Rank: 3

UID
295480
好友
1
蛮牛币
186
威望
0
注册时间
2018-9-2
在线时间
45 小时
最后登录
2018-12-4
发表于 2018-9-25 11:56:26 | 显示全部楼层
666666666666666

点评

ffffff  发表于 2018-9-26 13:41
[发帖际遇]: ok481384 发帖时在路边捡到 2 蛮牛币,偷偷放进了口袋. 幸运榜 / 衰神榜

回复 支持 反对

使用道具 举报

5熟悉之中
620/1000
排名
4848
昨日变化
29

1

主题

138

帖子

620

积分

Rank: 5Rank: 5

UID
204004
好友
0
蛮牛币
448
威望
0
注册时间
2017-1-22
在线时间
191 小时
最后登录
2018-12-15
发表于 2018-9-25 13:23:29 | 显示全部楼层
感谢分享!!!!!!!!!

点评

赞一下  发表于 2018-9-26 13:38

回复

使用道具 举报

排名
13870
昨日变化
9

0

主题

15

帖子

90

积分

Rank: 2Rank: 2

UID
259863
好友
0
蛮牛币
188
威望
0
注册时间
2017-12-15
在线时间
19 小时
最后登录
2018-12-5
发表于 2018-9-25 14:38:41 | 显示全部楼层
我也感觉局部放大真实点,感觉

回复 支持 反对

使用道具 举报

2初来乍到
128/150
排名
13870
昨日变化
9

0

主题

36

帖子

128

积分

Rank: 2Rank: 2

UID
271893
好友
0
蛮牛币
32
威望
0
注册时间
2018-3-12
在线时间
34 小时
最后登录
2018-10-29
发表于 2018-9-25 15:32:14 | 显示全部楼层
感谢大佬

回复

使用道具 举报

6蛮牛粉丝
1060/1500
排名
3281
昨日变化
13

1

主题

306

帖子

1060

积分

Rank: 6Rank: 6Rank: 6

UID
57841
好友
4
蛮牛币
18
威望
0
注册时间
2014-11-26
在线时间
317 小时
最后登录
2018-12-14
发表于 2018-9-25 20:26:31 | 显示全部楼层
看下下喜爱西安啊啊啊

回复 支持 反对

使用道具 举报

7日久生情
2855/5000
排名
2481
昨日变化
1

2

主题

1848

帖子

2855

积分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
241666
好友
0
蛮牛币
10740
威望
0
注册时间
2017-9-6
在线时间
443 小时
最后登录
2018-12-9
发表于 2018-9-26 06:40:15 | 显示全部楼层
感谢分享寄东西

回复

使用道具 举报

4四处流浪
408/500
排名
5980
昨日变化
46

0

主题

56

帖子

408

积分

Rank: 4

UID
288982
好友
0
蛮牛币
680
威望
0
注册时间
2018-7-8
在线时间
130 小时
最后登录
2018-12-15
发表于 2018-9-26 08:28:30 | 显示全部楼层

感谢分享!!!!!!!!!

回复

使用道具 举报

5熟悉之中
685/1000
排名
4164
昨日变化
21

0

主题

188

帖子

685

积分

Rank: 5Rank: 5

UID
267103
好友
0
蛮牛币
1699
威望
0
注册时间
2018-1-31
在线时间
157 小时
最后登录
2018-12-14
发表于 2018-9-26 09:02:32 | 显示全部楼层
{:107:}

回复

使用道具 举报

6蛮牛粉丝
1372/1500
排名
2427
昨日变化
7

5

主题

427

帖子

1372

积分

Rank: 6Rank: 6Rank: 6

UID
54335
好友
2
蛮牛币
2039
威望
0
注册时间
2014-11-9
在线时间
370 小时
最后登录
2018-12-15
发表于 2018-9-26 09:19:41 | 显示全部楼层

回复

使用道具 举报

6蛮牛粉丝
1496/1500
排名
2008
昨日变化
1

2

主题

395

帖子

1496

积分

Rank: 6Rank: 6Rank: 6

UID
213483
好友
0
蛮牛币
2581
威望
0
注册时间
2017-3-21
在线时间
437 小时
最后登录
2018-12-15
发表于 2018-9-26 09:33:42 | 显示全部楼层
跟我念“站长妹纸萌萌哒!”我说站长,你说YO!

回复 支持 反对

使用道具 举报

4四处流浪
380/500
排名
9057
昨日变化
3

2

主题

154

帖子

380

积分

Rank: 4

UID
252298
好友
1
蛮牛币
395
威望
0
注册时间
2017-11-3
在线时间
100 小时
最后登录
2018-12-10
发表于 2018-9-26 10:02:06 | 显示全部楼层
感谢分享

回复

使用道具 举报

3偶尔光临
193/300
排名
9846
昨日变化
2

0

主题

26

帖子

193

积分

Rank: 3Rank: 3Rank: 3

UID
289014
好友
0
蛮牛币
174
威望
0
注册时间
2018-7-9
在线时间
61 小时
最后登录
2018-10-26
发表于 2018-9-26 10:03:58 | 显示全部楼层
感谢分享

回复

使用道具 举报

6蛮牛粉丝
1315/1500
排名
1499
昨日变化
3

0

主题

176

帖子

1315

积分

Rank: 6Rank: 6Rank: 6

UID
137070
好友
0
蛮牛币
2604
威望
0
注册时间
2016-2-20
在线时间
317 小时
最后登录
2018-12-15
发表于 2018-9-26 10:09:24 | 显示全部楼层
666666感谢楼主分享!

回复 支持 反对

使用道具 举报

7日久生情
2045/5000
排名
2684
昨日变化
9

0

主题

1189

帖子

2045

积分

Rank: 7Rank: 7Rank: 7Rank: 7

UID
189581
好友
0
蛮牛币
2953
威望
0
注册时间
2016-12-5
在线时间
327 小时
最后登录
2018-12-14
发表于 2018-9-26 10:26:26 | 显示全部楼层
可以的给力啊

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册帐号

本版积分规则

快速回复 返回顶部 返回列表