Πληροφορική (Επαγγελματικό Λύκειο)
Κατεβάστε σε μορφή PDF
 2 ώρες

App Inventor: Διδασκαλία Προγραμματισμού με Δημιουργία Εφαρμογών για Κινητές Συσκευές

45 λεπτά

Α΄ Δημιουργία νέου project και ρυθμίσεις οθόνη

Φύλλα Εργασίας

ΔΡΑΣΤΗΡΙΟΤΗΤΑ : ΠΙΑΣΕ ΤΗ ΜΠΑΛΑ

 

ΠΕΡΙΓΡΑΦΗ ΕΦΑΡΜΟΓΗΣ

•             Θα υλοποιήσουμε ένα παιχνίδι στο οποίο ο παίκτης θα χειρίζεται μια μπάλα. Σκοπός του παιχνιδιού είναι να αγγίξει ο παίκτης τη μπάλα.  Εάν ο παίκτης αγγίξει τη μπάλα, τότε κερδίζει ... πόντους και η ταχύτητα της μπάλας αυξάνεται. Εάν ο παίκτης αγγίξει την πίστα, αλλά όχι τη μπάλα, τότε χάνει ... ζωές.

Το σκορ ενδεικτικά θα μπορούσε να προκύπτει π.χ. κερδίζοντας 1 πόντο για κάθε εύστοχο άγγιγμα και χάνοντας μία ζωή για κάθε άστοχο άγγιγμα.

•             Όταν πατηθεί το πλήκτρο "Start/Reset" μηδενίζεται το σκορ για την εκκίνηση ενός νέου παιχνιδιού.

 

•             Επίσης,  με τη βοήθεια ενός αισθητήρα προσανατολισμού (Orientation Sensor) πρέπει κάθε φορά που αλλάζει ο προσανατολισμός της συσκευής να προσαρμόζουμε την κατεύθυνση (heading) της εικόνας της μπάλας.

ΒΑΣΙΚΕΣ ΕΝΝΟΙΕΣ

•             Υποπρόγραμμα - διαδικασία (procedure).

•             Μεταβλητές (variables)

•             Εντολή επιλογής if ... else if ... (Αν ... Αλλιώς Αν ...).

•             Αισθητήρας ανίχνευσης προσανατολισμού της συσκευής.

 

Βήμα 1

                Δημιουργία νέου project και ρυθμίσεις οθόνης

 

Ξεκινώντας, δημιουργούμε ένα καινούργιο project με όνομα CatchTheBall.  Αρχικά, το μοναδικό διαθέσιμο συστατικό της εφαρμογής είναι η οθόνη (Screen 1) και θα χρειαστεί να μεταβάλλουμε κάποιες από τις ιδιότητές της.

επιλέγουμε το αντικείμενο Screen1       μεταβάλλουμε τις ιδιότητες

 

Screen Orientation: Portrait

 Scrollable: No

Title:Χτύπα  τη μπάλα Θα δώσουμε το φύλλο εργασίας στους μαθητές το οποίο όμως θα ολοκληρώσουν τη δεύτερη διδακτική ώρα

Βήμα 2

                Προσθήκη των απαραίτητων αρχείων πολυμέσων

Ας προσθέσουμε στο project μας τα αρχεία εικόνας και τους ήχους που θα χρησιμοποιεί η εφαρμογή μας. Επισκεφθείτε τη διεύθυνση https://drive.google.com/?tab=Xo&authuser=0#folders/0BwA8BQjAnmXsNFljZ09WMXQ5X3M

 

                                                                                     σύντομη περιγραφή

                  ανεβάζουμε το αρχείο με όνομα                         Εικόνα φόντου     

                  real_grass_background.png     

                Soccer_Ball_small.png                                          Γραφικό μπάλας

                music.mid                                             Μουσική που  αναπαράγεται                                                                                  κατά τη διάρκεια του      παιχνιδιού

                click.wav                                                Ήχος εύστοχου αγγίγματος της μπάλας

                             explosion.wav                            Ήχος  5 άστοχων αγγιγμάτων της μπάλας, οπότε                                                              έχουν    χαθεί όλες οι ζωές και ο παίκτης πρέπει να ξεκινήσει νέο παιχνίδι.

Βήμα 3

                Προσθήκη αντικειμένων στο γραφικό περιβάλλον

 

Θα χρειαστούμε το αντικείμενο του καμβά, πάνω στο οποίο θα εμφανίζεται η μπάλα. Επιπλέον, θα προσθέσουμε το γραφικό (ImageSprite) της μπάλας, τρία αντικείμενα Player για την αναπαραγωγή των ηχητικών εφέ. Επίσης θα χρειαστούμε δύο ετικέτες (Label) για τους πόντους και τις ζωές και ένα κουμπί εκίνησης του παιχνιδού (Start/Reset Button). Τέλος θα χρειαστούμε και τον αισθητήρα προσανατολισμού (Orientation Sensor).

 

από την ομάδα     μεταφέρουμε το αντικείμενο     του δίνουμε το όνομα μεταβάλλουμε τις ιδιότητες  

 

Layout  Horrizontal  Arrangement  ScoreLivesArea           AlignHorizontal: Center

                                                                                                                                Width: Fill Parent                                                                                                            

 

UserInterface    Label     ScoreLabel         BackgroundColor: Orange

                                                                        FontSize: 9.0

Text: Σκορ  :   0

TextAlignment:Center

Width:100 pixels

Height:30 pixels

 

UserInterface        Button              StartResetButton             BackgroundColor:Cyan

                                                                                                                FontSize:10.0

Text: Start/Reset

TextAlignment: Center

Width:100 pixels

Height:30 pixels               

               

             UserInterface       Button  StartResetButton             BackgroundColor:Cyan

FontSize: 10.0

Text: Start/Reset

TextAlignment: Center

Width:100 pixels

Height:30 pixels

 

 

 

UserInterface                    Label     LivesLabel                                               BackgroundColor: Orange

FontSize: 9.0

Text: Ζωές :   5

  TextAlignment:Center

Width:100 pixels

            Height:30 pixels   

 

 

 

                                                                                                                               

 

Drawing and Animation  Canvas                GameCanvas                  Backgroundlmage :

real_grass_background.png

Width : Fill Parent

Height : Fill Parent

 

Drawing and Animation   ImageSprite            BallSprite            Picture :Soccer_Ball_small.png

Width : 40 pixels

Height : 40 pixels

Media                   Player                                   SoundPlayer                                                 Source: music.mid

Sensors                Orientation Sensor                    GameSensor           

Media                Player                                      ScorePlayer                                       Source: click.wav

Media                Player                                         LostPlayer                            Source: explosion.wav

Βήμα 4  Αρχική θέση μπάλας

                Πρώτα απ' όλα θα υλοποιήσουμε μία διαδικασία, που θα αναπαράγει τη μουσική του παιχνιδιού και θα περιγράφει τη τυχαία κίνηση της μπάλας.

 

Στο ξεκίνημα του παιχνιδιού θέλουμε τα γραφικό της μπάλας να τοποθετη¬θεί σε τυχαίες θέσεις, μέσα στα όρια του καμβά, φυσικά. Έτσι καλούμε τη διαδικασία MoveBall

αντικείμενο Screen1

Διευκρίνιση: 
Εισάγουμε την εικόνα που θα χρησιμοποιήσουμε ως βασική για την εφαρμογή
Δημιουργός Σεναρίου: ΕΙΡΗΝΗ ΓΕΩΡΓΙΟΥ (Εκπαιδευτικός)