【代码】Processing笔触手写板笔刷代码合集

代码来源于openprocessing,考虑到国内不是很好访问,我把我找到的比较好的搬运过来!

合集

参考:https://openprocessing.org/sketch/793375
https://github.com/SourceOf0-HTML/processing-p5.js/tree/master

这个可以体验6种笔触,作者介绍如下:

There are multiple pages. Use the “←” “→” buttons below to switch.
The second page explains the UI.
I will explain the sketches I made in the past.
Some variable names have been changed. I wanted to explain in order, so I divided the processing in detail. The UI has been added so the code is getting longer …
Video of this sketch in action (Twitter)
https://twitter.com/BUN_information/status/1195300719231791104

Gorilla Sun has written an explanation of each part with animations on his blog. Thank you!
https://gorillasun.de/blog/Simulating-brush-strokes-with-Hookes-Law-in-P5JS-and-Processing

其中三种种笔触的代码如下:

笔触4

原笔触代码地址:https://openprocessing.org/sketch/748836

特点:越快越粗,很适合画速写。

在这里插入图片描述

代码

/*
setup=()=>{m=n=x=y=u=v=0,s=0.08,f=0.8;createCanvas(L=500,L);background(C=255)}
draw=()=>{u+=(m-x)*s,v+=(n-y)*s,u*=f,v*=f,a=x,b=y;strokeWeight(abs(u+v)/3+1);line(x+=u,y+=v,a,b)}
mousePressed=()=>{x=m=mouseX,y=n=mouseY}
mouseDragged=()=>{m=mouseX,n=mouseY}
/**/function setup() {mX = mY = x = y = ax = ay = 0;spring = 0.08;friction = 0.8;createCanvas( 500, 500 );background( 255 );
}function draw() {ax += ( mX - x ) * spring;ay += ( mY - y ) * spring;ax *= friction;ay *= friction;oldX = x;oldY = y;x += ax;y += ay;strokeWeight( abs( ax + ay ) / 3 + 1 );line( x, y, oldX, oldY );
}function mousePressed() {mX = x = mouseX;mY = y = mouseY;
}function mouseDragged() {mX = mouseX;mY = mouseY;
}

笔触5

原笔触代码地址:https://openprocessing.org/sketch/754815

特点:越慢越粗,墨水有晕染感,适合写字。

在这里插入图片描述

/*
setup=_=>createCanvas(S=500,S),D=10,m=n=x=y=u=v=r=f=0
draw=_=>{R=r;if(mouseIsPressed){m=mouseX;n=mouseY;!f?(f=1,x=m,y=n):0;u+=(m-x)/2;v+=(n-y)/2;u/=2;v/=2;r=25-sqrt(u*u+v*v)*.7;i=D;while(--i)strokeWeight(R+=(r-R)/D),line(x,y,x+=u/D,y+=v/D)}else if(f){u=v=f=0}}
/**/function setup() {createCanvas(S=500,S);distance = 10;spring = 0.5;friction = 0.5;mX = mY = x = y = ax = ay = r = f = 0;
}function draw() {oldR = r;if(mouseIsPressed) {mX = mouseX;mY = mouseY;if(!f) {f = 1;x = mX;y = mY;}ax += ( mX - x ) * spring;ay += ( mY - y ) * spring;ax *= friction;ay *= friction;r = 25 - sqrt( ax*ax + ay*ay ) * 0.7;for( i = 0; i < distance; ++i ) {oldX = x;oldY = y;x += ax / distance;y += ay / distance;oldR += ( r - oldR ) / distance;strokeWeight( oldR );line( x, y, oldX, oldY );}} else if(f) {ax = ay = f = 0;}
}
/**/

笔触6

原笔触代码地址:https://openprocessing.org/sketch/755877

特点:越慢越粗,有墨水晕染,线条有割裂,适合写毛笔字。
在这里插入图片描述

