p5.js deviceMoved() Function
Last Updated :
16 Jan, 2023
The function deviceMoved() works in the device, and it is called when the device is moved by more than the threshold value along all the three X, Y or Z axis.
It only works in the device like mobile phones and it helps in detecting when the device is moved or rotated by more than a threshold value.
It can be used as a sensor in mobile devices like detecting motion, acceleration, rotation, heading, and location..
The default threshold is set to 0.5 and it can be changed using setMoveThreshold() function.
Syntax:
deviceMoved()
Now we will run some examples in android phones.
Step 1: Open online web editor of p5.js in the mobile phone using any browser “https://editor.p5js.org/”
Step 2: Write the following code in the editor section and run it to see the output.
Example 1:
Javascript
let value = 0;
function draw() {
fill(value);
triangle(45, 100, 54, 5, 100, 100);
}
function deviceMoved() {
value = value + 10;
if (value > 255) {
value = 0;
}
}
|
Output:
Example 2:
Javascript
var value = 0;
function setup() {
createCanvas(windowWidth, windowHeight);
background(value);
}
function draw() {
background(value);
fill(0, 0, 255);
textAlign(CENTER, CENTER);
textSize(25);
value = constrain(value - 2, 0, 200)
if (value > 10) {
text( "Moving Device" , width / 2, height / 2);
} else {
text( "Device is Relaxed " , width / 2, height / 2);
}
}
function deviceMoved() {
value = constrain(value + 5, 0, 255)
}
|
Output:
Share your thoughts in the comments
Please Login to comment...