unity 放大镜

 

完整教程请移步公众号  小森游戏制作  查看！！

   同学们好，我是小森老师！本次给大家带来一个 放大镜 工具的制作教程

首先我们下载需要的图片，模型素材 导入unity 这里老师使用的是2021版本

原理介绍：

我们知道 当我们用透视相机来看物体的时候 会有近大远小的效果，可以调整相机和目标的距离 或者调整相机的fieldofview来控制远近。基于此 我们想要获取放大效果就要拉近相机，而我们主相机如果拉近了就会导致整个画面都拉近，所以这里需要一个单独的相机来渲染放大的效果

实现:

    按照原理  我们先创建一个相机，并作为主相机的子物体（保证位置），调整fieldofview或者拉远一点：

这个时候我们game还是显示的其中一个相机，那么作为放大镜的相机（后边称之为放大相机）渲染（看到）的内容就需要显示到一个媒介上，也就是rendertexture然后把该内容通过rawimage或者面片显示出来，asssets文件夹里右键创建rendertexture 并调整size（越大越清楚）

然后创建Rawiamge 并调整大小放置屏幕正中间，texture指定为刚才的rendertexture

并调整相机 渲染texture为刚才的rendertexture，并调整渲染的layer（只渲染需要的 背景去掉）

吧模型设置为目标layer 这时效果如下

这里为了效果和方便区分我们加一个边框和遮罩

创建一个iamge 并指定一个实心圆 添加一个mask组件 ，然后调整大小后吧rawiamge拖到下边作为它的子物体（只有mask的子物体才能遮罩）

拖动放大相机已经可以简单看到效果，下一步我们需要写脚本获取鼠标点击位置 放大指定位置：

 public Transform magnifierCam;    public Camera main;    // Update is called once per frame    void Update()    {        if(Input .GetMouseButton(0))//鼠标左键按压        {            Vector3 pos = Input.mousePosition;            pos.z = magnifierCam.position.z;//只同步鼠标的xy z使用相机自己的            Vector3 worldpos = main.ScreenToWorldPoint(pos);//鼠标点击位置映射到场景里                      magnifierCam.position = worldpos;//移动相机        }    }    

指定主相机和放大相机 运行拖动鼠标后效果如下;

到目前已经有简单的放大效果，但是还有一些问题，接下来进行优化：

1，添加边框 去除背景:取消mask的showmask

  创建iamge 使用一个放大镜的图来作为背景：

2，修改放大相机为正交模式（应该是让他再模型的前方 正视图正交的形式）

3，相机位置更新改为点击鼠标位置发射射线 检测模型 对应的点 来计算相机应该在的位置 完整代码如下：

using System.Collections;using System.Collections.Generic;using UnityEngine;
/// <summary>/// 放大镜/// </summary>public class Magnifier : MonoBehaviour{
   // Start is called before the first frame update    void Start()    {        ui.gameObject.SetActive(false);//默认隐藏    }    public Camera magnifierCam;    public Transform ui;    public float dis;//跟模型的距离    public LayerMask modelLayer;    // Update is called once per frame    void Update()    {        if(Input .GetMouseButton(0))//鼠标左键按压        {            Ray ray = Camera.main.ScreenPointToRay(Input.mousePosition);            RaycastHit hit;            if(Physics .Raycast (ray, out hit, 100,modelLayer))            {                Vector3 dir = Camera.main.transform.position - hit.transform.position;                dir.y = 0;//取消高度                magnifierCam.transform.position = hit.point + dir * dis;                ui.position = Input.mousePosition;                ui.gameObject.SetActive(true);            }else            {                ui.gameObject.SetActive(false);//如果没有点到模型 就是不放大 就隐藏放大镜            }        }else if(Input .GetMouseButtonUp(0))        {            ui.gameObject.SetActive(false);//松开鼠标就隐藏放大镜        }
   }}


整体对象调整如下：

最后 给模型添加碰撞器，不添加没法点击交互！！

这个时候效果已经达到！！1

制作不易，期待您的点赞关注和转发!!!

         

需要源码可以加入会员，源码以更新至会员库！！

某宝搜索 小森会员：注意店铺名 谨防选错！！