/*** Added on October 22, 2020* * Hi, I'm BUN.* I've been surprised at how many people have forked over this sketch, more than I expected. Thanks.* * Here is a sketch that explains this code with multiple codes.* Please use it as a reference.* https://www.openprocessing.org/sketch/793375* * Brief explanation.* This code primarily uses "Hook's Law".* In other words, it simulates the motion of a spring.* * From the mouse position, the position to be drawn is moved like a spring.* And the width of the line is changed according to the speed of the movement.* ** Added on May 8, 2021 *** Gorilla Sun has written an explanation of each part with animations on his blog. Thank you!* https://gorillasun.de/blog/Simulating-brush-strokes-with-Hooke's-Law-in-P5JS-and-Processing**/
function setup() {createCanvas(windowWidth,windowHeight);distance = 10;spring = 0.5;friction = 0.5;size = 25;diff = size/8;x = y = ax = ay = a = r = f = 0;
}function draw() {oldR = r;if(mouseIsPressed) {mX = mouseX;mY = mouseY;if(!f) {f = 1;x = mX;y = mY;}ax += ( mX - x ) * spring;ay += ( mY - y ) * spring;ax *= friction;ay *= friction;a += sqrt( ax*ax + ay*ay ) - a;a *= 0.6;r = size - a;for( i = 0; i < distance; ++i ) {oldX = x;oldY = y;x += ax / distance;y += ay / distance;oldR += ( r - oldR ) / distance;if(oldR < 1) oldR = 1;strokeWeight( oldR+diff );line( x, y, oldX, oldY );strokeWeight( oldR );line( x+diff*2, y+diff*2, oldX+diff*2, oldY+diff*2 );line( x-diff, y-diff, oldX-diff, oldY-diff );}} else if(f) {ax = ay = f = 0;}
}
/**/

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/675293.shtml

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

相关文章

ubuntu22.04安装部署03: 设置root密码

一、前言 ubuntu22.04 安装完成以后&#xff0c;默认root用户是没有设置密码的&#xff0c;需要手动设置。具体的设置过程如下文内容所示&#xff1a; 相关文件&#xff1a; 《ubuntu22.04装部署01&#xff1a;禁用内核更新》 《ubuntu22.04装部署02&#xff1a;禁用显卡更…

简单聊聊go语言中引用模块的版本控制以及invalid: should be v0 or v1, not v2问题的解决

文章目录 前言具体示例手动升级依赖库should be v0 or v1, not v2总结 前言 如果你接触go语言比较早&#xff0c;一定有过当年所有go源码全部放入 GOPATH 下的混乱经历&#xff0c;不过发展到今天&#xff0c;go的包管理使用 go.mod 和 go.work 已经能得心应手&#xff0c;满足…

macos安装local模式spark

文章目录 配置说明安装hadoop安装Spark测试安装成功 配置说明 Scala - 3.18 Spark - 3.5.0 Hadoop - 3.3.6 安装hadoop 从这里下载相应版本的hadoop下载后解压&#xff0c;配置系统环境变量 > sudo vim /etc/profile添加以下两行 export HADOOP_HOME/Users/collinsliu/…

Unity类银河恶魔城学习记录4-4 4-5 P57-58 On Hit Impactp- Attack‘direction fix源代码

Alex教程每一P的教程原代码加上我自己的理解初步理解写的注释&#xff0c;可供学习Alex教程的人参考 此代码仅为较上一P有所改变的代码 【Unity教程】从0编程制作类银河恶魔城游戏_哔哩哔哩_bilibili Entity.cs using System.Collections; using System.Collections.Generic;…

排序算法---快速排序

原创不易&#xff0c;转载请注明出处。欢迎点赞收藏~ 快速排序是一种常用的排序算法&#xff0c;采用分治的策略来进行排序。它的基本思想是选取一个元素作为基准&#xff08;通常是数组中的第一个元素&#xff09;&#xff0c;然后将数组分割成两部分&#xff0c;其中一部分的…

苹果mac电脑如何优化系统?保持不卡顿呢

再强悍的性能和优秀的操作系统&#xff0c;但长时间使用后&#xff0c;有时也会出现卡顿的情况。为了让你的苹果电脑保持高效运行&#xff0c;我们将深入探讨导致电脑卡顿的原因&#xff0c;并提供苹果电脑如何优化系统的解决方案&#xff0c;帮助你优化系统。 过多的启动项 …

【ChatGPT】如果说数据结构统治着整个计算机程序的世界,那么算法就可以被看作是程序员的全部装备。一般的来看的话,计算机本质就是信息的存储和处理的技术。

文章目录 第一章:算法和数据结构的概述第二章:数据结构数组链表栈队列树图第三章:算法排序算法搜索算法图算法第四章:算法和数据结构的应用数据库网络人工智能第五章:总结第

排序算法---归并排序

原创不易&#xff0c;转载请注明出处。欢迎点赞收藏~ 归并排序是一种常见的排序算法&#xff0c;它采用了分治的思想。它将一个待排序的数组递归地分成两个子数组&#xff0c;分别对两个子数组进行排序&#xff0c;然后将排好序的子数组合并成一个有序数组。 具体的归并排序过…

风行智能电视N39S、N40 强制刷机升级方法,附刷机升级数据MstarUpgrade.bin

