Unity涂鸦纹理实现

news/2024/11/17 0:07:37/

文章目录

  • 前言
  • 实现过程
    • UV坐标和UI坐标对齐
    • 修改像素代码

前言

心血来潮实现下场景中提供一张纹理进行涂鸦的功能。
最终实现效果:
在这里插入图片描述

实现过程

UV坐标和UI坐标对齐

这里的纹理使用了UGUI的Canvas进行显示,所以这里使用一张RawImage。

在这里插入图片描述
因为Unity的视口坐标是以左下角为(0,0)坐标基准的,所以对RawImage的RectTransform进行调整。锚点改成左下角,Pivot坐标改成(0,0)
在这里插入图片描述
因为使用鼠标进行输入的,所以这里需要获取鼠标后,在对坐标进行偏差计算,这里由视口坐标转换成纹理的UV坐标的格式为:
uvPos = mousePos - rectOffest

rectOffset是RawImage的矩形坐标

修改像素代码

计算出相应的x,y坐标后写入纹理,代码如下

    private RawImage m_rawImage;private Texture2D m_texture2D; private int m_widht = 500, m_height = 500;private Vector2 m_offsetVect = new Vector2(); private void Awake(){m_rawImage = GetComponent<RawImage>();m_texture2D = new Texture2D(m_widht,m_height);Color[] colors = new Color[m_widht * m_height];for (int i = 0; i < colors.Length;i++){colors[i] = Color.white; }m_texture2D.SetPixels(colors);m_texture2D.Apply();m_rawImage.texture = m_texture2D;m_rawImage.SetAllDirty();m_offsetVect = m_rawImage.rectTransform.anchoredPosition;}private void Draw(Vector2 pos){int x = Mathf.FloorToInt(pos.x);int y = Mathf.FloorToInt(pos.y);if (x > 0 && x < m_widht && y >=0 && y< m_height){m_texture2D.SetPixel(x,y,Color.black); m_texture2D.Apply(); }} private void Update(){ if (Input.GetMouseButton(0)){Vector2 mousePos = Input.mousePosition; mousePos -= m_offsetVect;Draw(mousePos);  }} 

这样就可以在纹理上进行涂鸦了,但是这个时候会发现,当我们的鼠标很快的时候涂鸦的像素点之间就会有明显的间隔,那么我们就需要做一下插值运算了。

需要记录上一次帧数的画的坐标进行插值。那么修改Update方法如下:

private void Update(){if (Input.GetMouseButtonDown(0)){m_lastFramePos = (Vector2)Input.mousePosition - m_offsetVect;} if (Input.GetMouseButton(0)){Vector2 mousePos = Input.mousePosition; mousePos -= m_offsetVect;Draw(mousePos); if (m_lastFramePos!=mousePos){float dis = Vector2.Distance(mousePos, m_lastFramePos);if (dis > m_brushLerpSize){Vector2 dir = (mousePos - m_lastFramePos).normalized;int num = (int)(dis / m_brushLerpSize);for (int i = 0; i < num; i++){Vector2 newPoint = m_lastFramePos + dir * (i + 1) * m_brushLerpSize;Draw(newPoint);}}}//保存下上帧数的点m_lastFramePos = mousePos;}} 

http://www.ppmy.cn/news/1446708.html

相关文章

【数据结构(邓俊辉)学习笔记】向量05——排序器

文章目录 0. 概述1.统一入口2. 起泡排序2.1 起泡排序&#xff08;基础版&#xff09;2.1.1 算法分析2.1.2 算法实现2.1.3 重复元素与稳定性2.1.4 复杂度分析 3. 归并排序3.1 有序向量的二路归并3.2 分治策略3.3 实例3.4 二路归并接口的实现3.5 归并时间3.6 排序时间 4.综合评价…

使用 LlamaIndex 和 Llama 2-Chat 构建知识驱动的对话应用程序

文章目录 使用 LlamaIndex 和 Llama 2-Chat 构建知识驱动的对话应用程序Llama 2-70B-聊天LlamaIndex 解决方案概述先决条件使用 SageMaker JumpStart 部署 GPT-J 嵌入模型使用 SageMaker Python SDK 进行部署在 SageMaker Studio 中使用 SageMaker JumpStart 进行部署使用 Sage…

3-成功初始化 Kubernetes 控制平面后如何操作

成功初始化 Kubernetes 控制平面后的一系列指示和建议&#xff0c;用于帮助你开始使用你的 Kubernetes 集群。下面是详细的解释和步骤&#xff1a; kubeadm init --apiserver-advertise-address 172.19.35.202 --image-repository registry.cn-hangzhou.aliyuncs.com/google_c…

c#数据库: 10.调用存储过程查询信息,并显示在窗体上

查询女生信息&#xff0c;并将信息显示在窗体上: 原数据表//右键数据库名,新建查询 ------------- 新建查询窗口,添加新建存储过程Procedure_GetGirls1和查询代码如下 : CREATE PROCEDURE dbo.Procedure_GetGirls1 /*存储过程名称*/ AS SELECT * f…

Qt:下载和安装

Qt有两种安装方式&#xff1a;离线安装和在线安装。 旧版的5.12及以前的版本可以选择离线安装&#xff0c;就是下载几个GB的大的安装包。但是之后的版本只能使用在线安装工具安装&#xff0c;因为QT官方不提供离线安装包了。 下载地址&#xff1a; Qt官网&#xff1a;https:/…

【Canvas与艺术】绘制地平线

【关键点】 灭点在透视中的作用。 【成图】 【代码】 <!DOCTYPE html> <html lang"utf-8"> <meta http-equiv"Content-Type" content"text/html; charsetutf-8"/> <head><title>使用HTML5/Canvas绘制地平线<…

【微信小程序调用百度API实现图像识别实战】-前后端加强版

前言&#xff1a;基于前面两篇图像识别项目实战文章进行了改造升级。 第一篇 入门【微信小程序调用百度API实现图像识别功能】----项目实战 第二篇 前后端结合 【微信小程序调用百度API实现图像识别实战】----前后端分离 这一篇主要讲述的是在第二篇的基础上新增意见反馈功能&a…

webox微信群发器多少钱?电脑微信群发软件哪个好用?微信群发助手一次能发多少人?最强稳定群发器来袭

今天给大家推荐一款我们目前在使用的电脑群发工具WeBox&#xff0c;不仅可以无限多开&#xff0c;方便你同时管理多个账号&#xff0c;群发功能更是十分强大&#xff0c;轻松释放你的双手。 软件下载地址>>密码&#xff1a;4as1 WeBox群发功能 下载WeBox打开登录&#x…