Hur ritar man en medelkatt med hjälp av programmeringsmiljön för bearbetning?

Öppna en ny fil. För att börja, öppna bearbetningsprogrammet. En "skiss" eller en ny fil kommer automatiskt att vara öppen och redo för skrivning. Den kommer ursprungligen att märkas "sketch_xxxxxa", med aktuell månad och dag i x-positionerna i filnamnet. Du kan byta namn på filen till vad du än väljer genom att välja Arkiv → Spara som... och skriva ett nytt namn i det resulterande fönstret.

Definiera fönsterattribut. För att börja måste vi ange hur stort vi vill att kattbildsfönstret ska vara. För att göra detta skriver vi följande kod:

• storlek (200, 200);
• Detta är fönsterstorleksfunktionen, och vi skickar två nummer som representerar hur många pixlar höga och breda vi vill att programmet ska rita fönstret. Här ber vi programmet att rita fönstret 200 pixlar högt och 200 pixlar brett.

Efter att ha angett fönsterstorleken kan vi ange andra fönsterattribut, såsom total bildkvalitet och bakgrundsfärg. Nedan följer två funktioner som vi skriver för att göra detta:

• slät();
• bakgrund (0);
• Den smidiga funktionen säkerställer att alla geometriska former ritade i det här fönstret visas med utjämningsbara kanter. Detta ger en högre bildkvalitet.
• Bakgrundsfunktionen tar ett talargument, här noll, som representerar en färg. Eftersom noll är färgen för svart kommer fönstrets bakgrund nu att returneras som svart.

Definiera färger som du ska använda för katten. Det är god programmeringspraxis att använda variabler för att lagra data som kommer att användas upprepade gånger i ett program. I vårt fall vet vi att det finns några färger vi kanske vill använda mer än en gång i vår ritning. Vi vill också göra programmeringen lättare att läsa. Det är därför vi definierar RGB-färgerna innan vi använder dem. Här är färgerna du behöver för att rita din genomsnittliga katt:

• färgkattkropp = färg (226);
• färgörsnos = färg (237, 159, 176);
• färg svart = färg (0, 0, 0);
• färg ansiktsbehandling = färg (202, 200, 193);
• färg fang = färg (249, 16, 85);

Här kan färgdatatypen definieras som valfritt namn och sedan tilldelas en RGB- eller gråskalafärgsuppsättning eller -nummer. Färgen "kattkropp" ovan har tilldelats färg 226, som är mellangrå. De andra färgerna använder RGB-skalan för att definiera mer specifika nyanser. För mer information om RGB, gråskala och annan färgrelaterad information, se Processings färghandledning på http://processing.org/tutorials/color/.

Rita öronen med fyra trianglar. Nu när vi vet vilka färger vi ska använda börjar vi rita katten. Ordningen i vilken vi ritar dess funktioner är viktig för den slutliga visningen, eftersom programmet ritar varje form i den ordning det heter. Låt oss börja med öronen:

Först väljer vi den färg vi vill att huvuddelen av öronen ska fyllas med.

• fyll kattens kropp.

Sedan anger vi x- och y-koordinaterna för punkterna i trianglarna som bildar öronformerna:

• triangel (50, 50, 50, 90, 90, 60);
• triangel (150, 50, 150, 90, 110, 60);

Därefter väljer vi en annan färg för att fylla insidan av öronen med:

• fyll (öron);

Och slutligen anger vi x- och y-koordinaterna för de punkter som bildar trianglarna för innerörat:

• triangel (55, 55, 55, 95, 95, 65);
• triangel (145, 55, 145, 95, 105, 65);

Eftersom triangelfunktionen tar tre uppsättningar x- och y-koordinater för fönstret där vi ritar katten, skriver vi dessa siffror i den ordning vi vill att triangelns punkter ska dras. Fyllningsfunktionen tar en färg som ett argument och returnerar den färgen inuti trianglarna som följer samtalet. Vi har nu öron!

Rita huvudet i mitten av fönstret. För att rita huvudet, skriv följande:

• fyll (kattkropp);
• noStroke ();
• ellips (100, 100, 100, 100);

