كمال غابتي · دورة · مجاني

الإيماءات والتفاعل الإيمائي

التعرف على الإيماءات والاستجابة لها (انزلاق، قرصة، دوران) في JavaScript.

المفهوم

الإيماءات تسلسلات لمسات تُفسَّر كنوايا. الأكثر شيوعاً: الانزلاق، القرصة، الدوران، الضغط المطول. لكل إيماءة عتبة تعرف وفعل مُشغَّل.

الكود

// Gesture: swipe direction detection
let startX, startY, lastGesture = 'waiting...';
function setup() { createCanvas(400, 280); }
function draw() {
  background(11, 15, 20);
  fill(55,227,195); textAlign(CENTER); textSize(18);
  text(lastGesture, width/2, height/2);
  textSize(12); fill(255,255,255,80);
  text('Cliquez et glissez pour détecter le geste', width/2, height/2+40);
}
function mousePressed() { startX=mouseX; startY=mouseY; }
function mouseReleased() {
  let dx=mouseX-startX, dy=mouseY-startY;
  let dist = sqrt(dx*dx+dy*dy);
  if (dist < 20) { lastGesture='tap'; return; }
  if (abs(dx) > abs(dy)) lastGesture = dx>0 ? '→ swipe right' : '← swipe left';
  else lastGesture = dy>0 ? '↓ swipe down' : '↑ swipe up';
}

للمزيد

استكشف الدورات المجانية الأخرى على صفحة الورش.

تدرب، تعاون، انشر — في 15 دقيقة.

← احجز مكالمة