Unity涂鸦纹理实现

news2024/12/25 9:01:38

文章目录

  • 前言
  • 实现过程
    • 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.coloradmin.cn/o/1636659.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

微服务之SpringCloud AlibabaSeata处理分布式事务

一、概述 1.1背景 一次业务操作需要跨多个数据源或需要跨多个系统进行远程调用&#xff0c;就会产生分布式事务问题 but 关系型数据库提供的能力是基于单机事务的&#xff0c;一旦遇到分布式事务场景&#xff0c;就需要通过更多其他技术手段来解决问题。 全局事务&#xff1a;…

SOLIDWORKS2021:革新设计界的里程碑,引领您迈向数字化制造未来

在2021年&#xff0c;SOLIDWORKS 2021的发布犹如一股清新的创新之风&#xff0c;吹遍了整个设计与工程领域。作为业界领先的3D CAD解决方案&#xff0c;SOLIDWORKS 2021不仅巩固了其在设计软件领域的领导地位&#xff0c;更以前所未有的方式激发了设计者的创造力与生产力。亿达…

Flask教程3:jinja2模板引擎

文章目录 模板的导入与使用 模板的导入与使用 Flask通过render_template来实现模板的渲染&#xff0c;要使用这个方法&#xff0c;我们需要导入from flask import rander_template&#xff0c;模板中注释需放在{# #}中 模板的第一个参数为指定的模板文件名称&#xff0c;如自定…

有关CSS中排版常见问题(清除默认样式问题 + 元素居中问题 + 元素之间的空白问题 + 行内块的幽灵空白问题)

前言&#xff1a;在练习CSS排版的时候&#xff0c;我们经常会遇到一些排版上的问题&#xff0c;那么我们如何去解决这些问题呢&#xff1f;本篇文章给出了一些新手在练习排版时候可能会遇到的问题的解决方案。 ✨✨✨这里是秋刀鱼不做梦的BLOG ✨✨✨想要了解更多内容可以访问我…

1天搞定uniApp+Vue3+vite+Element UI或者Element Plus开发学习,使用vite构建管理项目,HBuilderX做为开发者工具

我们通常给小程序或者app开发后台时&#xff0c;不可避免的要用到可视化的数据管理后台&#xff0c;而vue和Element是我们目前比较主流的开发管理后台的主流搭配。所以今天石头哥就带大家来一起学习下vue3和Element plus的开发。 准备工作 1&#xff0c;下载HBuilderX 开发者…

Python 可以对数据进行哪些可视化?

Python 可视化 一、条形图&#xff08;或柱状图&#xff09; 1.代码如下&#xff1a; import matplotlib.pyplot as plt import pandas as pddf pd.DataFrame({County:[America,Canada,Australia,Germany,French,China],GDP:[80,30,70,80,60,75] })plt.bar(df[County],df[G…

Linux 虚拟主机切换php版本及参数

我使用的Hostease的Linux虚拟主机产品,由于网站程序需要支持高版本的PHP,程序已经上传到主机&#xff0c;但是没有找到切换PHP以及查看PHP有哪些版本的位置&#xff0c;因此咨询了Hostease的技术支持&#xff0c;寻求帮助了解到可以实现在cPanel面板上找到此切换PHP版本的按钮&…

ElasticSearch教程入门到精通——第二部分(基于ELK技术栈elasticsearch 7.x新特性)

ElasticSearch教程入门到精通——第二部分&#xff08;基于ELK技术栈elasticsearch 7.x新特性&#xff09; 1. JavaAPI-环境准备1.1 新建Maven工程——添加依赖1.2 HelloElasticsearch 2. 索引2.1 索引——创建2.2 索引——查询2.3 索引——删除 3. 文档3.1 文档——重构3.2 文…

Docker部署RabbitMQ与简单使用

官网地址&#xff1a; Messaging that just works — RabbitMQ 我的Docker博客:Docker-CSDN博客 1.结构 其中包含几个概念&#xff1a; **publisher**&#xff1a;生产者&#xff0c;也就是发送消息的一方 **consumer**&#xff1a;消费者&#xff0c;也就是消费消息的一方 …

Java image-processing 包依赖错误