Här använder vi en annan fyllningsfärg för cirkeln som vi ritar för att skapa kattens huvud. De noStroke funktions anger att vi inte vill ha en kontur runt formen efter det. I det här fallet är den formen naturligtvis kattens huvud, som ritas med ellipsfunktionen. Ellipsfunktionen accepterar fyra siffror: en x- och y-koordinat för placering av cirkeln och pixelbredden och höjden på ellipsen vid den positionen.

Nästa steg i vår ritning är att göra de genomsnittliga kattens huggtänder. Följande kod gör detta för oss:

• fylla (fang);
• triangel (85, 130, 95, 130, 90, 146);
• triangel (95, 120, 105, 120, 100, 146);
• triangel (105, 130, 115, 130, 110, 146);

I huvudsak drar vi tre långa, magera trianglar för att skjuta nedåt från munområdet. Vi anger våra huggtanders fyllningsfärg och skapar sedan trianglarna med hjälp av triangelfunktionerna igen.

Eftersom vi vill att huggtänderna ska täckas delvis av kattens näsa, drar vi näsområdet efter att vi har ritat huggtänderna. Koden för detta är som följer:

• // dra munkorg
• fyllning (ansiktsbehandling)
• ellips (115, 120, 30, 30);
• ellips (85, 120, 30, 30);

Här väljer vi en fyllningsfärg och ritar två matchande ellipser över huggtänderna vid de angivna koordinaterna.

• // dra näsa
• fyll (öron);
• stroke (1);
• triangel (100, 100, 90, 115, 110, 115);

Här väljer vi en fyllningsfärg för näsan och ritar en liten triangel i mitten av kattens ansikte. Den stroke Funktionen ger tillbaka den beskriver funktion som vi tidigare avstängd, passerar nummer 1 till den för att beteckna önskas för näsan kontur färg gråskala nivå.

Därefter placerar vi ögonen. Detta görs genom att rita grå cirklar som innehåller mindre svarta cirklar i dem. Koden för detta är som följer:

• För de större, grå cirklarna:
  • fyllning (ansiktsbehandling)
  • ellips (80, 90, 20, 20);
  • ellips (120, 90, 20, 20);
• För de mindre svarta cirklarna:
  • fyll (svart);
  • ellips (80, 95, 10, 10);
  • ellips (120, 95, 10, 10);
• Kom ihåg att strokefunktionen fortfarande är "på", därför kommer ögonen att skisseras. Detta ger kontrast och ser bra ut.

För att rita de genomsnittliga ögonbrynen skriver vi följande kod:

• strokeWeight (12);
• linje (90, 80, 70, 65);
• linje (110, 80, 130, 65);

Eftersom vi vill att ögonbrynen ska vara tjocka och hotfulla, vill vi använda en linjefunktion och vi vill att linjen som dras ska vara väldigt tjock. För att göra detta kallar vi funktionen strokeWeight och passerar antalet pixlar brett som vi vill att linjen ska dras. Sedan kallar vi helt enkelt två linjefunktioner, som accepterar två uppsättningar x / y-koordinater, som drar linjer mellan dessa punkter i fönstret.

Den sista delen av katten att rita är hans morrhår. För att rita morrhår använder vi igen linjefunktionen. Morrhårens kod är följande:

• strokeWeight (1);
• linje (115, 115, 135, 105);
• linje (117, 119, 135, 120);
• linje (115, 123, 135, 130);
• linje (85, 115, 65, 105);
• linje (83, 119, 65, 120);
• linje (85, 123, 65, 130);

Lägg märke till att vi måste ändra slagvikten så att linjerna inte dras 12 pixlar brett, eftersom de ritades för ögonbrynen! En pixel är tillräckligt bred för en känslig morrhår.

Nu när vi har slutfört kattritningen är det dags att sammanställa programmet och köra det. Spara först filen. För att sedan köra programmet och se det resulterande fönstret vi har ritat, tryck på "spela" -knappen högst upp i fönstret eller tryck på Ctrl + R. Katten kommer att visas i sitt eget 200 x 200-fönster.

När du skapar dina egna ritningar är det bra att regelbundet kontrollera hur ritningen fortskrider genom att spara och köra programmet under hela programmeringsprocessen.