Rysowanie – Linie

Nauczymy się rysować z pozoru banalne linie

Czas trwania – 45min
Poziom trudności – Średni (klasa 6)

Wstęp

W tej lekcji nauczymy się rysować linie! To z pozoru łatwe zagadnienie można wykorzystać we wielu ciekawych wizualnie projektach. Działamy!

Przygotowanie

Co wcześniej trzeba przygotować:

Przeglądarkę Google Chrome z rozszerzeniem LOFI Robot EXTENSION
(http://www.lofirobot.com/edubox/konfiguracja/)

Przebieg

Rysowanie prostej linii

Nasz program zaczniemy od zupełnych podstaw, mianowicie, narysujemy zwykłą prostą linię. Wstaw blok Linia z zakładki RYSOWANIE!

1_prosta_linia

Jak widzisz domyślnie ustawione była linia będąca przekątną naszej planszy do rysowania. W bloku opisane zostały dwie pozycje (X1, Y1) oraz (X2, Y2). Są to współrzędne początku oraz końca linii. Początkiem w tym przypadku jest punkt (0, 0), a końcem punkt (100, 100). Jak myślisz, jakie współrzędne trzeba wpisać, by linia poziomo przechodziła przez środek?

2_linia_pozioma

Z jednej strony zwiększyłem współrzędną Y, a z drugiej ją podwyższyłem. Efekt widać na obrazku! Całkiem proste, prawda? Takie rysowanie linii przy pomocy wpisywania współrzędnych nie jest zbyt ekscytujące. Czas na wprowadzenie ulepszeń!
Na początku jedna współrzędną zostawimy ustawioną na stałe (50, 50), a drugą uzależnimy od myszy! Wstaw bloki Mysz X i Mysz Y w miejsce drugiej współrzędnej linii. Bloki te znajdziesz w zakładce ZDARZENIA.

3_linia_mysz_x_y

Wykorzystanie myszki

W ten sposób otrzymaliśmy podobny efekt jak przy budowie sonaru. Co powiesz na tworzenie linii tylko na podstawie ruchów myszy? Na przykład, jednym naciśnięciem podawalibyśmy współrzędne początkowe, a drugim końcowe. W ten sposób moglibyśmy stworzyć na przykład węża. W tym celu będziemy potrzebowali dwóch zmiennych do przechowywania poprzednich współrzędnych. Na pewno wiesz jak się dodaje zmienne, w końcu ciągle ich używamy (pssst… jak nie wiesz, to przejdź do zakładki ZMIENNE i naciśnij przycisk Dodaj zmienną…)!

Moje zmienne nazwałem po prostu X i Y. Za każdym razem gdy nacisnę przycisk myszy to program narysuje linie zaczynającą się w punkcie X i Y, a kończącą tam gdzie obecnie znajduje się mysz. Następnie zmienne X i Y zostaną zastąpione położeniem kursora myszki. Zobacz jak to wygląda w zapisie blokowym!

4_rysowanie_weza

Jeśli nadpisywanie zmiennych wyrzucisz z bloku warunkowego Jeżeli, to uzyskasz najzwyklejsze rysowanie linii po przyciśnięciu myszy. Możemy to przetestować:

5_zwykle_rysowanie

Możemy jeszcze dodać zmianę grubości, koloru i przezroczystości naszej linii. Zmiany te wprowadzisz przy pomocy bloku Kontur . Wygląda to świetnie gdy kolor będzie zależny od zmiennych X, Y oraz bloku Mysz X i Mysz Y.

Teraz już potrafisz wykorzystywać potencjał zwykłych linii! Mam nadzieje, że dostarczą ci zabawy na wiele godzin. Może wpadł ci do głowy jakiś pomysł na ulepszenie tego programu? Napisz do nas!

ZOBACZ GOTOWY PROJEKT

O autorze scenariusza:

LOFI Robot

Ten artykuł napisały dla Ciebie roboty znad morza. Najprawdopodobniej miały na imię Maciek i Tomek.