升级步骤&#xff1a; 1、下载刷机数据&#xff0c;如是压缩包&#xff0c;需要先解压&#xff0c;然后将刷机bin格式的文件重命名为MstarUpgrade.bin 2、将此文件放到U盘根目录 &#xff08;U盘格式FAT32&#xff0c;单分区&#xff0c;建议4G的优盘刷机成功率高&#xff09;…

【java】Log4j漏洞本地复现,远程执行脚本

在log4j 2.14.0之前的版本存在此漏洞。 首先导入依赖 <dependency><groupId>org.apache.logging.log4j</groupId><artifactId>log4j-api</artifactId><version>2.14.0</version> </dependency> <dependency><groupI…

Spring第二天

一、第三方资源配置管理 说明&#xff1a;以管理DataSource连接池对象为例讲解第三方资源配置管理 1 管理DataSource连接池对象 问题导入 配置数据库连接参数时&#xff0c;注入驱动类名是用driverClassName还是driver&#xff1f; 1.1 管理Druid连接池【重点】 数据库准备…

【集合系列】TreeMap 集合

TreeMap 集合 1. 概述2. 方法3. 遍历方式4. 排序方式5. 代码示例16. 代码示例27. 代码示例38. 注意事项 其他集合类 父类 Map 集合类的遍历方式 TreeSet 集合 具体信息请查看 API 帮助文档 1. 概述 TreeMap 是 Java 中的一个集合类&#xff0c;它实现了 SortedMap 接口。它是…

C语言常见面试题:什么是变量?变量有哪些作用?

变量是编程中的一个基本概念&#xff0c;其定义和用法因编程语言和上下文而异。但通常来说&#xff0c;变量是用于存储数据的容器&#xff0c;这些数据可以是数字、文本、布尔值等。以下是变量的一些主要作用和特点&#xff1a; 存储数据&#xff1a;变量的主要作用是存储数据…

汇编的两道题

1.编写一个在显示器上显示一个笑脸字符的程序 看这段程序的结构&#xff0c;可以看出&#xff0c;每个代码段&#xff0c;带有segment的必须用ASSUME 来进行段分配。 PROG1 SEGMENT;PROG1段的开始ASSUME CS:PROG1;PROG1&#xff08;自己命名的&#xff0c;叫啥都可以&#xff…

Rust语言入门小结(第1篇)

Rust是一种新兴编程语言&#xff0c;既有高级语言的风格&#xff0c;又有底层语言级别的性能&#xff1b;是对于实时性、安全性要求高的应用开发的理想语言。 笔者的自学记录&#xff0c;供参考 环境搭建与第一个Rust程序 以Linux环境为例 # 下载并安装 curl --proto https -…

深入理解Netty及核心组件使用—上

目录 Netty的优势 为什么Netty使用NIO而不是AIO&#xff1f; Netty基本组件 Bootstrap、EventLoop(Group) 、Channel 事件和 ChannelHandler、ChannelPipeline ChannelFuture Netty入门程序 服务端代码 客户端代码 运行结果 Netty的优势 1. API 使用简单&#xff0c…

docker部署showdoc

目录 安装 1.拉取镜像 2.创建容器 使用 1.选择语言 2.默认账户/密码:showdoc/123456​编辑 3.登陆 4.首页 安装 1.拉取镜像 docker pull star7th/showdoc 2.创建容器 mkdir -p /opt/showdoc/html docker run -d --name showdoc --userroot --privilegedtrue -p 1005…

RocketMQ事务消息

事务消息 应用场景&#xff1a; ​ 事务消息是RocketMQ非常有特色的一个高级功能。他的基础诉求是通过RocketMQ的事务机制&#xff0c;来保证上下游的数据一致性。 ​ 以电商为例&#xff0c;用户支付订单这一核心操作的同时会涉及到下游物流发货、积分变更、购…

黄金交易策略:手工同向单减保留仓

虽然保留仓的仓位不大&#xff0c;扛个一年半载不是问题&#xff0c;但闲着也可以手工处理掉&#xff08;10000点以内的不要处理&#xff09;。挑一个最大的单&#xff0c;同向相同的手数&#xff0c;并把两单的止盈设置中位数&#xff08;也没有这么严格&#xff0c;差不多就好…

[嵌入式AI从0开始到入土]5_炼丹炉的搭建(基于wsl2_Ubuntu22.04)

[嵌入式AI从0开始到入土]嵌入式AI系列教程 注&#xff1a;等我摸完鱼再把链接补上 可以关注我的B站号工具人呵呵的个人空间&#xff0c;后期会考虑出视频教程&#xff0c;务必催更&#xff0c;以防我变身鸽王。 第一章 昇腾Altas 200 DK上手 第二章 下载昇腾案例并运行 第三章…