Digital Doodle, MIT App Inventor Tutorial #4

♩♫♪♬

Γεια σας, Είμαστε η Shay και η Emily με ένα ακόμη βίντεο για το App Inventor - Ώρα του Κώδικα

- Γεια Emily, σε προκαλώ σε γρήγορη ζωγραφική.
- Φύγαμε!

Οκ, είναι λίγο παιδικό, αλλά διασκεδαστικό.

Ώρα για το επόμενο βήμα, μετά την πρώτη εικόνα.

Θα είναι θαυμάσια εφαρμογή. Θα ζωγραφίσουμε με το δάχτυλο ως πένα.

Θα το ονομάσουμε Digital Doogle

Πίσω στη σχεδίαση. Το πιάσατε; Πάμε λοιπόν

Συνδεθείτε στο App Inventor

Δημιουργήστε νέο έργο, το DigitalDoodle

Εισάγετε ένα χειριστήριο canvas για αρχή

Πριν από αυτό, πρέπει να αποτρέψουμε την περιστροφή της εφαρμογής; Θυμάστε πως;

Στα properties της οθόνης sreen1, θέτουμε το Scrollable μη ενεργό (unchecked)

Εισάγουμε χειριστήριο Canvas από το Drawing and Animation

Στις ιδιότητες θέτουμε το height και το width σε Fill parent

Αυτό ανοίγει την έκταση του χειριστηρίου

Αν και δεν θα χρειαστεί άμεσα εισάγετε στην εφαρμογή και ένα χειριστήριο accelerometer από το Sensors

Ας προγραμματίσουμε

Η ανίχνευση του γεγονότος (event) όπου σύρετε το δάχτυλο στην οθόνη είναι εύκολη

Επιλέγουμε τα πλακίδια του canvas. Μπορείτε να εντοπίσετε ποιο μας χρειάζετε;

Ωραία, χρειαζόμαστε το Canvas1.Dragged

Το πλαδίκιο περιέχει μια σειρά από παραμέτρους. Αλλά είναι εύκολο να τις κατανοήσετε

Και μπορείς να δει τη βοήθεια, αν αφήσεις το ποντίκι στο σημείο για μερικά δευτερόλεπτα

Τέλεια, θέλουμε να σχεδιάσουμε μια γραμμή, από το σημείο που ξεκίνησε το δάχτυλο, μέχρι εκεί που τώρα

Τελικά, θα σχεδιαστούν στην οθόνη (canvas) πολλές μικροσκοπικές γραμμές, μεταξύ των σημείων που σύρθηκε το ποντίκι.

Αυτό θα μοιάζει σα να σχεδιάζουμε στην οθόνη

Πρώτα, πρέπει να οριστεί το πλακίδιο που θα σχεδιάζει τη γραμμή. Στο canvas1, επιλέξτε το canvas1.drawline

Πρέπει να οριστούν οι συντεταγμένες Χ, Υ για την αρχή και το τέλος της γραμμής

Το γεγονός WhenDragged θα καλέσει την διαδικασία DrawLine ξανά και ξανά όσο το δάχτυλο κινείται στην οθόνη

Απλά πρέπει να δώσουμε τις συντεταγμένες Χ, Υ

Χρησιμοποιήστε τις παραμέτρους PreviousX και PreviousY

Επίσης, τις παραμέτρους CurrentX και CurrentY

Δοκιμάστε την εφαρμογή

Πρέπει να σχεδιάζετε γραμμή στην οθόνη

Αυτή η εφαρμογή είναι τέλεια, αλλά θα ήταν όμορφο, αν η οθόνη καθάριζε με την κίνησή της (αντί το πάτημα κουμπιού)

Ναι

Θυμηθείτε ότι έχει εισαχθεί accelator sensor στην αρχή

Ναι, τώρα θα τον προγραμματίσουμε

Στα χειριστήρια του accelator Sensot επιλέγουμε το γεγονός When Shaking

Αυτό το γεγονός θα οδηγεί σε καθάρισμα της οθόνης

Στην παλέτα του canvas, επιλέγουμε canvas1.Clear. Το εισάγουμε στο προηγούμενο πλακίδιο

Ας δοκιμάσουμε πάλι την εφαρμογή

Δουλεύει;

Τέλεια, οπότε δημιουργήσαμε μια απλή εφαρμογή που μπορει να επεκταθεί με πολλούς τρόπους

Στην αρχή του βίντεο, λάβαμε φωτογραφία με το κινητό και μετά σχεδιάσαμε πάνω της

Θα μπορούσατε να δημιουργήσετε κουμπιά για την επιλογή διαφορετικών χρωμάτων για τις γραμμές

Όλες αυτές οι επεκτάσεις επεξηγούνται στο PaintPot tutorial

Όπως αντιλαμβάνεστε οι δυνατότητες του App Inventor είναι ανεξάντλητες. Αξιοποιεί όλες τις δυνατότητες του τηλεφώνου σας

Μπορείτε ακόμη και να πραγματοποιήσετε κλήσεις ή να λάβετε μηνύματα κειμένου

Μπορείτε ακόμη και χρησιμοποιώντας ταμπλέτα (με wifi) να κάνετε θαυμαστά πράγματα

Ευχαριστούμε πολύ που παρακολουθήσατε το βίντεο. Δείτε περισσότερο στην ιστοσελίδα του App Inventor

Καλή συνέχεια

♩♫♪♬