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

函数deviceMoved()在设备中工作，当设备沿X、Y或Z三个轴移动超过阈值时调用。

它仅适用于手机等设备，它有助于检测设备何时移动或旋转超过阈值。

它可以用作移动设备中的传感器，例如检测运动、加速度、旋转、航向和位置。

默认阈值设置为 0.5，可以使用 setMoveThreshold() 函数更改。

用法:

deviceMoved()

现在我们将在安卓手机上运行一些例子。

第一步：在手机中使用任意浏览器打开p5.js的在线网页编辑器“https://editor.p5js.org/”

步骤2：在编辑器部分编写以下代码并运行它以查看输出。

范例1：

Javascript


// Set value to zero
let value = 0;
  
// Set the draw function
function draw() {
  
    // When the device is moved
    // in the all direction then
    // the colour fill filled
    fill(value);
  
    // Set the shape of thr Graphics
    triangle(45, 100, 54, 5, 100, 100);
}
  
// Apply the deviceMoved function
function deviceMoved() {
  
    // Increment the value everytime by 10
    value = value + 10;
  
    // If the value become grater than 255
    // then reset the value to zero.
    if (value > 255) {
        value = 0;
    }
}

输出：

范例2：

Javascript


// Set the variable as 0
var value = 0;
  
// Set the function
function setup() {
    createCanvas(windowWidth, windowHeight);
  
    // Set the background as value which
    // will be dynamic
    background(value);
}
  
// Set the draw function
function draw() {
  
    // Set the properties of text
    background(value);
    fill(0, 0, 255);
    textAlign(CENTER, CENTER);
    textSize(25);
  
    // Set the limit for value
    value = constrain(value - 2, 0, 200)
  
    // If the value is greater than 10
    if (value > 10) {
        text("Moving Device", width / 2, height / 2);
    } else {
        text("Device is Relaxed ", width / 2, height / 2);
    }
}
  
function deviceMoved() {
  
    // Now increase the value.
    value = constrain(value + 5, 0, 255)
}

输出：

相关用法

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