Υποενότητα 8.3: Χρώματα
Συναρτήσεις χρωματισμού - Color functions
Για να εφαρμόσουμε χρώμα στα στοιχεία p5.js χρησιμοποιούμε τη fill () function.
Μπορούμε να γράψουμε χρώματα σε οποιοδήποτε RGB, RGBA, Hex και υποστηριζόμενες συμβολοσειρές χρώματος.
Για να ορίσουμε το χρώμα του περιγράμματος των στοιχείων p5.js χρησιμοποιούμε τη stroke() function.
Μπορούμε να αυξήσουμε ή να μειώσουμε το βάρος των περιγραμμάτων χρησιμοποιώντας τη strokeWeight() function.
Εάν δεν θέλουμε να γεμιστούν τα στοιχεία μας, χρησιμοποιούμε noFill()function, ενώ αν δεν θέλουμε να έχουν περιγράμματα χρησιμοποιούμε noStroke()
Παράδειγμα
Ακολουθεί ένα παράδειγμα όπου χρησιμοποιούνται όλες οι παραπάνω λειτουργίες:
function setup() {
// create canvas
createCanvas(800,500);
}
function draw () {
// set background color
background('#B1CBBB');
//use the fill function to color the triangle
fill('#EEA29A');
// use the noStroke function to remove border
noStroke();
triangle(width/2,height/2,500,400,300,400);
// use the noFill function to remove the fill of our element
noFill();
// use the stroke to change the color of the border
stroke('#D64161');
// use the strokeWeight to change the border weight
strokeWeight(5);
triangle(width/2,height/2,500,100,300,100);
}
- Δείτε περισσότερα για τη fill() function
- Δείτε περισσότερα για τη noFill() function
- Δείτε περισσότερα για τη stroke() function
- Δείτε περισσότερα για τη noStroke() function
- Δείτε περισσότερα για τη strokeWeight() function