Πώς να δημιουργήσετε Amazing Webcam Effects χρησιμοποιώντας Java και Επεξεργασία
Διαφήμιση
Η επεξεργασία είναι ένα ισχυρό εργαλείο που επιτρέπει τη δημιουργία της τέχνης μέσω κώδικα. Είναι ο συνδυασμός μιας βιβλιοθήκης Java για εργασία με γραφικά και ενός ολοκληρωμένου περιβάλλοντος ανάπτυξης (IDE) που σας επιτρέπει να γράφετε και να εκτελείτε εύκολα κώδικα.
Υπάρχουν πολλά προγράμματα γραφικών και animation για αρχάριους που χρησιμοποιούν την Επεξεργασία, αλλά είναι επίσης σε θέση να χειραγωγήσουν ζωντανό βίντεο.
Σήμερα θα πραγματοποιήσετε ζωντανή προβολή διαφανειών βίντεο με διαφορετικά εφέ που ελέγχονται από το ποντίκι, χρησιμοποιώντας τη βιβλιοθήκη επεξεργασίας βίντεο. Εκτός από την αναστροφή του ζωντανού βίντεο, θα μάθετε να αλλάζετε το μέγεθος και το χρώμα, και πώς να το ακολουθήσετε με τον κέρσορα του ποντικιού.
Ρύθμιση έργου
Για να ξεκινήσετε, κατεβάστε την Επεξεργασία και ανοίξτε ένα κενό σκίτσο. Αυτό το σεμινάριο βασίζεται σε ένα σύστημα Windows, αλλά θα πρέπει να λειτουργεί σε οποιονδήποτε υπολογιστή με μια κάμερα web.
Ενδέχεται να χρειαστεί να εγκαταστήσετε τη βιβλιοθήκη Βίντεο επεξεργασίας, η οποία είναι προσβάσιμη από το στοιχείο Σκίτσο> Εισαγωγή βιβλιοθήκης> Προσθήκη βιβλιοθήκης . Αναζητήστε το βίντεο στο πλαίσιο αναζήτησης και εγκαταστήστε τη βιβλιοθήκη από το The Processing Foundation .
Μόλις εγκατασταθεί, είστε έτοιμοι να πάτε. Αν θέλετε να παραλείψετε την κωδικοποίηση, μπορείτε να κάνετε λήψη του πλήρους σχεδίου. Είναι πολύ καλύτερο να το κάνετε μόνοι σας από το μηδέν!
Χρησιμοποιώντας μια κάμερα Web με επεξεργασία
Ας ξεκινήσουμε εισάγοντας τη βιβλιοθήκη και δημιουργώντας μια λειτουργία ρύθμισης . Καταχωρίστε τα παρακάτω στο κενό σκίτσο επεξεργασίας:
import processing.video.*; Capture cam; void setup(){ size(640, 480); cam = new Capture(this, 640, 480); cam.start(); } Μετά την εισαγωγή της βιβλιοθήκης βίντεο, δημιουργείτε ένα στιγμιότυπο καταγραφής που ονομάζεται έκκεντρο για να αποθηκεύσετε τα δεδομένα από την κάμερα web. Στη ρύθμιση, η λειτουργία μεγέθους ρυθμίζει ένα παράθυρο μεγέθους 640 × 480 pixel για να εργαστείτε.
Η επόμενη γραμμή αναθέτει έκκεντρο σε μια νέα εμφάνιση του Capture, για αυτό το σκίτσο, το οποίο έχει το ίδιο μέγεθος με το παράθυρο, προτού ζητήσει από την κάμερα να ενεργοποιηθεί με cam.start () .
Μην ανησυχείτε αν δεν καταλαβαίνετε κάθε μέρος αυτού για τώρα. Εν ολίγοις, έχουμε πει στην Επεξεργασία να βγάλει ένα παράθυρο, να βρει την κάμερά μας και να την ενεργοποιήσει! Για να το εμφανίσουμε χρειαζόμαστε μια λειτουργία κλήρωσης . Πληκτρολογήστε αυτό κάτω από τον παραπάνω κώδικα, έξω από τις σγουρές αγκύλες.
void draw(){ if (cam.available()){ cam.read(); } image(cam, 0, 0); } Η συνάρτηση κλήσης αποκαλείται κάθε πλαίσιο. Αυτό σημαίνει ότι πολλές φορές κάθε δευτερόλεπτο, εάν η φωτογραφική μηχανή διαθέτει δεδομένα, διαβάζετε τα δεδομένα από αυτήν.
Αυτά τα δεδομένα εμφανίζονται στη συνέχεια ως εικόνα, στη θέση 0, 0, η οποία βρίσκεται στην πάνω αριστερή πλευρά του παραθύρου.
Αποθηκεύστε το σκίτσο και πατήστε το κουμπί αναπαραγωγής στο επάνω μέρος της οθόνης.
Επιτυχία! Τα δεδομένα που αποθηκεύονται από το έκκεντρο εκτυπώνονται σωστά στην οθόνη κάθε καρέ. Εάν αντιμετωπίζετε προβλήματα, ελέγξτε προσεκτικά τον κωδικό σας. Η Java χρειάζεται κάθε βραχίονα και ημικυκλάδιο στο σωστό μέρος! Η επεξεργασία μπορεί επίσης να απαιτήσει μερικά δευτερόλεπτα για να αποκτήσετε πρόσβαση στην κάμερα web, οπότε αν νομίζετε ότι δεν λειτουργεί, περιμένετε λίγα δευτερόλεπτα μετά την εκκίνηση του σεναρίου.
Αναστροφή της εικόνας
Τώρα που έχετε μια ζωντανή εικόνα webcam ας το χειριστούμε. Στη λειτουργία κλήρωσης, αντικαταστήστε την εικόνα (έκκεντρο, 0, 0). με αυτές τις δύο γραμμές κώδικα.
scale(-1, 1); image(cam, -width, 0); Αποθηκεύστε και επαναλάβετε το σκίτσο. Μπορείτε να δείτε τη διαφορά; Χρησιμοποιώντας μια τιμή αρνητικής κλίμακας, όλες οι τιμές x (τα οριζόντια εικονοστοιχεία) αντιστρέφονται τώρα. Εξαιτίας αυτού, πρέπει να χρησιμοποιήσουμε την αρνητική τιμή του πλάτους παραθύρου για να τοποθετήσουμε σωστά την εικόνα.
Η αναστροφή της εικόνας ανάποδα απαιτεί μόνο μερικές μικρές αλλαγές.
scale(-1, -1); image(cam, -width, -height); 
Αυτή τη φορά, οι τιμές x και y ανακινούνται, μετατρέποντας την εικόνα ζωντανής κάμερας ανάποδα. Μέχρι στιγμής έχετε κωδικοποιήσει μια κανονική εικόνα, μια οριζόντια αναδιπλωμένη εικόνα και μια κατακόρυφη εικόνα. Ας δημιουργήσουμε έναν τρόπο να κυκλώσουμε μεταξύ τους.
Κάνοντας τον Κύκλο
Αντί να ξαναγράφετε τον κωδικό σας κάθε φορά, μπορούμε να χρησιμοποιήσουμε τους αριθμούς για να τις περνάμε. Δημιουργήστε έναν νέο ακέραιο αριθμό στην κορυφή του κωδικού σας που ονομάζεται switcher .
import processing.video.*; int switcher = 0; Capture cam; Μπορούμε να χρησιμοποιήσουμε την τιμή του switcher για να καθορίσουμε τι συμβαίνει με την εικόνα της κάμερας. Όταν ξεκινά το σκίτσο, του δίνετε τιμή 0 . Τώρα μπορούμε να χρησιμοποιήσουμε τη λογική για να αλλάξουμε τι συμβαίνει με την εικόνα. Ενημερώστε τη μέθοδο ισοτίμου σας για να μοιάζετε με αυτό:
void draw(){ if (cam.available()){ cam.read(); } if(switcher==0){ image(cam, 0, 0); } else if(switcher == 1){ scale(-1, 1); image(cam, -width, 0); } else if(switcher == 2){ scale(-1, -1); image(cam, -width, -height); } else{ println("Switcher = 0 again"); switcher = 0; } } Τώρα, και οι τρεις παραλλαγές του κώδικα θα ενεργοποιηθούν ανάλογα με την τιμή του switcher. Εάν δεν ταιριάζει με μία από τις δηλώσεις μας if ή else else, η ρήτρα else γίνεται επαναφορά στο 0. Η λογική είναι μια σημαντική ικανότητα για μάθηση για αρχάριους και μπορείτε να μάθετε για αυτούς και πολλά άλλα με ένα εξαιρετικό YouTube Tutorial Tutorial The 17 καλύτερα εκπαιδευτικά προγράμματα προγραμματισμού YouTube Τα 17 καλύτερα εκπαιδευτικά προγράμματα προγραμματισμού YouTube Σε αυτήν την ανάρτηση, θα θέλαμε να σας δείξουμε μερικές από τις καλύτερες σειρές προγραμματισμού του YouTube που έχουμε βρει. Όλα αυτά είναι επαρκή για να πάρει τα πόδια σας υγρό ως προγραμματιστής newbie. Διαβάστε περισσότερα !
Χρησιμοποιώντας το ποντίκι
Η επεξεργασία έχει ενσωματωμένες μεθόδους πρόσβασης στο ποντίκι. Για να ανιχνεύσετε πότε ο χρήστης κάνει κλικ στο ποντίκι, προσθέστε τη λειτουργία ποντικιούΠροτεινόμενη στο κάτω μέρος της δέσμης ενεργειών.
void mousePressed(){ switcher++; } Η επεξεργασία ακούει για οποιοδήποτε κλικ του ποντικιού και διακόπτει το πρόγραμμα για να πραγματοποιήσει αυτή τη μέθοδο όταν εντοπίσει ένα. Κάθε φορά που ονομάζεται η μέθοδος, η τιμή του switcher αυξάνεται κατά ένα. Αποθηκεύστε και εκτελέστε το σενάριο σας.
Τώρα, όταν πιέζετε το κουμπί του ποντικιού, περιστρέφεται μέσω των διαφορετικών προσανατολισμών των βίντεο, πριν επιστρέψετε στο πρωτότυπο. Μέχρι στιγμής έχετε μόλις γυρίσει το βίντεο, τώρα ας κάνουμε κάτι λίγο πιο ενδιαφέρον.
Προσθήκη περισσότερων εφέ
Τώρα, θα κωδικοποιήσετε μια τετραχρωμία ζωντανή εικόνα παρόμοια με τα περίφημα έργα τέχνης του Andy Warhol. Η προσθήκη περισσότερων εφέ είναι τόσο απλή όσο η προσθήκη μιας άλλης ρήτρας στη λογική. Προσθέστε αυτό στη δέσμη ενεργειών σας μεταξύ της τελευταίας εντολής else if, και αλλιώς .
else if(switcher == 3){ tint(256, 0, 0); image(cam, 0, 0, width/2, height/2); tint(0, 256, 0); image(cam, width/2, 0, width/2, height/2); tint(0, 0, 256); image(cam, 0, height/2, width/2, height/2); tint(256, 0, 256); image(cam, width/2, height/2, width/2, height/2); } Αυτός ο κώδικας χρησιμοποιεί τη λειτουργία εικόνας για να δημιουργήσει τέσσερις ξεχωριστές εικόνες κάμερας σε κάθε γωνία της οθόνης και να τις κάνει όμοιες.
Η λειτουργία απόχρωσης προσθέτει χρώμα σε κάθε εικόνα κάμερας. Οι αριθμοί των βραχιόνων είναι κόκκινες, πράσινες και μπλε (RGB) τιμές. Η απόχρωση αποχρωματίζει όλο τον ακόλουθο κώδικα με το επιλεγμένο χρώμα.
Αποθηκεύστε και παίξτε για να δείτε το αποτέλεσμα. Δοκιμάστε να αλλάξετε τους αριθμούς RGB σε κάθε λειτουργία χρωματισμού για να αλλάξετε τα χρώματα!
Ακολουθώντας το ποντίκι
Τέλος, ας κάνουμε την ζωντανή εικόνα να ακολουθεί τη θέση του ποντικιού χρησιμοποιώντας χρήσιμες λειτουργίες από τη βιβλιοθήκη επεξεργασίας. Προσθέστε αυτό πάνω από το άλλο τμήμα της λογικής σας.
else if(switcher==4 ){ image(cam, mouseX, mouseY, width/2, height/2); } Εδώ, τοποθετείτε την εικόνα από την κάμερα στο ποντίκι X και στο ποντίκι Y. Αυτά είναι ενσωματωμένα στις τιμές επεξεργασίας που επιστρέφουν σε ποιο pixel το ποντίκι δείχνει.
Αυτό είναι! Πέντε παραλλαγές του ζωντανού βίντεο μέσω κώδικα. Ωστόσο, όταν εκτελέσετε τον κώδικα, θα παρατηρήσετε μερικά προβλήματα.
Τελειώνοντας τον κώδικα
Ο κώδικας που δημιουργήσατε μέχρι στιγμής λειτουργεί, αλλά θα παρατηρήσετε δύο θέματα. Πρώτον, μόλις εμφανιστεί η παραλλαγή των τεσσάρων χρωμάτων, τα πάντα μετά είναι πορφυρά. Δεύτερον, όταν μετακινείτε το βίντεο με το ποντίκι, αφήνει ένα ίχνος. Μπορείτε να το διορθώσετε προσθέτοντας μερικές γραμμές στην κορυφή της λειτουργίας κλήρωσης.
void draw(){ tint(256, 256, 256); background(0); //draw function continues normally here! Στην αρχή κάθε πλαισίου ο κώδικας αυτός επαναφέρει το χρώμα απόχρωσης σε λευκό και προσθέτει χρώμα φόντου μαύρου για να σταματήσει το βίντεο αφήνοντας ίχνη. Τώρα όταν δοκιμάζετε το πρόγραμμα, όλα λειτουργούν τέλεια!
Εφέ στο Webcame: Τέχνη από κώδικα
Η επεξεργασία είναι πολύ δυνατή και μπορείτε να την χρησιμοποιήσετε για να κάνετε πολλά πράγματα. Είναι μια εξαιρετική πλατφόρμα για την τέχνη με κώδικα, αλλά είναι εξίσου κατάλληλη για τον έλεγχο ρομπότ!
Εάν η Java δεν είναι το πράγμα σας, υπάρχει μια βιβλιοθήκη JavaScript με βάση την επεξεργασία που ονομάζεται p5.js. Είναι βασισμένο σε πρόγραμμα περιήγησης και ακόμη και οι αρχάριοι μπορούν να το χρησιμοποιήσουν για να δημιουργήσουν φανταστικές αντιδραστικές κινούμενες εικόνες Πώς να γράψετε ένα κινούμενο ρομπότ με ευαισθησία στη φωνή σε p5.js Πώς να γράψετε ένα κινούμενο ρομπότ Animation στο p5.js Θέλετε να προσελκύσετε τα παιδιά σας στον προγραμματισμό ; Δείξτε τους αυτόν τον οδηγό για την οικοδόμηση ενός ηχητικού αντιδραστικού κινούμενου κεφαλιού ρομπότ. Διαβάστε περισσότερα !
Πιστωτική εικόνα: Syda_Productions / Depositphotos
Εξερευνήστε περισσότερα σχετικά με: Κωδικοποίηση Tutorials, Java, Επεξεργασία, Webcam.
