p5.js Touch touchMoved()用法及代码示例

注册触摸移动后，将调用p5.js中的touchMoved()函数。如果未定义touchMoved()函数，则将调用mouseDragged()函数(如果已定义)。

用法:

touchMoved([Event])

以下示例程序旨在说明p5.js中的touchMoved()函数：
示例1：

let valueX; 
let valueY; 
  
function setup() { 
    
    // Create Canvas of size 500*500 
    createCanvas(500, 500); 
} 
  
function draw() { 
    
    // set background color 
    background(200); 
    
    fill('green'); 
    // set text and text size 
    textSize(25); 
    
    text('Hold and Move to change color', 30, 30); 
    // fill color according to touchStarted()  
    fill(valueX, 255 - valueY, 255 - valueX); 
    
    // draw ellipse   
    ellipse(mouseX, mouseY, 115, 115); 
  
} 
  
function touchMoved() { 
    valueX = mouseX % 255; 
    valueY = mouseY % 255; 
}

输出：

示例2：

let valueX; 
let valueY; 
  
function setup() { 
    
    // Create Canvas of size 500*500 
    createCanvas(500, 500); 
} 
  
function draw() { 
    // set background color 
    background(200); 
    
    fill('green'); 
    // set text and text size 
    textSize(25); 
    
    text('Touch and Move to change color', 30, 30); 
    // fill color according to mouseMoved()  
    fill(valueX, 255 - valueY, 255 - valueX); 
    
    // draw rectangle  
    rect(mouseX, mouseY, 115, 115); 
    fill(valueY, 255 - valueX, 255 - valueX); 
  
    rect(mouseX, mouseY + 115, 115, 115); 
    fill(255 - valueY, 255 - valueX, 255 - valueY); 
  
    rect(mouseX - 115, mouseY, 115, 115); 
    fill(255 - valueY, 255 - valueY, 255 - valueY); 
  
    rect(mouseX - 115, mouseY + 115, 115, 115); 
} 
  
function touchMoved() { 
    valueX = mouseX % 255; 
    valueY = mouseY % 255; 
}

输出：

参考： https://p5js.org/reference/#/p5/touchMoved

相关用法

注：本文由纯净天空筛选整理自sarthak_ishu11大神的英文原创作品 p5.js Touch | touchMoved()。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。