错误的信息为&#xff1a; [ERROR] Failed to execute goal on project image-processing: Could not resolve dependencies for project com.ossez:image-processing:jar:0.0.2-SNAPSHOT: Failed to collect dependencies at org.openimaj:core-image:jar:1.3.10 -> org.op…

Java Maven 编译资源文件拷贝错误 dirCompressed.zip failed with MalformedInputException:

完整的错误信息为&#xff1a; [ERROR] Failed to execute goal org.apache.maven.plugins:maven-resources-plugin:3.3.1:resources (default-resources) on project core-java-io: filtering C:\WorkDir\Repository\iSharkfly-Docs\java-tutorials\core-java-modules\core-ja…

简单数据加解密,JS和JAVA同时实现

前端Vue调用Java后端接口中的数据进行加密&#xff0c;以避免敏感数据泄露。 现在实现一个高性能加密方法&#xff0c;用来对数据进行加密后传输。算法包括JS的加密和解密方法&#xff0c;也包括Java的加密解密方法。 可以在前端加密&#xff0c;后端解密。也可以在后端加密&…

JAVAEE—servlet的概念及使用,使用servlet接口实现一个表白墙

文章目录 servlet的概念静态页面和动态页面servlet的作用 写出一个servlet程序目录的创建设置smart tomcat编写helloworld servlet的概念 首先我们要搞明白什么是servlet&#xff0c;servlet是一种实现动态页面的技术&#xff0c;他是由tomcat提供给程序员的一组API可以帮助程…

VScode 无法连接云服务器

试了很多方法&#xff0c;比如更换VScode版本&#xff0c;卸载重装&#xff0c;删除配置文件 重启电脑&#xff0c;都无法成功。最后重置电脑后才连接上&#xff0c;但是重启服务器后又出现该问题。 方法一&#xff1a;修改环境 方法二&#xff1a;把vscode卸载干净重下

nacos-redis-springboot

新项目 准备工作 nacos 版本 2.0.3 redis 最终版本说明 springcloud-alibaba&#xff1a;2.2.7RELEASE springcloud&#xff1a;Hoxton.SR12 springboot&#xff1a;2.3.12.RELEASE Nacos&#xff1a;2.0.3 步骤 启动nacos和redis 准备nacos配置文件 server: port…

3款超好用的PDF在线处理神器,学会了职场工作效率翻倍!

&#x1f60a; 作为一名职场小白,我深知处理文档的痛苦。尤其是面对PDF这个"大魔王",经常感到头大! 合同要合并、简历要压缩、论文要转Word改格式…一个个来手动操作,简直要累死。&#x1f62b; 直到我发现了这些PDF在线处理神器!瞬间感觉自己的工作效率嗖嗖提升,整…

Nginx配置Https缺少SSL模块

1、Linux下Nginx配置https nginx下载和安装此处就忽略&#xff0c;可自行百度 1.1、配置https 打开nginx配置文件 vim /opt/app/nginx/conf/nginx.conf相关https配置 server {listen 443 ssl; #开放端口server_name echarts.net;#域名#redirect to https#ssl on; #旧版#ssl证…

SQL Sever无法连接服务器

SQL Sever无法连接服务器&#xff0c;报错证书链是由不受信任的颁发机构颁发的 解决方法&#xff1a;不用ssl方式连接 1、点击弹框中按钮“选项” 2、连接安全加密选择可选 3、不勾选“信任服务器证书” 4、点击“连接”&#xff0c;可连接成功

[附源码]SpringBoot+Vue网盘项目_仿某度盘

视频演示 [附源码]SpringBootVue网盘项目_仿某度盘 功能介绍 支持秒传支持视频音频播放、拖拽进度条、倍速播放等支持图片预览&#xff0c;旋转&#xff0c;放大支持多人一起上传&#xff0c;共享上传进度&#xff08;例如a上传苍老师学习资料到50%&#xff0c;突然b也上传苍老…

Flask教程2:flask高级视图

文章目录 add_url_rule类视图的引入装饰器的自定义与使用蓝图的使用url_prefix设置蓝图前缀 add_url_rule 欲实现url与视图函数的绑定&#xff0c;除了使用路由装饰器app.route&#xff0c;我们还可以通过add_url_rule(rule,endpointNone,view_funcNone)方法&#xff0c;其中&…