A. Myš + kreslenie

Toto cvičenie robte, iba ak ste už prešli za lekciu 09 - Systémové premenné.

Úloha 1

Vytvorte skeč, ktorý bude kresliť obdĺžnik, ktorý začína v ľavom hornom rohu obrazovky a končí na pozícii myši:

Riešenie

void setup()
{
  size(400,400);  
}

void draw()
{
  background(0);
  rect(0,0,mouseX,mouseY);
}

Úloha 2

Upravte predošlý skeč tak, aby sa obdĺžnik nevykresľoval od ľavého horného rohu ale od stredu obrazovky:

Riešenie

void setup()
{
  size(400,400);  
}

void draw()
{
  background(0);
  float pol_sirky = mouseX-width/2;
  float pol_vysky = mouseY-height/2;
  rect(width/2 - pol_sirky, height/2 - pol_vysky, 2*pol_sirky, 2*pol_vysky);
}

Úloha 3

Vytvorte nový skeč, ktorý kreslí krúžky na pozíciu myši. Ale pre každý krúžok na pozícii myši, vykreslí ešte jeden, ktorý je jeho zrkadlový odraz. Potrebujete teda pre súradnice mouseX, mouseY vyjadriť súradnice, ktoré ležia na opačnej polovici obrazovky.

Nakreslite si to. Poznáte šírku obrazovky, poznáte pozíciu mouseX, potrebujete vyjadriť pozíciu, ktorá je zrkadlovo na opačnej strane obrazovky.

Riešenie

void setup()
{
  size(400,400);
  background(0);  
}

void draw()
{
  circle(mouseX, mouseY, 10);
  circle(width - mouseX, mouseY, 10);  
}e

Úloha 4

Upravte predošlý skeč, aby sa druhý krúžok nekreslil zrkadlovo, ale aby bol stredovo súmerný. Čiže nie je prevrátený len v jednej súradnici, ale v obidvoch:

Riešenie

void setup()
{
  size(400,400);
  background(0);  
}

void draw()
{
  circle(mouseX, mouseY, 10);
  circle(width - mouseX, height - mouseY, 10);  
}

Úloha 5

Vytvorte skeč, ktorý nakreslí "zameriavač". Horizontálnu a vertikálnu čiaru, ktorá prechádza kurzorom myši a krúžok so stredom v kurzore myši:

Riešenie

void setup()
{
  size(400,400);
  stroke(#7FFF5D);
  noFill();
}

void draw()
{
  background(0);  

  line(0, mouseY, width, mouseY);
  line(mouseX, 0, mouseX, height);
  circle(mouseX, mouseY, 100);
}

Úloha 6

Vytvorte skeč, ktorý nakreslí 4 rôznofarebné obdĺžniky (napríklad červený, zelený, žltý, modrý) tak, že každý leží v jednom rohu obrazovky a stretávajú sa v kurzore myši:

Ospravedlňujeme sa za zníženú kvalitu GIFu. Na poruche pracujeme.

Pomôže vám rozkresliť si to. Poznáte širku aj výšku okna (v premenných width aheight), poznáte aj pozíciu myši (v premenných mouseX a mouseY). Potrebujete pre každý jeden obdĺžnik vyjadriť jeho ľavý horný roh a jeho šírku a výšku.

Riešenie

void setup()
{
  size(400,400);
  noStroke();
}

void draw()
{
  background(0);  
  
  // Lavy horny
  fill(255, 0, 0);
  rect(0, 0, mouseX, mouseY);
  
  // Pravy horny
  fill(255, 255, 0);
  rect(mouseX, 0, width-mouseX, mouseY);
  
  // Lavy dolny
  fill(0, 255, 0);
  rect(0, mouseY, mouseX, height-mouseY);
  
  // Pravy dolny
  fill(0, 0, 255);
  rect(mouseX, mouseY, width-mouseX, height-mouseY);
  
}

Úloha 7

Využite predošlý skeč na to, aby ste dokázali vykresliť obdĺžnik, ktorý začína na pozícii myši a stred má v strede obrazovky. Z Úlohy 4 viete, ako vyzerajú súradnice jeho začiatku a súradnice jeho konca, pretože tiež je stredovo súmerný.

Pre príkaz rect však potrebujete z týchto súradníc vyjadriť šírku a výšku.

Riešenie

void setup()
{
  size(400,400);  
}

void draw()
{
  background(0);  
  rect(mouseX, mouseY, width - 2*mouseX, height - 2*mouseY);  
}