Εφαρμογή Παρακολούθησης Τιμών Καυσίμων για Windows Phone 8

Transcript

1 ΑΤΕΙ ΘΕΣΣΑΛΙΑΣ ΣΧΟΛΗ ΤΕΧΝΟΛΟΓΙΚΩΝ ΕΦΑΡΜΟΓΩΝ Τμήμα Μηχανικών Πληροφορικής ΤΕ Εφαρμογή Παρακολούθησης Τιμών Καυσίμων για Windows Phone 8 ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ Αναστάσιος Θεοδοσίου ( ΑΜ: Τ03358 ) Επιβλέπων: Φώτης Κόκκορας, Καθηγητής Εφαρμογών ΛΑΡΙΣΑ 2014

2

3 «Εγώ ο Αναστάσιος Θεοδοσίου δηλώνω υπεύθυνα ότι η παρούσα Πτυχιακή Εργασία με τίτλο Εφαρμογή Παρακολούθησης Τιμών Καυσίμων για Windows Phone 8 είναι δική μου και βεβαιώνω ότι: Σε όσες περιπτώσεις έχω συμβουλευτεί δημοσιευμένη εργασία τρίτων, αυτό επισημαίνεται με σχετική αναφορά στα επίμαχα σημεία. Σε όσες περιπτώσεις μεταφέρω λόγια τρίτων, αυτό επισημαίνεται με σχετική αναφορά στα επίμαχα σημεία. Με εξαίρεση τέτοιες περιπτώσεις, το υπόλοιπο κείμενο της πτυχιακής αποτελεί δική μου δουλειά. Αναφέρω ρητά όλες τις πηγές βοήθειας που χρησιμοποίησα. Σε περιπτώσεις που τμήματα της παρούσας πτυχιακής έγιναν από κοινού με τρίτους, α- ναφέρω ρητά ποια είναι η δική μου συνεισφορά και ποια των τρίτων. Γνωρίζω πως η λογοκλοπή αποτελεί σοβαρότατο παράπτωμα και είμαι ενήμερος(-η) για την επέλευση των νομίμων συνεπειών» < υπογραφή > Αναστάσιος Θεοδοσίου

4 Εγκρίθηκε από την τριμελή εξεταστική επιτροπή Τόπος: Ημερομηνία: ΕΠΙΤΡΟΠΗ ΑΞΙΟΛΟΓΗΣΗΣ

5 Περίληψη Αντικείμενο της παρούσας πτυχιακής εργασίας, είναι η ανάπτυξη μιας εφαρμογής παρακολούθησης τιμών υγρών καυσίμων της Ελληνικής αγοράς (fuelgr), για την πλατφόρμα "έξυπνων" κινητών τηλεφώνων με λειτουργικό σύστημα Windows Phone 8, της Microsoft. Η απόφαση ανάπτυξης τη εφαρμογής βασίστηκε σε δύο σημαντικούς παράγοντες: την απουσία ποιοτικών εφαρμογών αυτού του είδους στο Windows Phone Store, τη διαθεσιμότητα δεδομένων με τη μορφή web υπηρεσίας ( από την ομάδα του συστήματος αποδελτίωσης ιστού (web extraction) DEiXTo, που αποδελτιώνει και αναδιανέμει σχετικά δεδομένα που καταχωρούν οι πρατηριούχοι στο Παρατηρητήριο Τιμών Υγρών Καυσίμων του Υπουργείου Ανταγωνιστικότητας ( Η εφαρμογή που αναπτύχθηκε αξιοποιεί τις ιδιαιτερότητες των mobile συσκευών μικρού μεγέθους και παρέχει πλήθος χαρακτηριστικών, όπως φιλτράρισμα πρατηρίων με πολλαπλά κριτήρια (γεωγραφική περιοχή, τύπο καυσίμου, εταιρία διανομής, παλαιότητα τιμών), προβολή πρατηρίων σε χάρτη αλλά και σε λίστα αυτά που δεν διαθέτουν γεωγραφικό στίγμα, οδηγίες πλοήγησης προς επιλεγμένο πρατήριο, δυνατότητα υποβολής από το χρήστη προτάσεων διόρθωσης θέσης για πρατήρια, προβολή εικόνας πρατηρίου από το την υπηρεσία Google Street View για τα πρατήρια με άριστο στίγμα, δυνατότητα ενημέρωσης του server για τυχόν λάθος θέση πρατηρίου πάνω στο χάρτη, κτλ. Το χαρακτηριστικό της διόρθωσης θέσης των πρατηρίων, συμβάλει στην συνεχή βελτίωση της ποιότητας δεδομένων που παρέχει το fuelgr API του DΕiΧΤο, καθιστώντας την εφαρμογή που αναπτύχθηκε μέλος μιας οικογένειας εφαρμογών παρόμοιας φιλοσοφίας που χτίζεται γύρω από το συγκεκριμένο API. Η εφαρμογή βρίσκεται στο Windows Phone Store από τις 19/05/2014 και μέχρι τις 29/09/2014 έχει εγκατασταθεί πάνω από 1900 φορές και οι χρήστες της έχουν κάνει πάνω από 8600 κλήσεις προς το fuelgr API, γεγονός που την καθιστά πετυχημένη στο είδος της και δικαιώνει τις σχεδιαστικές επιλογές που έγιναν κατά την ανάπτυξή της. -i-

6

7 Ευχαριστίες Ευχαριστώ θερμά τον κύριο Φώτη Κόκκορα, καθηγητή του ΤΕΙ Θεσσαλίας, που ήταν επιβλέπων στην πτυχιακή μου εργασία και αφιέρωσε αρκετό χρόνο κατά την διάρκεια ολοκλήρωσή της. Τον ευχαριστώ επίσης για την ενθάρρυνσή του στους αρχικούς μου δισταγμούς. Αναστάσιος Θεοδοσίου Σεπτέμβριος iii-

8

9 Περιεχόμενα ΠΕΡΙΛΗΨΗ... I ΕΥΧΑΡΙΣΤΙΕΣ... III ΠΕΡΙΕΧΟΜΕΝΑ... V 1 ΕΙΣΑΓΩΓΗ ΤΕΧΝΟΛΟΓΙΚΟ ΥΠΟΒΑΘΡΟ ΑΡΧΙΤΕΚΤΟΝΙΚΗ WINDOWS PHONE ΑΝΑΦΟΡΑ ΣΤΟ WINDOWS PHONE API EXTENSIBLE APPLICATION MARKUP LANGUAGE XAML Τι είναι η XAML Ο ρόλος της XAML στο windows phone Ορισμός αντικειμένων στην XAML ΧΑΡΤΕΣ ΚΑΙ ΠΛΟΗΓΗΣΗ ΣΤΑ WINDOWS PHONE Εμφάνιση του map control Ορισμός χαρτογραφικής λειτουργίας χάρτη Ορισμός θέματος χάρτη Ορισμός πολλαπλών ιδιοτήτων και μεταβάσεις με animation χρησιμοποιώντας προβολές χάρτη Οδηγίες πλοήγησης στο windows phone ΕΓΓΡΑΦΗ ΚΑΙ ΑΝΑΓΝΩΣΗ ΔΕΔΟΜΕΝΩΝ ΣΤΟ ISOLATED STORAGE IsolatedStorageSettings και ρυθμίσεις εφαρμογών Περιπτώσεις χρήσης του IsolatedStorageFile για XML αρχεία ΠΕΡΙΓΡΑΦΗ ΠΡΟΒΛΗΜΑΤΟΣ ΚΑΙ FUELGR API ΠΕΡΙΓΡΑΦΗ ΠΡΟΒΛΗΜΑΤΟΣ ΚΑΙ Η ΛΥΣΗ ΤΟΥ FUELGR FUELGR API ΥΛΟΠΟΙΗΣΗ ΕΦΑΡΜΟΓΗΣ FUELGR ΣΧΕΔΙΑΣΤΙΚΕΣ ΕΠΙΛΟΓΕΣ ΕΦΑΡΜΟΓΗΣ v-

10 4.2 ΣΥΝΤΟΜΟΣ ΟΔΗΓΟΣ ΧΡΗΣΗΣ ΤΗΣ ΕΦΑΡΜΟΓΗΣ ΒΑΣΙΚΑ ΜΕΡΗ ΤΟΥ ΚΩΔΙΚΑ ΤΗΣ ΕΦΑΡΜΟΓΗΣ Μηχανισμός λήψης δεδομένων από το fuelgr Η μέθοδος SaveXML Η μέθοδος ReadSavedXML Η μέθοδος GetMyLocation Μέθοδος εμφάνισης αποτελεσμάτων ShowDataOnMap() Η μέθοδος pushpin_taped() Η μέθοδος InformUsForWrongStation() Μηχανισμός αποστολής διόρθωσης θέσης πρατηρίου Μέθοδοι σελίδας ρυθμίσεων Η χρήση του Google Maps Image API για την εφαρμογή Η μέθοδος GetDistanceTo Google Analytics ΣΥΜΠΕΡΑΣΜΑΤΑ ΒΙΒΛΙΟΓΡΑΦΙΑ vi-

11 1 Εισαγωγή Στις μέρες μας οι mobile εφαρμογές αυξάνονται με γοργούς ρυθμούς καθώς τα smartphones στην αγορά έχουν κερδίσει ένα πολύ μεγάλο μέρος των χρηστών. Τον Ο- κτώβριο του 2010 εμφανίστηκε για πρώτη φορά στην αγορά το λειτουργικό σύστημα Windows Phone 7 της Microsoft Corporation το οποίο ήταν μια πλατφόρμα για mobile συσκευές. Τα Windows Phone πρόσφεραν στο χρήστη τους κάτι τελείως νέο για αυτόν σε σχέση με τα όσα είχε συνηθίσει από το Android και το IOS της Google και της Apple αντίστοιχα καθώς και από άλλα λειτουργικά συστήματα μικρότερης εμβέλειας όπως το Symbian της Nokia. Τόσο σε επίπεδο UI (user interface) όσο και σε επίπεδο αρχιτεκτονικής, το λειτουργικό σύστημα της Microsoft έδειχνε πως ήρθε για να μείνει. Όσον α- φορά το UI των windows phone, βλέπουμε πως ακολουθεί μια διαφορετική γραμμή σχεδίασης. Παρατηρούμε πως επιλέχτηκε η flat σχεδίαση με έμφαση στην πληροφορία που εμφανίζεται στον χρήστη. Οι αντιθέσεις των χρωμάτων καθώς και οι γραμματοσειρές του κειμένου είναι ιδικά προσαρμοσμένες έτσι ώστε να μην υπάρχει η ούτε παραμικρή σύγχυσή τους. Οι εφαρμογές εμφανίζονται ως Tiles ( ενεργό πλακίδιο ) στην start screen της συσκευής ενώ το μενού που εμφανίζονται όλες οι εφαρμογές, παρουσιάζεται με την μορφή μιας λίστας. Από θέμα αρχιτεκτονικής, το windows phone είναι έτσι σχεδιασμένο ώστε να τρέχει χωρίς προβλήματα ακόμα και σε low end συσκευές. Δεν βασίζεται τόσο πολύ στο μέγεθος της RAM της συσκευής όπως για παράδειγμα το Android και δεν χρειάζεται ισχυρό επεξεργαστή για την απροβλημάτιστη λειτουργία του. Περισσότερες πληροφορίες για την αρχιτεκτονική του συστήματος θα αναφέρουμε σε επόμενο κεφάλαιο. Έχοντας λοιπόν υπόψη μου τα παραπάνω χαρακτηριστικά των windows phone καθώς και μια μικρή έρευνα που πραγματοποίησα για τον αν υπάρχουν σχετικές εφαρμογές με το fuelgr ( εφαρμογή παρακολούθησης τιμών υγρών καυσίμων για την Ελληνική αγορά ) και το πόσο καλές ήταν, ( σε σχέση με το τι προσφέρουν ) με οδήγησαν στην επιλογή του λειτουργικού Windows Phone ως την πλατφόρμα ανάπτυξης της ε- φαρμογής. -1-

12 Σύμφωνα με την έρευνα που τα αποτελέσματά της φαίνονται στον Πίνακα 1, βλέπουμε πως οι περισσότερες εφαρμογές αυτού του είδους συγκεντρώνουν τα παρακάτω χαρακτηριστικά. Εφαρμογή Χαρακτηριστικό πλατφόρμα Fuels Bres ti benzini Fuel Stations VenziniGR Windows Phone Windows Phone Τιμές Kαυσίμων Android Android IOS πηγή τιμών fuelprices.gr? fuelprices.gr fuelprices.gr fuelprices.gr φίλτρα Νομός Δήμος Παλαιότητα Τιμών Τύπος Καυσίμου Εταιρία Διανομής Ακτίνα km off-line mode - - μόνο τιμές μόνο τιμές - επισήμανση λανθασμένης θέσης πλοήγηση στο πρατήριο ? προβολή σε χάρτη - - προβολή σε λίστα ιδιαίτερη προβολή φθηνότερων πρατηρίων - -? ορισμός αγαπημένου εκτίμηση απόστασης (Κm) - - Πίνακα 1: Χαρακτηριστικών εφαρμογών Βάση του Πίνακα 1, βλέπουμε πως δεν υπάρχει μια εφαρμογή που να συγκντρώνει όλα τα παραπανω χαρακτηριστικά σε μια. Η εφαρμογή fuelgr θα προσπαθήσει να δώσει στους χρήστες της όλες τις παραπανω δυνατότητες καθώς και να τους προσφέρει νέες όπως για παράδειγμα η προβολή της εικόνας του πρατηριου μέσω της υπηρεσίας Google Street View, την διόρθωση της θέσης ενός πρατηρίου και άλλα πολλά. Στα ε- πόμενα κεφάλαια της εργασίας, θα αναλύσουμε το τεχνολογικό υπόβαθρο που έχει η εφαρμογή, τον τρόπο με τον οποίο αναπτύχθηκε και φυσικά τις ανάγκες που εξυπηρετεί

13 2 Τεχνολογικό Υπόβαθρο Στο κεφάλαιο αυτό θα αναφερθούμε σε θέματα που σχετίζονται με το τεχνολογικό υπόβαθρο των Windows Phone εφαρμογών καθώς και για την αρχιτεκτονική του λειτουργικού συστήματος. 2.1 Αρχιτεκτονική Windows Phone Κάνοντας λόγο για την αρχιτεκτονική οποιουδήποτε λειτουργικού συστήματος, δεν θα μπορούσε να γίνει ποιο κατανοητή η δομή του συστήματος χωρίς την ύπαρξη ενός διαγράμματος αρχιτεκτονικής. Στο διάγραμμα που ακολουθεί απεικονίζεται η αρχιτεκτονική του λειτουργικού συστήματος Windows Phone. Το παρακάτω διάγραμμα Eικόνα 1 παρέχει μια επισκόπηση υψηλού επιπέδου η οποία οργανώνεται σε επίπεδα (layers) και ιδιοκτησίες (ownerships). Eικόνα 1: Διάγραμμα αρχιτεκτονικής Windows Phone -3-

14 Παρατηρώντας το διάγραμμα αρχιτεκτονικής, βλέπουμε πως οι συνεργάτες της Microsoft παρέχουν τα περισσότερα από τα προγράμματα οδήγησης χαμηλού επιπέδου αλληλεπίδραση και εκκίνησης το υλικό για το τηλέφωνο, με τη μορφή ενός πακέτου στήριξης (board support package - BSP). Το πακέτο αυτό είναι μια συλλογή από προγράμματα οδήγησης και από βιβλιοθήκες υποστήριξης. Ο πυρήνας του πακέτου στήριξης (BSP) γράφεται από τον κατασκευαστή της κεντρικής μονάδας επεξεργασίας (CPU). Οι κατασκευαστές είναι υπεύθυνοι για την προσθήκη των προγραμμάτων οδήγησης που απαιτούνται για την υποστήριξη του τηλεφώνου, μερικά από τα οποία γράφουν μόνοι τους και τα υπόλοιπα τα οποία προέρχονται από τον IHV (independent hardware vendor) ο οποίος κατασκευάζει ειδικά εξαρτήματα υλικού (hardware). O πυρήνας του λειτουργικού συστήματος κυρίως προέρχεται από τον πυρήνα των Windows με αλλαγές που είναι απαραίτητες για τα Window Phone. Ένα στρώμα πάνω από το ε- πίπεδο του πυρήνα στο σχεδιάγραμμα υπάρχει το επίπεδο όπου περιέχονται οι υπηρεσίες του συστήματος καθώς και τα frameworks προγραμματισμού. Οι εφαρμογές χρησιμοποιούν το επίπεδο αυτό για να δημιουργήσουν την εμπειρία των χρηστών (user experiences), στο τηλέφωνο. Αξίζει να σημειωθεί πως το λειτουργικό σύστημα Windows Phone 8.1 είναι βασισμένο στον πυρήνα του λειτουργικού συστήματος Windows NT. Για να γίνει ποιο σαφές το λειτουργικό αυτό (Window Phone 8.1) σύστημα, χρησιμοποιεί τον πυρήνα των Windows ο οποίος είναι ένα απλό σύστημα Windows που εκκινεί και διαχειρίζεται το υλικό και τους πόρους, επικοινωνεί στο δίκτυο και παρέχει χαμηλού επιπέδου ασφάλεια. Για να διαχειριστεί τις διάφορες εργασίες του τηλεφώνου, ο πυρήνας του συστήματος επεκτείνεται με ένα σύνολο ειδικών εκτελέσιμων αρχείων τα οποία αποτελούν τον πυρήνα του κινητού (Mobile Core). 2.2 Αναφορά στο Windows Phone API Στην ενότητα αυτή θα γίνει μια επισκόπηση στην διεπαφή προγραμματισμού εφαρμογών (API) του λειτουργικού συστήματος Windows Phone 8 καθώς και μια σύντομη αναφορά στο kit ανάπτυξης λογισμικού (SDK) για την συγκεκριμένη πλατφόρμα. Με το SDK των Window Phone, δίνεται η δυνατότητα στους προγραμματιστές να αναπτύξουν εφαρμογές έχοντας στην διάθεσή τους μια ποικιλία από εργαλεία και γλώσσες προγραμματισμού. Ο προγραμματιστής μπορεί να αναπτύξει την εφαρμογή που επιθυμεί κάνοντας χρήση της επεκτάσιμης γλώσσας σήμανσης εφαρμογών ή αλλιώς XAML -4-

15 για την κατασκευή της διεπαφής του χρήστη και την μια από της υποστηριζόμενες γλώσσες προγραμματισμού του.net (C++, C#, VB.NET, ) για τον προγραμματισμό της συμπεριφοράς της εφαρμογής. Στο Windows Phone 8 SDK, παρέχεται η δυνατότητα χρήσης της γλώσσας C++ μαζί με την XAML για μεγαλύτερη ευελιξία και απόδοση. Το παρακάτω διάγραμμα Eικόνα 2 απεικονίζει το σύνολο των APIs που συνθέτουν το Windows Phone API. Eικόνα 2: Αναπαράσταση των APIs που απαρτίζουν το Windows Phone API Ένα από τα ποιο σημαντικά χαρακτηριστικά όλων των λειτουργικών συστημάτων, είναι η ασφάλεια που παρέχουν στο χρήστη τους. Το Windows Phone OS, παρέχει ένα μοντέλο ασφάλειας οδηγούμενο από δυνατότητες στις οποίες ο χρήστης έχει πρόσβαση μέσω της εφαρμογής. Με απλά λόγια, ο προγραμματιστής κατά την ανάπτυξη της ε- φαρμογής πρέπει να ορίσει τι δυνατότητες που θα δώσει στην εφαρμογή οι οποίες απαιτούνται για την λειτουργία της. Οι δυνατότητες (capabilities) πρέπει να ενεργοποιηθούν μέσα στο αρχείο AppManifest που βρίσκεται μέσα στο project της εκάστοτε εφαρμογής. Windows Phone Runtime API Το Windows Phone Runtime API είναι ένα υποσύνολο του native API το οποίο είναι ενσωματωμένο στο λειτουργικό σύστημα. Είναι υλοποιημένο σε C++ και προβάλετε σε -5-

16 C#, VB.NET και σε C++ με στόχο την ευκολότερη κατανόηση και αξιοποίηση από τους προγραμματιστές με την χρήση της γλώσσας που γνωρίζουν. Οι προγραμματιστές που είναι εξοικειωμένοι με το windows runtime θα δουν πως το windows phone runtime είναι εύκολο στο να το μάθουν. Τα διάφορα frameworks που χρησιμοποιούνται είναι σχεδόν τα ίδια με αυτά του windows runtime με ελάχιστες ή και καθόλου διαφορές. Στο διάγραμμα Eικόνα 3 που ακολουθεί βλέπουμε την σχέση μεταξύ του windows phone runtime και του windows runtime. Eικόνα 3: Windows and Windows Phone Runtime Το διάγραμμα έχει τρεις διακριτές περιοχές οι οποίες και περιγράφονται ως εξής: 1. Στην περιοχή αυτή φαίνεται το σύνολο των windows runtime apis που δεν υποστηρίζονται στα windows phone 8. Η έκταση των api που ανήκουν στο windows runtime είναι πολύ μεγάλη με περισσότερα από μέλη. Έχει υιοθετηθεί ένα υποσύνολο για τα windwos phone 8 που επιτρέπει στους προγραμματιστές να δημιουργήσουν μοναδικά σενάρια τηλεφώνου. -6-

17 2. Σε αυτή την περιοχή βλέπουμε την περιοχή των apis του windows runtime που έχουν υιοθετηθεί στα windows phone 8. Η περιοχή αυτή φαίνεται με το βαθύ μπλε χρώμα στο διάγραμμα και αποτελείτε από περίπου μέλη. Για ορισμένους τύπους δεν έχουν υλοποιηθεί κάποια μέλη. Για κάποια άλλα έχουν προστεθεί μέλη για την υποστήριξη χαρακτηριστικών μόνο του τηλεφώνου. Και στις δυο περιπτώσεις, οι διαφορές μεταξύ τους υπάρχουν στο documentation του api. 3. Στην τρίτη και τελευταία περιοχή του διαγράμματος φαίνονται τα σημαντικά apis που έχουν προστεθεί έτσι ώστε να παρέχουν την δυνατότητα ανάπτυξης υπέροχων εφαρμογών για τα κινητά τηλέφωνα. Η περιοχή αυτή απαρτίζεται από περίπου 600 μέλη. Για παράδειγμα, υπάρχουν μερικά ολοκαίνουρια apis για σύνθεση και αναγνώριση ομιλίας, VOIP, καθώς και άλλα χαρακτηριστικά. Η δημιουργία αυτών των api ως windows runtime apis, σημαίνει πρακτικά ότι μπορούν να χρησιμοποιηθούν ανεξάρτητα από την γλώσσα προγραμματισμού που χρησιμοποιείτε για την ανάπτυξη μιας εφαρμογής. 2.3 Extensible Application Markup Language XAML Σε αυτό το κεφάλαιο θα γίνει μια σύντομη αναφορά στο τι είναι η XAML και ποιος είναι ο ρόλος τις windows phone εφαρμογές Τι είναι η XAML Η XML (Extensible Markup Language) είναι μια δηλωτική γλώσσα. Συγκεκριμένα η XAML μπορεί να αρχικοποιήσει αντικείμενα και να ορίσει ιδιότητες αυτών χρησιμοποιώντας μια δομή της γλώσσας που δείχνει ιεραρχικές σχέσεις μεταξύ πολλαπλών α- ντικειμένων χρησιμοποιώντας μια σύμβαση τύπου backing η οποία υποστηρίζει την επέκταση των τύπων. Μπορείτε να δημιουργήσετε ορατά στοιχεία UI στο δηλωτική σήμανσης XAML. Μπορείτε έπειτα να χρησιμοποιήσετε ένα ξεχωριστό αρχείο κώδικα που να ανταποκρίνεται στα διάφορα event που προκαλούνται από UI elements μου έχετε δηλώσει με την XAML. Η XML υποστηρίζει την ανταλλαγή πηγών μεταξύ διαφόρων εργαλείων και ρόλων στην διαδικασία ανάπτυξης της εφαρμογής χωρίς την παραμικρή απώλεια πληροφορίας. Ένα απλό παράδειγμα μια τέτοιας ανταλλαγής είναι η ε- πεξεργασία κώδικα XAML μια από το Visual Studio και μια από το Microsoft Expression Blend. Τα αρχεία XAML είναι XML αρχεία που έχουν ως επέκταση αρχεί- -7-

18 ου το.xaml. Στο παράδειγμα που ακολουθεί φαίνονται τα περιεχόμενα ενός πολύ βασικού Windows Phone XAML αρχείου. <UserControl x:class="mywindowsphone.page" xmlns=" xmlns:x=" <Grid Background="OldLace"> </Grid> </UserControl> Ο ρόλος της XAML στο windows phone Στην αρχιτεκτονική των windows phone και στην διαδικασία ανάπτυξης windows phone εφαρμογών, η XAML παίζει αρκετά σημαντικό ρόλο. Η XAML είναι η κύρια μορφή ορισμού του windows phone UI και στοιχείων μέσα σε αυτό. Τυπικά τουλάχιστον ένα αρχείο XAML στο έργο σας αντιπροσωπεύει μια "σελίδα" της εφαρμογής που εμπεριέχει το UI που θα εμφανιστεί στην οθόνη του τηλεφώνου. Άλλα αρχεία XAML μπορεί να ορίσουν πηγές όπως για παράδειγμα διάφορα templates (πρότυπα) ή και άλλα controls που μπορούν να επαναχρησιμοποιηθούν. Η XAML είναι μορφή που χρησιμοποιείται για την δήλωση style (στυλ) και templates (προτύπων) τα οποία βασίζονται στην λογική του windows phone UI. Μπορείτε να το κάνετε αυτό για να επεξεργαστείτε controls που υπάρχουν ήδη ή ακόμα και για να φτιάξετε νέα. Όταν την χρησιμοποιείται για να δηλώσετε στυλ και πρότυπα, η XAML συχνά δηλώνεται ως ένα αρχείο xaml με ResourceDictionary root. To ResourceDictionary είναι μια κλάση που παρέχει ένα λεξικό που περιέχει πόρους που χρησιμοποιούνται από τα συστατικά μιας εφαρμογής XAML. Η XAML είναι μια κοινή μορφή για την υποστήριξη των σχεδιαστών που δημιουργούν UI για τα windows phone οι οποίοι ανταλλάζουν σχέδια UI μεταξύ διάφορων σχεδιαστικών εφαρμογών. Ποιο συγκεκριμένα η XAML για τις ε- φαρμογές των windows phone τηλεφώνων, μπορεί να εναλλάσσεται μεταξύ προγραμμάτων όπως το Visual Studio και το Microsoft Expression Blend. Η XAML στα windows phone ορίζει την οπτική εμφάνιση του UI και σχετίζεται με ένα αρχείο κώδικα που ορίζει την λογική της εφαρμογής. Ο σχεδιασμός του UI μπορεί να αλλάξει χωρίς να απαιτούνται απαραίτητα αλλαγές και στο αρχείο του κώδικα. Η XAML σε αυτό το ρόλο απλοποιεί την ροή εργασίας μεταξύ των σχεδιαστών της εφαρμογής που είναι υπεύθυνοι για την εμφάνιση της -8-

19 εφαρμογής και των προγραμματιστών που είναι υπεύθυνοι για την λογική της εφαρμογής. Λόγο της οπτικής των σχεδιαστών και της υποστήριξης της επιφάνειας σχεδίασης, η XAML υποστηρίζει την ταχεία προτυποποίηση UI από τα αρχικά σχέδια της ανάπτυξης και καθιστά ποιο πιθανό ότι τα στοιχεία που σχεδιάζονται μπορούν να διατηρηθούν ως ανεξάρτητα στοιχεία και να επαναχρησιμοποιηθούν ακόμα και αν η οπτική του σχεδιασμού αλλάξει ριζικά. Ανάλογα με την πορεία που ακολουθείται στην διαδικασία της ανάπτυξης μιας εφαρμογής μπορεί να μην χρειάζεται εκτενής αλληλεπίδραση με την γλώσσα XAML. Ο βαθμός της αλληλεπίδρασης με την XAML εξαρτάται από το ποιο περιβάλλον ανάπτυξης χρησιμοποιείται, ακόμα και από το αν χρησιμοποιείται διαδραστικό περιβάλλον εργασίας όπως τα toolboxes και επεξεργαστές ιδιοτήτων καθώς και από τον σκοπό της windows phone εφαρμογής σας. Παρόλα αυτά είναι πιθανό ότι κατά την διάρκεια της ανάπτυξης μια εφαρμογής θα πρέπει να επεξεργαστείτε ένα αρχείο XAML σε επίπεδο στοιχείου (element) χρησιμοποιώντας έναν επεξεργαστή κειμένου Ορισμός αντικειμένων στην XAML Ένα αρχείο XAML έχει πάντα ακριβώς ένα στοιχείο που χρησιμεύει ως η ρίζα του, η οποία δηλώνει ένα αντικείμενο που θα είναι η εννοιολογική ρίζα κάποιας προγραμματιστικής δομής όπως για παράδειγμα μια σελίδα, ή το γράφημα αντικειμένου ολόκληρου του ορισμού του run-time της εφαρμογής. Σε όρους XAML σύνταξης, υπάρχουν τρεις τρόποι ορισμού αντικειμένων στην XAML: 1. Άμεσα, χρησιμοποιώντας τη σύνταξη στοιχείο αντικειμένου: χρησιμοποιεί ετικέτες ανοίγματος και κλεισίματος για να παρουσιάσει ένα αντικείμενο, όπως ένα στοιχείο σε μορφή XML. Μπορείτε να χρησιμοποιήσετε αυτήν την σύνταξη για να δηλώσει αντικείμενα ρίζας ή να δημιουργήσετε εμφωλευμένα αντικείμενα που καθορίζουν τις τιμές των ιδιοτήτων. 2. Έμμεσα χρησιμοποιώντας την σύνταξη ιδιοτήτων: χρησιμοποιεί μια inline τιμή τύπου συμβολοσειράς (string) για να ορίσει ένα αντικείμενο. Για την ακρίβεια, αυτό θα μπορούσε να χρησιμοποιηθεί για να αρχικοποιήσει οποιοδήποτε αντικείμενο εκτός από το στοιχείο βάσεις (root element).η σύνταξη αυτή μπορεί να χρησιμοποιηθεί για ορίσετε τιμές σε ιδιότητες. Αυτή είναι μια έμμεση λει- -9-

20 τουργία του επεξεργαστή της XAML γιατί πρέπει να υπάρχει μια διαδικασία που να γνωρίζει πως αν δημιουργήσει ένα νέο αντικείμενο με την λογική του να γνωρίζει ποια ιδιότητα ορίζεται, τα χαρακτηριστικά του συστήματος για την ι- διότητα καθώς και την παρεχόμενη τιμή της συμβολοσειράς. Συνήθως αυτό σημαίνει ότι ο τύπος ή η ιδιότητα υποστηρίζουν μετατροπέα τύπου ο οποίος μπορεί να επεξεργαστεί την συμβολοσειρά εισόδου ή ο αναλυτής την XAML (xaml parser) να επιτρέπει μια φυσική μετατροπή. 3. Χρησιμοποιώντας μια επέκταση σήμανσης(markup extensions): Η επέκταση σήμανσης είναι μια έννοια της XAML γλώσσας που χρησιμοποιείται πολύ στην εκτέλεση της XAML στο λειτουργικό windows phone. Στην σύνταξη ιδιοτήτων της XAML η χρήση των άγκιστρων δείχνει την επέκταση σήμανσης. Η χρήση αυτής της σύνταξης κατευθύνει την επεξεργασία της XAMLνα ξεφεύγει από την γενική των τιμών των ιδιοτήτων και να μοιάζει είτε ως κατεξοχήν συμβολοσειρά ή ως μια άμεσα μετατρέψιμη τιμή. Αντ 'αυτού, ένα πρόγραμμα ανάλυσης (parser) συνήθως απαιτεί κώδικα που να υποστηρίζει ότι η συγκεκριμένη επέκταση σήμανσης, η οποία βοηθά στην κατασκευή του δέντρου του αντικειμένου (object tree), από την σήμανση. Αυτό δεν σημαίνει ότι θα έχετε πάντα την επιλογή της κάθε σύνταξης για τη δημιουργία αντικειμένων σε ένα συγκεκριμένο λεξιλόγιο XAML. Ορισμένα αντικείμενα από το λεξιλόγιο μπορεί να δημιουργηθεί μόνο με τη χρήση σύνταξη στοιχείο αντικειμένου. Μόνο ένας μικρός αριθμός αντικειμένων μπορεί να δημιουργηθεί που να είναι αρχικά ορισμένος σε τιμή μιας ιδιότητας. Στην πραγματικότητα τα αντικείμενα που μπορούν να δημιουργηθούν με τον ένα ή με τον άλλο τρόπο (δηλαδή, με την σύνταξη στοιχείου ή με την σύνταξη ιδιοτήτων) είναι συγκριτικά πολύ σπάνια στο windows phone. Ακόμα και όταν είναι δυνατόν και οι δύο μορφές σύνταξης, ένας από τους δύο τρόπους σύνταξης τείνει να είναι ο ποιο κυρίαρχος ή να έχει την ποιο κατάλληλη μορφή για χρήση. Εκτός από τον ορισμό ενός αντικειμένου με τρόπο που ισοδυναμεί με την δημιουργία ενός στιγμιότυπου αυτού του αντικειμένου, υπάρχουν και τεχνικές που μπορούν να χρησιμοποιηθούν στην XAML για να κάνετε αναφορά σε ένα υπάρχον αντικείμενο. Αυτά τα αντικείμενα πρέπει αν ορισθούν είτε σε μια άλλη περιοχή της XAML ή να υ- πάρχουν έμμεσα μέσω κάποιας συμπεριφοράς της πλατφόρμας και των μοντέλων της εφαρμογής ή του προγραμματισμού. -10-

21 2.4 Χάρτες και πλοήγηση στα Windows Phone 8 Στην ενότητα αυτή γίνετε μια σύντομη αναφορά στο control του χάρτη που υπάρχει στο windows phone 8 και που είναι διαφορετικό από το αντίστοιχο control στο windows phone 7.1. Η μόνη περίπτωση που αναγκαστικά θα πρέπει να γίνει χρήση του παλιού map control (Bing map) είναι η περίπτωση μιας εφαρμογής που υπήρχε στο windows phone 7.x και έγινε upgrade στο λειτουργικό window phone 8. Σε οποιαδήποτε άλλη περίπτωση προτείνεται η χρήση του νέου map control καθώς είναι πλήρως αναβαθμισμένο. Επίσης, γίνετε μια σύντομη ανάλυση του πως γίνετε η χρήση αυτού του control και καθώς και το πώς μπορεί το λειτουργικό να παρέχει οδηγίες πλοήγησης στους χρήστες του μέσω Launcher Εμφάνιση του map control Η εμφάνιση του χάρτη ή καλύτερα η προσθήκη του σε μία σελίδα μια εφαρμογής windows phone 8, γίνεται με τρεις τρόπους. Οι δύο πρώτοι είναι κοινοί σε όλα τα άλλα controls ή σχεδόν όλα, του windows phone 8 sdk. Ο πρώτος τρόπος εμφάνισης ενός control, είναι με την χρήση XAML, για την οποία μιλήσαμε στην προηγούμενη ενότητα. Ο δεύτερος τρόπος είναι με την χρήση κώδικα κατά την εκτέλεση της εφαρμογής. Ο τρίτος τρόπος εμφάνισης του χάρτη γίνεται με την χρήση build in launcher. Για την χρήση του χάρτη και στις τρεις περιπτώσεις απαιτείται ενεργοποίηση τις επιλογής ID_CAP_MAP από το αρχείο app manifest στο project της εφαρμογής. Παρακάτω α- ναλύονται αυτοί οι δύο τρόποι ξεχωριστά και φαίνεται ένα σύντομο παράδειγμα εμφάνισης χάρτη. Εμφάνιση χάρτη με την χρήση XAML Το παρακάτω κομμάτι κώδικα χρησιμοποιείτε για την εμφάνιση του χάρτη. <Grid x:name="contentpanel" Grid.Row="1" Margin="12,0,12,0"> <maps:map /> </Grid> Αν η προσθήκη γίνει με χειροκίνητα, θα χρειαστεί να κάνετε και την κατάλληλη δήλωση xmlns στο στοιχείο phone:phoneapplicationpage. xmlns:maps="clr-namespace:microsoft.phone.maps.controls;assembly=microsoft.phone.maps" -11-

22 Αν η προσθήκη του χάρτη γίνει με drag and drop από την εργαλειοθήκη του visual studio, η δήλωση αυτή προστίθεται αυτόματα. Παρατηρούμε ότι η πρόσβαση στον χάρτη γίνεται μέσω της λέξης maps μέσω τις οποίας έγινε και η παραπάνω δήλωση. Η λέξη αυτή θα μπορούσε να είναι οτιδήποτε. Εμφάνιση χάρτη με την χρήση κώδικα Η εμφάνιση ενός χάρτη ή ποιο σωστά η δημιουργία ενός νέου αντικειμένου χάρτη γίνεται πολύ εύκολα με τις παρακάτω δύο γραμμές κώδικα σε C#. Απαραίτητη προϋπόθεση είναι η δήλωση του αντίστοιχου χώρου ονομάτων (namespace) όπου ανήκει η κλάση Map. using Microsoft.Phone.Maps.Controls;... Map MyMap = new Map(); ContentPanel.Children.Add(MyMap); Όπως φαίνεται μετά την δήλωση του χώρου ονομάτων, δημιουργούμε ένα νέο στιγμιότυπο τις κλάσης Map και έπειτα το προσθέτουμε στο ContentPanel της οθόνης που θέλουμε να εμφανιστεί ο χάρτης. Εμφάνιση χάρτη με τη χρήση build in launcher Ο τρόπος αυτός κάνει χρήση της προ εγκατεστημένης εφαρμογής χαρτών του κινητού τηλεφώνου με στόχο την εμφάνιση του χάρτη μέσω της εφαρμογής που αναπτύσσεται. Αν το μόνο που θέλετε να κάνετε είναι η εμφάνιση του χάρτη, τότε αυτός ο τρόπος ενδείκνυται. Κάτι τέτοιο μπορεί να γίνει πολύ εύκολα με την χρήση μιας διεργασίας Maps. Η διεργασία αυτή (maps task) κάνει την δουλειά που αναφέραμε προηγουμένως. Στον παρακάτω Πίνακα 2 φαίνονται οι διεργασίες αυτές που εμφανίζουν ή και διαχειρίζονται ένα χάρτη στο λειτουργικό windows phone 8. Launcher Maps task Maps direction task Map downloader task Map updater task Χρήση Εκκινεί την εφαρμογή των χαρτών Εκκινεί την εφαρμογή των χαρτών και δείχνει οδηγίες Λήψη χαρτών για χρήση χωρίς σύνδεση Ελέγχει αν υπάρχουν νέοι χάρτες για λήψη Πίνακα 2: Map Tasks -12-

23 Ο παρακάτω κώδικας δείχνει πως γίνεται η χρήση αυτών των task στο τηλέφωνο. Αρχικά πρέπει να ορίσουμε τους κατάλληλους χώρους ονομάτων στο αρχείο.cs του κώδικα. using Microsoft.Phone.Tasks; using System.Device.Location; Έπειτα δημιουργούμε ένα στιγμιότυπο τις κλάσης MapsTask και ορίζουμε τις κατάλληλες ιδιότητες σε αυτό. MapsTask mapstask = new MapsTask(); mapstask.searchterm = "coffee"; mapstask.zoomlevel = 2; mapstask.show(); Η ιδιότητα SearchTerm κάνει αναζήτηση της συμβολοσειράς που ορίσαμε σαν τιμή «coffee» μέσα στον χάρτη και σαν αποτέλεσμα αν το ο όρος βρεθεί, τότε το σημείο αυτό κεντράρετε στον χάρτη. Με την εκτέλεση της μεθόδου Show() γίνεται και η εμφάνιση του χάρτη στο κινητό φέρνοντας τα κατάλληλα αποτελέσματα Ορισμός χαρτογραφικής λειτουργίας χάρτη Το control του χάρτη στα windows phone τηλέφωνα παρέχει τέσσερεις διαφορετικούς τρόπους χαρτογράφησης του χάρτη που θα εμφανιστεί. Δηλαδή δίνει την δυνατότητα στον προγραμματιστή να επιλέξει και να ορίσει αυτός πως θα εμφανίζονται τα δεδομένα πάνω στο χάρτη. Επιπλέων η χαρτογραφική λειτουργία ορίζει εκτός από την οθόνη και την μετάφραση των συστημάτων συντεταγμένων από τις συντεταγμένες της οθόνης στο παγκόσμιο σύστημα συντεταγμένων. Για τον ορισμό της χαρτογραφικής λειτουργίας του χάρτη πρέπει αν ορισθεί η ιδιότητα CartographicMode με την ανάλογη τιμή. Η ιδιότητα αυτή δέχεται τιμές από την το MapCartographicMode enumeration. Οι ακόλουθες τιμές, είναι οι τιμές που υποστηρίζονται από την ιδιότητα MapCartographicMode. Οι τιμές αυτές είναι: Road: απεικονίσει τον φυσικό δισδιάστατο χάρτη Aerial: απεικονίζει ένα εναέριο χάρτη Hybrid: απεικονίζει ένα «ανάμεικτο» χάρτη με εναέρια απεικόνιση παρέχοντας επίσης δρόμους και σημάνσεις. Terrain: απεικονίζει φυσικές εικόνες με έμφαση στην ανύψωση καθώς και χαρακτηριστικά νερού όπως βουνά και ποτάμια. -13-

24 Η παρακάτω Eικόνα 4 δείχνει της τέσσερεις αυτές διαφορετικές τιμές της χαρτογραφικής λειτουργίας του χάρτη. Eικόνα 4: Xαρτογραφικές λειτουργίες Ορισμός θέματος χάρτη Άλλο ένα χαρακτηριστικό αυτού του control, είναι ο ορισμός του χρώματος του χάρτη. Δηλαδή ορισμός της νυχτερινής ή όχι λειτουργίας του χάρτη. Ανάλογα με την τιμή που δίνουμε στο στη ιδιότητα ColorMode, ο χάρτης προσαρμόζεται ανάλογα. Οι τιμές που είναι αποδεκτές από αυτή την ιδιότητα είναι οι τιμές του MapColorMode enumeration. Οι τιμές αυτές είναι δύο, Light και Dark. Η παρακάτω Eικόνα 5 δείχνει πως φαίνεται ο χάρτης και στις δύο περιπτώσεις. Eικόνα 5: Χρωματικές λειτουργίες χάρτη -14-

25 2.4.4 Ορισμός πολλαπλών ιδιοτήτων και μεταβάσεις με animation χρησιμοποιώντας προβολές χάρτη Ένα κοινό σενάριο σε εφαρμογές με χάρτη είναι η μετακίνηση από μια περιοχή του χάρτη σε μια άλλη ή η μετακίνηση από μια όψη σε μια άλλη. Μια νέα όψη ορίζεται κάθε φορά που η θέση του χάρτη αλλάζει ως αποτέλεσμα του panning, του ζουμαρίσματος, της περιστροφής καθώς και της ανύψωσης (tilting) του χάρτη. Χρησιμοποιείστε την μέθοδο SetView() για να ορίσετε μια νέα όψη του χάρτη μέσω κώδικα. Στην μέθοδο αυτή μπορούν να συμπεριληφθούν το κέντρο του χάρτη, το επίπεδο του zoom, το heading, το pitch,ένα ορθογώνιο μιας περιοχής του χάρτη (LocationRectangle) καθώς και το είδος της κίνησης που θα χρησιμοποιηθεί για να μεταβεί ο χάρτης από την μία όψη στην άλλη. Παράμετροι της μεθόδου SetView Παρακάτω αναλύονται οι έξι παράμετροι τις μεθόδου SetView για τον ορισμός μια νέας όψης. Center: Η παράμετρος αυτή χρησιμοποιείται για τον ορισμού του κέντρου της νέας όψης. Αναφέρεται ως ένα στιγμιότυπο της κλάσης GeoCoordinate. ZoomLevel: Η παράμετρος αυτή απεικονίζει διαφορετικά επίπεδα πληροφορίας που είναι διαθέσιμα για την περιοχή. Παίρνει τιμές από το 1 έως και το 20 με το 1 να παριστάνει το επίπεδο με την μικρότερη λεπτομέρεια στο χάρτη. Το επίπεδο του zoom εξαρτάται και από την περιοχή. Κάποιες περιοχές μπορεί να δέχονται μεγαλύτερο επίπεδο zoom από κάποιες άλλες. Heading: Η παράμετρος αυτή καθορίσει προς ποια κατεύθυνση κινείται ο χάρτης και φαίνεται πάνω του. Η τιμές που παίρνει αυτή η παράμετρος μετριόνται σε γεωμετρικές μοίρες και είναι μεταξύ 0 και 360 και προσδιορίζουν τις μοίρες περιστροφής του χάρτη. Ένα παράδειγμα αναπαράστασης φαίνεται στην Eικόνα

26 Eικόνα 6: Τιμές παραμέτρου heading boundingrectangle: Η παράμετρος αυτή αναπαριστά ένα αντικείμενο της κλάσης LocationRectangle το οποίο περιέχει το Map control. animationkind: Η παράμετρος αυτή χρησιμοποιείται για τον ορισμός του animation της κίνησης που πρόκειται να γίνει όταν ο χρήστης μεταφέρεται από την μια όψη του χάρτη, στην άλλη. Οι τιμές που μπορεί να πάρει αυτή η παράμετρος είναι αυτές που υπάρχουν στο MapAnimationKind enumeration. Αν η τιμή αυτή είναι None, τότε ο χάρτης απλά μεταπηδά από την μια όψη στην άλλη χωρίς κανένα animation. Ένα παράδειγμα χρήσης αυτής της μεθόδου είναι το παρακάτω: void OnCenterZoom_Click(object sender, EventArgs args) MyMap.Center = new GeoCoordinate( , ); MyMap.ZoomLevel = 18; Στο παραπάνω παράδειγμα βλέπουμε τον ορισμού του κέντρου ενός χάρτη χωρίς την χρήση της μεθόδου SetView(). void OnAnimate_Click(object sender, EventArgs args) MyMap.SetView(new GeoCoordinate( , ), 15, MapAnimationKind.Parabolic); Εδώ βλέπουμε την χρήση της μεθόδου SetView με τρεις παραμέτρους. Πρώτα το σημείο όπου ο χάρτης θα κεντράρει, έπειτα το επίπεδο του zoom και τέλος το είδος του animation με το οποίο θα γίνει η μετάβαση. -16-

27 2.4.5 Οδηγίες πλοήγησης στο windows phone 8 Όπως και σε άλλα λειτουργικά συστήματα κινητών τηλεφώνων έτσι και στο windows phone 8 δίνεται η δυνατότητα στον προγραμματιστή να προσφέρει οδηγίες πλοήγησης από ένα σημείο του χάρτη σε ένα σημείο της επιλογής του χρήστη. Κάτι τέτοιο μπορεί πολύ εύκολα να γίνει με την χρήση launchers όπου στην περίπτωση αυτή ο launcher που κάνει αυτή την δουλεία ονομάζεται MapsDirectionTask. Φυσικά μπορούμε να παρέχουμε τις ίδιες υπηρεσίες ή ίσως και καλύτερες με ένα πιο παραδοσιακό τρόπο δηλαδή την κλήση σε κάποιο web service (π.χ. google maps) για την λήψη οδηγιών. Κάτι τέτοιο προϋποθέτει την ένωση των σημείων που θα λάβουμε από την απάντηση στην κλήση μας στο web service και την προβολή αυτών των σημείων πάνω στο χάρτη. Καταλαβαίνουμε πως κάτι τέτοιο είναι πολύ πιο περίπλοκο από τον προηγούμενο τρόπο αν αυτό που θέλουμε είναι απλά να παρέχουμε οδηγίες στον χρήστη. Εδώ έρχεται να μας λύσει τα χέρια ο παραπάνω launcher (MapsDirectionTask) που εκκινεί την εφαρμογή χαρτών του τηλεφώνου με τις παραμέτρους που του περάσαμε εμείς και εμφανίζει ένα χάρτη με οδηγίες πλοήγησης μέσα από την εφαρμογή μας.στο παράδειγμα που ακολουθεί, αναλύεται ο τρόπος με τον οποίο μπορεί να γίνει προβολή οδηγιών πλοήγησης μέσω του MapsDirectionTask. Αρχικά πρέπει να ορίσουμε τους κατάλληλους χώρους ονομάτων. using Microsoft.Phone.Tasks; using System.Device.Location; Έπειτα δημιουργούμε ένα νέο αντικείμενο τις κλάσης MapsDirectionTask και ορίζουμε τις κατάλληλες ιδιότητες για το επιθυμητό αποτέλεσμ. MapsDirectionsTask mapsdirectionstask = new MapsDirectionsTask(); // You can specify a label and a geocoordinate for the end point. // GeoCoordinate spaceneedlelocation = new GeoCoordinate( , ); // LabeledMapLocation spaceneedlelml = new LabeledMapLocation("Space Needle", spaceneedlelocation); // If you set the geocoordinate parameter to null, the label parameter is used as a search term. LabeledMapLocation spaceneedlelml = new LabeledMapLocation("Space Needle", null); mapsdirectionstask.end = spaceneedlelml; // If mapsdirectionstask.start is not set, the user's current location is used as the start point. mapsdirectionstask.show(); -17-

28 Ο παραπάνω κώδικας παράγει της οδηγίες πλοήγησης προς τον όρο αναζήτησης Space Needle. Αυτό το κάνουμε αν δεν γνωρίζουμε γεωγραφικό στίγμα του προορισμού. Αν το γνωρίζουμε μπορούμε πολύ απλά να το ορίσουμε σας σημείο προορισμού όπως φαίνεται στα σχόλια του παραπάνω κώδικα. 2.5 Εγγραφή και ανάγνωση δεδομένων στο isolated storage Στο κεφάλαιο αυτό θα αναφερθούμε στο isolated storage του λειτουργικού συστήματος windows phone 8. Με απλά λόγια το isolated storage, είναι μια απομονωμένη περιοχή στην μνήμη του τηλεφώνου, εξού και η ονομασία του, που δεν είναι προσβάσιμη από τον χρήστη και χρησιμοποιείται για την αποθήκευση δεδομένων του λειτουργικού συστήματος καθώς και για δεδομένα εφαρμογών αλλά και ρυθμίσεων αυτών. Κάθε εφαρμογή που εγκαθίσταται στο λειτουργικό, αποκτά αμέσως ένα δικό της χώρο στο isolated storage ο οποίος μπορεί να αυξηθεί και να μειωθεί, δυναμικά ανάλογα με τις ανάγκες για χώρο, της εφαρμογής. Κάθε εφαρμογή μπορεί να δει μόνο τον δικό της χώρο στο isolated storage και όχι τον χώρο άλλων εφαρμογών. Κατά την εγκατάσταση μιας ε- φαρμογής, δημιουργείτε αυτόματα ένας φάκελος στο στην μνήμη του τηλεφώνου όπου εκεί μέσα αποθηκεύονται τα δεδομένα της εφαρμογής. Με κάθε κατάργηση μιας εφαρμογής από το τηλέφωνο, διαγράφετε αυτόματα αυτός ο φάκελος που είχε δημιουργηθεί για αυτήν και έτσι απελευθερώνεται και ο χώρος που καταλάμβανε μέχρι τότε η εφαρμογή στην μνήμη. Στις επόμενες υποενότητες θα αναφερθούμε με την εγγραφή και α- νάγνωση δεδομένων στο IsolatedStorageSettings για την αποθήκευση ρυθμίσεων τοπικά καθώς και με αρχεία XML και IsolatedStorageFile IsolatedStorageSettings και ρυθμίσεις εφαρμογών Η κλάση IsolatedStorageSettings είναι η ιδανική κλάση που μπορεί να χρησιμοποιήσει κανείς όταν χρειάζεται να αποθηκεύσει η να ανακτήσει δεδομένα μικρού μεγέθους ως ένα ζεύγος κλειδιού/τιμής. Η κλάση αυτή είναι ένα λεξικό που επιτρέπει στους προγραμματιστές να αποθηκεύουν αντικείμενα οποιουδήποτε τύπου όπως για παράδειγμα, strings. Ένα πιθανό σενάριο χρήσης αυτής της κλάσης είναι όταν μια εφαρμογή ανοίγει και κλείνει με εντολή του χρήστη και πρέπει τότε να φορτωθούν και να αποθηκευτούν -18-

29 ορισμένα δεδομένα αντίστοιχα καθώς και όταν η εφαρμογή είναι απενεργοποιημένη. Η κλάση IsolatedStorageSettings είναι διαθέσιμη για της εκδόσεις του λειτουργικού συστήματος 7.1 μέχρι και την τρέχουσα που είναι η 8. Παρακάτω αναλύετε ο τρόπος αποθήκευσης και ανάκτησης δεδομένων από και προς την κλάση. Προσθήκη ρύθμισης Ένα ζεύγος κλειδιού/τιμής αποτελείτε από ένα μοναδικό κλειδί που λειτουργεί ως αναγνωριστικό και από μια τιμή δεδομένων που βρίσκονται σε ένα πίνακα. Η κλάση IsolatedStorageSettings είναι η κλάση που χρησιμοποιείτε για την αποθήκευση και ανάκτηση δεδομένων ως ζευγάρι κλειδιού/τιμής. Μπορείτε να αποθηκεύσετε οποιοδήποτε σειριοποιήσιμο αντικείμενο (serializable object) στο λεξικό με ένα κλειδί τύπου string. Στο παράδειγμα που ακολουθεί φαίνεται πως προσθέτουμε μια ρύθμιση. IsolatedStorageSettings settings = IsolatedStorageSettings.ApplicationSettings; if (!settings.contains("userdata")) settings.add("userdata", txtinput.text); else settings["userdata"] = txtinput.text; settings.save(); Η λέξη κλειδί εδώ είναι η userdata όπου πρώτα ελέγχουμε αν υπάρχει αυτό το κλειδί στο λεξικό με τις ρυθμίσεις μας. Ο έλεγχος γίνεται με την μέθοδο Contains(). Αν το κλειδί αυτό δεν βρεθεί τότε το προσθέτουμε μέσω της μεθόδου Add() του αντικειμένου settings που είναι ένα στιγμιότυπο της κλάσης IsolatedStorageSettings.Όπου η μεταβλητή txtinput.text, είναι και η τιμή που θα αποθηκευτεί τοπικά με το κλειδί userdata. Αν τώρα το κλειδί που ψάχνουμε υπάρχει ήδη, τότε απλά αλλάζουμε την τιμή του όπως φαίνεται στο παραπάνω κομμάτι κώδικα. Τέλος, αποθηκεύουμε τις αλλαγές που κάναμε με την μέθοδο Save(). Ανάκτηση τιμής ρύθμισης Στο παρακάτω παράδειγμα φαίνεται πως μπορούμε να ανακτήσουμε μια τιμή εφόσον την έχουμε αποθηκεύσει προηγουμένως με κάποιο κλειδί τοπικά στον δίσκο του κινητού τηλεφώνου. Το κομμάτι κώδικα που ακολουθεί παρουσιάζει πως μπορούμε να έ- χουμε άμεση πρόσβαση σε ένα ζεύγος κλειδιού/τιμής που προέρχεται απευθείας από την ιδιότητα ApplicationSettings. -19-

30 // txtdisplay is a TextBlock defined in XAML. txtdisplay.text = "USER DATA: "; if (IsolatedStorageSettings.ApplicationSettings.Contains("userData")) txtdisplay.text += IsolatedStorageSettings.ApplicationSettings["userData"] as string; Στο παραπάνω κομμάτι κώδικα φαίνεται η εξής λειτουργία. Αρχικά το κείμενο ενός textblock control έχει ορισθεί να περιέχει την τιμή USER DATA. Έπειτα γίνεται ο έλεγχος για το αν υπάρχει αποθηκευμένη τιμή με το κλειδί userdata και αν υπάρχει, τότε η τιμή του textblock ανανεώνεται παίρνοντας την νέα τιμή που προέρχεται από τις αποθηκευμένες τιμές τις ιδιότητας ApplicationSettings. Αφαίρεση ρύθμισης Όπως και στα δύο προηγούμενα παραδείγματα, έτσι και σε αυτό θα δείξουμε ακόμα μια λειτουργία που μπορεί να επιτευχθεί μέσω τις κλάσης IsolatedStorageSettings, την α- φαίρεση μιας αποθηκευμένης τιμής. Στο παράδειγμα που ακολουθεί αναλύεται ο απλός αυτός τρόπος χειρισμού της αφαίρεσης μιας ήδη αποθηκευμένης τιμής. if(isolatedstoragesettings.applicationsettings.contains("userdata")) IsolatedStorageSettings.ApplicationSettings.Remove("userData"); Για να αφαιρέσουμε μια αποθηκευμένη τιμή από το IsolatedStorageSettings αρκεί να γνωρίζουμε το κλειδί της. Έστω ότι το κλειδί έχει την ονομασία userdata. Αρχικά ελέγχουμε αν το κλειδί υπάρχει όντος και έπειτα, αν υπάρχει το αφαιρούμε με την βοήθεια της μεθόδου Remove(). Τέλος, η αφαίρεση της τιμής γίνετε βάζοντας ως όρισμα στην μέθοδο Remove(), το κλειδί της τιμής που θέλουμε να αφαιρέσουμε Περιπτώσεις χρήσης του IsolatedStorageFile για XML αρχεία Η διαφορά ανάμεσα στο IsolatedStorageSettings και στο IsolatedStorageFile είναι ότι στο πρώτο όπως αναφέρθηκε και στην προηγούμενη υποενότητα, δίνεται η δυνατότητα αποθήκευσης δεδομένων με την μορφή ενός ζεύγους κλειδιού/τιμής. Με την χρήση του IsolatedStorageFile δίνεται η δυνατότητα αποθήκευσης πραγματικών αρχείων τοπικά στον δίσκο του χρήστη. Με αυτό τον τρόπο μπορούμε να αποθηκεύσουμε αρχεία, φωτογραφίες, τραγούδια, βίντεο καθώς και ότι άλλο θέλουμε με την μορφή που επιθυμούμε. Στην συνέχεια αυτής της ενότητας θα δούμε πως μπορούμε να αποθηκεύσουμε ένα -20-

31 αρχείο τύπου xml τοπικά στον δίσκο καθώς και πως μπορεί να γίνει μετά η ανάγνωση του από το δίσκο. Εγγραφή και ανάγνωση XML αρχείων στο IsolatedStorageFile Η εγγραφή και η ανάγνωση xml αρχείων προς και από τον IsolatedStorageFile, είναι μια κοινή και πολύ συνηθισμένη ενέργεια για πολλές εφαρμογές στα Windows Phone. Για να κάνουμε εγγραφή και ανάγνωση δεδομένων στο δίσκο, χρησιμοποιούμε την κλάση IsolatedStorageFileStream. Η κύρια διαφορά όταν μιλάμε για xml αρχεία, είναι η χρήση του XmlWriter. Θα χρησιμοποιήσουμε επίσης την κλάση XmlSerializer η οποία μας επιτρέπει να κάνουμε serialize και deserialize αντικείμενα σε και από xml έγγραφα. Είναι σημαντικό όταν δουλεύουμε με αρχεία να χρησιμοποιούμε την έκφραση Using γιατί παρέχει ένα πιο βολικό τρόπο σύνταξης και υπόσχετε την ορθή χρήση των IDisposable αντικειμένων. Στο παράδειγμα που ακολουθεί φαίνεται η υλοποίηση της παραπάνω περίπτωσης χρήσης. Αρχικά απαιτείται να υλοποιήσουμε μια κλάση με βάση την οποία θα γίνουν τα αντικείμενα serialize και deserialize για να εγγραφούν και να αναγνωστούν έπειτα από τον δίσκο. Ακολουθεί η δήλωση της κλάσης Person που περιέχει το όνομα, το επίθετο και την ηλικία ενός ατόμου. public class Person string firstname; string lastname; int age; public string FirstName get return firstname; set firstname = value; public string LastName get return lastname; set lastname = value; public int Age get return age; set age = value; Στην συνέχεια, δημιουργούμε μια μέθοδος που θα γεμίσει την λίστα προς εγγραφή στο δίσκο, με αντικείμενα τύπου Person. Η υλοποίηση της φαίνεται στο παρακάτω στιγμιότυπο κώδικα. -21-

32 private List<Person> GeneratePersonData() List<Person> data = new List<Person>(); data.add(new Person() FirstName = "Kate", LastName = "Brown", Age = 25 ); data.add(new Person() FirstName = "Tom", LastName = "Stone", Age = 63 ); data.add(new Person() FirstName = "Michael", LastName = "Liberty", Age = 37 ); return data; Στην συνέχεια δημιουργούμε ένα αρχείο xml και έπειτα γράφουμε τα δεδομένα της παραπάνω λίστας, στο αρχείο. Ο κώδικας που ακολουθεί δείχνει πως μπορεί να υλοποιηθεί η δημιουργία και η εγγραφή δεομένων ενός xml αρχείου. XmlWriterSettings xmlwritersettings = new XmlWriterSettings(); xmlwritersettings.indent = true; using (IsolatedStorageFile myisolatedstorage = IsolatedStorageFile.GetUserStoreForApplication()) using (IsolatedStorageFileStream stream = myisolatedstorage.openfile("people.xml", File- Mode.Create)) XmlSerializer serializer = new XmlSerializer(typeof(List<Person>)); using (XmlWriter xmlwriter = XmlWriter.Create(stream, xmlwritersettings)) serializer.serialize(xmlwriter, GeneratePersonData()); Μετά την εκτέλεση του παραπάνω κώδικα, το αρχείο xml έχει δημιουργηθεί και περιέχει τα δεδομένα που τις λίστας που γέμισε πριν και είναι τύπου Person. Δηλαδή κάθε εγγραφή αποτελείτε από το όνομα, το επίθετο και την ηλικία ενός ατόμου όπως ακριβώς περιγράφει η κλάση Person που υλοποιήσαμε αρχικά. Τώρα, εφόσον το αρχείο μας έχει δημιουργηθεί και υπάρχει στο δίσκο τοπικά στην συσκευή, μπορούμε να το διαβάσουμε και να εξάγουμε τα δεδομένα από το αρχείο xml. Το κομμάτι κώδικα που ακολουθεί παρουσιάζει την ανάγνωση των δεδομένων του αρχείου και τα εμφανίζει σε ένα ListBox. try using (IsolatedStorageFile myisolatedstorage = IsolatedStorageFile.GetUserStoreForApplication()) using(isolatedstoragefilestream stream = myisolatedstorage.openfile("people.xml", File- Mode.Open)) XmlSerializer serializer = new XmlSerializer(typeof(List<Person>)); List<Person> data = (List<Person>)serializer.Deserialize(stream); this.listbox.itemssource = data; catch -22-

33 //add some code here Ο κώδικα xaml του listbox που είναι υπεύθυνο για τη παρουσίαση των δεομένων είναι ο παρακάτω. Παρατηρήστε πως τα δεδομένα γίνονται binding στο datatemplate του listbox. <ListBox x:name="listbox"> <ListBox.ItemTemplate> <DataTemplate> <StackPanel Margin="10" > <TextBlock Text="Binding FirstName"/> <TextBlock Text="Binding LastName"/> <TextBlock Text="Binding Age"/> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox> -23-

34

35 3 Περιγραφή προβλήματος και fuelgr API. Στο κεφάλαιο αυτό θα μηλίσουμε για την ουσία του προβλήματος και ποια είναι η λύση που η εφαρμογή fuelgr έρχεται αν δώσει καθώς και θα γίνει μια σύντομη περιγραφή στο fuelgr API από το οποίο η εφαρμογή αντλεί τα δεδομένα της. 3.1 Περιγραφή προβλήματος και η λύση του fuelgr Μέχρι πριν λίγο καιρό, στην αγορά των Windows Phone εφαρμογών και ακόμα καλύτερα στην Ελληνική αγορά, δεν υπήρχαν αξιόλογες εφαρμογες για την παρακολούθηση τιμών υγρών καυσίμων για τα πρατήρια της Ελληνικής αγοράς. Υπάρχουν εφαρμογές που απλά εμφανίζουν με ωραίο τρόπο τις τιμές των πρατηρίων όπως αυτές υπάρχουν στο υπουργείο ανάπτυξης και ανταγωνιστικώτητας. Καμία σχεδόν εφαρμογή δεν έδειχνε τα πρατήρια με τέτοιο τρόπο ώστε να μπορεί ο χρήστης της να καταλάβει γρήγορα και εύκολα, ποια πρατήρια είναι δίπλα του, ποια είναι τα ποιο φθηνά και πως μπορεί να πάει εκεί. Καμία εφαρμογή δεν είχε καταφέρει να το πετύχει αυτό διότι απαιτείται η κατάλληλη υποδομή. Μια ακόμα έλλειψη σε αυτές τις εφαρμογές ήταν ότι δεν έδιναν την δυνατότητα στο χρήστη να κάνει αναζήτηση πρατηρίων με βάση την ημερομηνία καταχώρισης της τιμής τους στο υπουργείο. Άλλες εφαρμογές δεν έδιναν ούτε την δυνατότητα πλοήγησης από την θέση του χρήστη προς το πρατήριο, κάτι που μπορεί να θεωρηθεί μια από τις βασικές λειτουργίες αυτών των εφαρμογών. Ένα ακόμα χαρακτηριστικό ζωτικής σημασίας θα έλεγε κανείς για μια εφαρμογή παρακολούθησης τιμών υγρών καυσίμων, είναι η δυνατότητα φιλτραρίσματος των αποτελεσμάτων που εμφανίζει στο χρήστη σύμφωνα με τις προτιμήσεις του. Μέσω του υπουργείου ανάπτυξης και ανταγωνιστικότητας δίνεται η δυνατότητα στις εφαρμογές που βασίζονται αποκλειστικά σε αυτό, να προσφέρουν ένα ικανοποιητικό επίπεδο φιλτραρίσματος με βάση την γεωγραφική περιοχή αναζήτησης και τον τύπο καυσίμου που επιθυμεί ο χρήστης να δει. Έπειτα δεν παρέχεται από το υπουργείο η γεωγραφική θέση του πρατηρίου πάνω στο χάρτη παρά μόνο η διεύθυνση του με αποτέλεσμα να δημιουργεί σοβαρό πρόβλημα α- -25-

36 ξιοπιστίας σε εφαρμογές που προσπαθούν να δείξουν την θέση του πρατηρίου πάνω σε χάρτη. Όσες εφαρμογές υπάρχουν που δίνουν αυτή την δυνατότητα στο χρήστη, το κάνουν μέσω Geocoding που είναι μια διαδικασία εύρεσης γεωγραφικών συντεταγμένων από μια διεύθυνση μιας οδού (βλέπε αναζήτηση σε google maps). Η διαδικασία αυτή μπορεί πολλές φορές να αποτύχει δίνοντας λάθος στίγμα για την συγκεκριμένη διεύθυνση και ιδικά για διευθύνσεις εκτός πόλεων και κατοικημένων περιοχών. Αυτά και διάφορα άλλα προβλήματα έρχεται να καλύψει η εφαρμογή fuel που βασίζεται στο fuel API από όπου και αντλεί τα δεδομένα της. Μια σύντομη περιγραφή για το API θα γίνει στην επόμενη υποενότητα. Η εφαρμογή fuelgr για να καταφέρει να λύσει αυτά τα προβλήματα και να παρέχει στον χρήστη της μια διαφορετική λύση στο πρόβλημα αναζήτησης πρατηρίων και παρακολούθησης των τιμών, του παρέχει μια σειρά από χαρακτηριστικά. Αυξάνει το επίπεδο φιλτραρίσματος των δεδομένων που βλέπει ο χρήστης μέσω της εφαρμογής δίνοντας την δυνατότητα επιπλέων επιλογής εταιρίας διανομής καυσίμων και επιλογή ημερομηνίας καταχώρισης τιμής έτσι ώστε ο χρήστης να μπορεί να δει και παλαιότερες τιμές εκτός από τις τελευταία καταχωρημένες. Το πρόβλημα με τις διευθύνσεις και τα γεωγραφικά στίγματα των πρατηρίων δεν υφίσταται πια εφόσον κάθε πρατήριο ελέγχετε με το χέρι και με την χρήση του google street view, για την ε- νημέρωση της θέσης του στον server του fuelgr. Οι τιμές των πρατηρίων χρωματίζονται ανάλογα με το αν είναι πιο υψηλές από τον μέσο όρο ή πιο χαμηλές έτσι ώστε ο χρήστης να καταλαβαίνει με την πρώτη ματιά πάνω στο χάρτη, πιο πρατήριο είναι το ποιο φθηνό. Η απόσταση των πρατηρίων από την θέση του χρήστη λαμβάνεται μέσω του google maps api για μεγαλύτερη αξιοπιστία και προβάλετε στο χρήστη μέσα από τις πληροφορίες του εκάστοτε πρατηρίου. Τέλος, η εφαρμογής fuelgr για windows phone δίνει την δυνατότητα στο χρήστη να επιλέξει μέσω από διάφορες προβολές χάρτη, δυνατότητα προβολής εικόνας πρατηρίου μέσω του google street view image api καθώς και την δυνατότητα αποστολής υπόδειξης λάθους θέσης ενός πρατηρίου πάνω στο χάρτη, στο server του fuelgr. Αυτά και άλλα πολλά χαρακτηριστικά περιέχονται στην εφαρμογή ελπίζοντας να παρέχουν στον χρήστη της μια διαφορετική εμπειρία χρήσης. 3.2 FuelGR API Το fuelgr api, είναι η καρδιά της εφαρμογής fuelgr. Μέσω αυτού η εφαρμογή τροφοδοτείται με δεδομένα και επικοινωνεί με τον server για την αποστολή των διορθώσεων -26-

37 από τους χρήστες της. Το api έχει αναπτυχθεί με την γλώσσα προγραμματισμού php και αποτελείτε από δύο κύρια μέρη. Το πρώτο κομμάτι είναι αυτό που σχετίζεται με την παροχή δεδομένων στην εφαρμογή και το δεύτερο κομμάτι είναι αυτό είναι εκείνο που αναλαμβάνει την λήψη των διορθώσεων που στέλνουν οι χρήστες της εφαρμογής fuelgr προς τον server του fuelgr. Σε γενικές γραμμές το βασίζετε σε κλήσεις τύπου GET όπου ο χρήστης περνάει τις κατάλληλες παραμέτρους στο url μέσω του οποίου κάνει την κλήση προς τον server ο οποίος του επιστρέφει το αποτελέσματα σε μορφή XML τα οποία η εφαρμογή με την σειρά της διαβάζει και παρουσιάζει ανάλογα τα δεδομένα στο χρήστη. Παράλληλα το api υποστηρίζει και κλήσεις https για την μέγιστη δυνατή εξασφάλιση των δεδομένων της. Η πρόσβαση στο fuelgr api παρέχετε μέσω του της ηλεκτρονικής διεύθυνσης Παρακάτω θα αναφερθούμε στην δομή του xml response που επιστρέφει ο server, έπειτα από κάποια κλήση. Δομή του fuelgr API Σε αυτή την υποενότητα θα αναφερθούμε στην δομή του αρχείου xml που επιστρέφετε από στον fuelgr server όταν κάποιος κάνει μια κλήση προς αυτόν. Για να λάβει κάποιος μια απάντηση από τον server για τις τιμές των πρατηρίων μια συγκεκριμένης περιοχής, είναι απαραίτητο να περάσει κάποιες παραμέτρους στο link της κλήσης που θα κάνει. Οι βασικοί αυτοί παράμετροι είναι 4, και είναι οι εταιρίες διανομής του καυσίμου, ο τύπος καυσίμου, η περιοχή για την οποία επιθυμεί να γίνει αναζήτηση πρατηρίων και τέλος οι μέρες παλαιότητας των τιμών. Η τελευταία παράμετρος αναφέρετε στο πόσο παλιές επιτρέπετε να είναι οι τιμές που έχουν καταχωρηθεί από τους πρατηριούχους, στα αποτελέσματα που θα επιστρέψει η κλήση. Παρακάτω φαίνεται η δομή της απάντησης του fuelgr server σε μορφή xml, όταν γίνεται μια κλήση προς αυτόν. <gss msg="" qdate=" :29:00" munid=" " mun="λαρισασ" cnt="λαρισησ"> <gs id="441" ddid=" " dd="δ.δ. Λαρίσης"> <ac>rooftop</ac> <lt> </lt> <lg> </lg> <pr>1.649</pr> <br id="6">avin</br> <ft id="1">αμόλυβδη 95</ft> <ad>βολου ΛΑΡΙΣΑ</ad> <ow>μακραιων Α.Ε. ΥΠΟΚ/ΜΑ Νο 53</ow> <dt> :19:35</dt> </gs> <gs id="8996" ddid=" " dd="δ.δ. Λαρίσης"> <ac>rooftop</ac> <lt> </lt> <lg> </lg> <pr>1.649</pr> <br id="2">jetoil</br> <ft id="1">αμόλυβδη 95</ft> <ad>βολου ΛΑΡΙΣΑ</ad> <ow>μπλιοσ ΑΠΟΣΤΟΛΟΣ</ow> -27-

38 <dt> :53:20</dt> </gs> </gss> Όπως βλέπουμε στο παραπάνω παράδειγμα, στο xml αρχείο υπάρχει όλη η πληροφορία γύρω από ένα πρατήριο συγκεντρωμένη. Οι ονομασίες των ετικετών xml, είναι αρκετά ξεκάθαρες για το τι είδους πληροφορία εσωκλείουν. Είναι γενικά ένα αρχείο σε μορφή xml που είναι εύκολο στην κατανόηση και στην χρήση του από τρίτους. -28-

39 4 Υλοποίηση εφαρμογής fuelgr Στο κεφάλαιο αυτό θα δούμε αποκλειστικά την υλοποίηση της εφαρμογής fuelgr για το λειτουργικό σύστημα windows phone 8 και 8.1. Η εφαρμογή αυτή έχει αναπτυχθεί σε γλώσσα C# και με την χρήση του windows phone 8 sdk στο περιβάλλον ανάπτυξης Microsoft Visual Studio Θα παρουσιάσουμε και θα αναλύσουμε τα κύρια κομμάτια της εφαρμογής όπως για παράδειγμα τον μηχανισμό λήψης και εμφάνισης των αποτελεσμάτων καθώς και τον μηχανισμό διόρθωσης της θέσης των πρατηρίων. Η εφαρμογή βασίζεται κυρίως στο fuelgr api αλλά και σε δευτερεύοντα apis όπως για παράδειγμα το Google Maps api για την λήψη χιλιομετρικών αποστάσεων ανάμεσα σε δύο περιοχές. Η δομή και η λειτουργία της εφαρμογής αναλύονται εκτενέστερα στις επόμενες υποενότητες. 4.1 Σχεδιαστικές επιλογές εφαρμογής Ένα σημαντικό κομμάτι σε κάθε εφαρμογή, είτε αυτή είναι mobile είτε είναι desktop, είναι η σχεδίαση και η εμφάνιση του UI της. Καλός ή κακός είναι το πρώτο πράγμα που προσελκύει έναν χρήστη (ειδικά σε mobile εφαρμογές ) να δει και να δοκιμάσει την ε- φαρμογή παίζοντας σημαντικό ρόλο στον αν αυτό ο χρήστης παραμείνει και χρησιμοποιήσει την εφαρμογή εκ νέου. Λαμβάνοντας λοιπόν υπόψη αυτό το γεγονός, η εφαρμογή fuelgr έχει σχεδιαστεί με τέτοιο τρόπο έτσι ώστε να είναι πάνω από όλα εύχρηστη για τον χρήστη της αλλά και να παρέχει μια καλή αισθητική. Η εφαρμογή αυτή ( fuelgr ) μιας και είναι για το λειτουργικό σύστημα windows phone, ακολουθεί τα πρότυπα σχεδίασης της πλατφόρμας. Έχει σχεδιαστεί με τέτοιο τρόπο έτσι ώστε να παραπέμπει στο Modern UI των windows phone που έχει ως αρχή το απλό flat design με έμφαση στην καθαρότητα του κειμένου ακόμα και όταν αυτό είναι μικρού μεγέθους. Ένα παράδειγμα αυτού του τρόπου σχεδίασης βλέπουμε στην Eικόνα

40 Eικόνα 7: Modern UI windows phone 8 Η παραπάνω εικόνα δείχνει τα εικονίδια των εφαρμογών σε ένα windows phone και στην αμέσως επόμενη εφαρμογή Eικόνα 8 βλέπουμε ένα παράδειγμα σχεδίασης εφαρμογής που ακολουθεί το Modern UI στιλ. Eικόνα 8: Storage Check Windows Phone 8 Application Για τους παραπάνω σχεδιαστικούς λόγους, η εφαρμογή fuelgr έχει δομηθεί με τέτοιο τρόπο έτσι ώστε να είναι user friendly όπως αναφέραμε και ποιο πάνω και η πληροφορία που παρουσιάζει να είναι όσο το δυνατόν πιο ξεκάθαρη για τον χρήστη. 4.2 Σύντομος οδηγός χρήσης της εφαρμογής Αρχικά, με την πρώτη εκτέλεση της εφαρμογής, ζητείται από την χρήστη να εισάγει τα κατάλληλα για αυτόν, κριτήρια αναζήτησης όπως αυτά έχουν περιγραφεί σε προηγούμενο κεφάλαιο μεταβαίνοντας τον στην σελίδα ρυθμίσεων της εφαρμογής, η οποία φαίνεται παρακάτω στην Eικόνα

41 Eικόνα 9: Οθόνες ρυθμίσεων και κριτηρίων Στη παραπάνω εικόνα βλέπουμε τις δύο κύριες σελίδες, την σελίδα των κριτηρίων και την σελίδα ρυθμίσεων του κύριου χάρτη της εφαρμογής. Μέσω τις πρώτης σελίδας ο χρήστης είναι σε θέση να επιλέξει τύπο καυσίμου, εταιρία (ες) διανομής καυσίμου, την παλαιότητας των καταχωρημένων τιμών των πρατηρίων και τέλος την περιοχή αναζήτησης μέσα από δύο πεδία, τον νομό και τον δήμο όπου επιθυμεί να γίνει η αναζήτηση. Εφόσον επιλεγούν αυτά τα κριτήρια, ο χρήστης είναι σε θέση να δει τα αποτελέσματα της αναζήτησης που μόλις έκανε, με το πάτημα του πίσω κουμπιού στο τηλέφωνό του. Αμέσως γίνεται η μετάβασή του στην κύρια σελίδα της εφαρμογής. Η οθόνη αυτή αποτελείτε κυρίως από δύο σελίδες. Η πρώτη σελίδα είναι αυτή που βλέπει αμέσως ο χρήστης έπειτα από την επιστροφή του από την σελίδα των ρυθμίσεων και όπου και απεικονίζονται τα αποτελέσματα της αναζήτησης με πινέζες πάνω στον κύριο χάρτη της εφαρμογής. Η δεύτερη τώρα σελίδα περιέχει στην ουσία μια λίστα όπου προβάλλονται με ιδιαίτερο τρόπο, τα πρατήρια που δεν έχουν καθόλου γεωγραφικό στίγμα ή η ακρίβεια των γεωγραφικών συντεταγμένων τους, είναι πολύ μικρή. Αυτά είναι και τα πρατήρια για το οποία ο χρήστης μπορεί να αποστείλει μια πρόταση για την γεωγραφική τους θέση, στον server του fuelgr από όπου η πρόταση αυτή θα ελεγχθεί και θα οριστικοποιηθεί μέσα στις επόμενες μέρες ( ίσως και ώρες ) από τους διαχειριστές του fuelgr. Στην Eικόνα 10 βλέπουμε την κύρια οθόνη της εφαρμογής όπου απεικονίζονται τα πρατήρια ως πινέζες πάνω στο χάρτη. -31-

42 Eικόνα 10: Κύρια οθόνη εφαρμογής Στο πάνω μέρος της οθόνης ο χρήστης μπορεί να δει των αριθμό των πρατηρίων που εμφανίζονται στον χάρτη και έπειτα την ελάχιστη, τον μέσο όρο και την μέγιστη τιμή των πρατηρίων της περιοχής, από τα αριστερά προς τα δεξιά. Παρατηρήστε πως οι τιμές των πρατηρίων χρωματίζονται ανάλογα με το αν είναι μεγαλύτερες από τον μέσο όρο ή μικρότερες με κόκκινο και πράσινο αντιστοίχως. Με μπλε εμφανίζονται οι τιμές που είναι κοντά στον μέσο όρο της περιοχής. Στην μέση της οθόνης και δεξιά, υπάρχει ένα μπλε εικονίδιο με ένα βέλος που δείχνει προς τα δεξιά και αυτό, το οποίο εμφανίζεται όταν υπάρχουν περισσότερα πρατήρια στην περιοχή αλλά δεν εμφανίζονται στο χάρτη λόγο έλλειψης γεωγραφικού στίγματος ή μικρής ακρίβειας του στίγματος. Πιέζοντας αυτό το εικονίδιο ο χρήστης μεταβαίνει στην δεύτερη σελίδα της κύριας οθόνης της εφαρμογής, δηλαδή την σελίδα με την λίστα των πρατηρίων εκτός χάρτη. Στο κάτω μέρος της οθόνης, υπάρχει η σχετική application bar από όπου ο χρήστης έχει πρόσβαση σε διάφορες λειτουργίες της εφαρμογής. Σε αυτή την μπάρα υπάρχουν 4 βασικά κουμπιά. Πρώτο στην σειρά είναι το κουμπί με την πινέζα όπου πατώντας το, η οθόνη αλλάζει και κεντράρετε στην τρέχουσα θέση του χρήστης, βάση του GPS της συσκευής. Η θέση του χρήστη πάνω στον χάρτη, φαίνεται με την κόκκινη πινέζα. Δεύτερο σε σειρά είναι το εικονίδιο με το βέλος προς τα κάτω και το σύμβολο του ευρώ όπου με το πάτημα πάνω σε αυτό, εμφανίζεται στον χρήστη μια λίστα με τα τρία (3) ποιο φθηνά πρατήρια της περιοχής σε αύξουσα σειρά. Δίπλα ακριβώς από αυτό το κουμπί και τρίτο στην σειρά, βρίσκεται το κουμπί με το εικονίδιο της λίστας. Αυτό το κουμπί εμφανίζει στον χρήστη το υπόμνημα της εφαρμογής. Τέταρτο έρχεται το κουμπί με το εικονίδιο του δορυφόρου όπου παρέχει μια πολύ βασική λειτουργία της εφαρμογής στον χρήστη, αυτή της διόρθωσης της θέσης ενός πρατηρίου. Η λειτουργία αυτή θα αναλυθεί εκτενέ- -32-

43 στερα στις επόμενες ενότητες. Τα κουμπιά και μερικές από τις λειτουργίες, φαίνονται στις παρακάτω εικόνες. Eικόνα 13: Τρέχουσα θέση Eικόνα 11: Φθηνότερα πρατήρια Eικόνα 12: Υπόμνημα Όσον αφορά την λίστα των φθηνότερων πρατηρίων, ο χρήστης μπορεί να επιλέξει το πρατήριο που επιθυμεί από την λίστα και τότε αυτόματα ο κύριος χάρτης της εφαρμογής αυξάνει το επίπεδο του zoom του και κεντράρετε στην θέση του πρατηρίου που μόλις επίλεξε ο χρήστης. Όπως για κάθε πρατήριο πάνω στο χάρτη ( πινέζα στην περίπτωση μας ), έτσι και στην περίπτωση των φθηνότερων πρατηρίων ο χρήστης μπορεί να επιλέξει ένα πρατήριο ( πινέζα ) πάνω στο χάρτη, για να δει περισσότερες πληροφορίες για αυτό. Με το πάτημα της πινέζας που επιθυμεί ο χρήστης, εμφανίζετε από την κάτω πλευρά της εφαρμογής προς τα επάνω και ως την μέση της οθόνης ένα πλαίσιο που παρουσιάζει στον χρήστη τις επιπλέων πληροφορίες. Οι πληροφορίες αυτές είναι: Λογότυπο εταιρίας διανομής καυσίμου Τύπος καυσίμου (π.χ. Αμόλυβδη 95 οκτανίων, Υγραέριο, Diesel κίνησης, κ.λπ.) Τιμή καυσίμου ανά λίτρο καυσίμου Ονομασία πρατηριούχου Ημερομηνία καταχώρισης τιμής από τον πρατηριούχο Ακρίβεια συντεταγμένων πρατηρίου με χαρακτηρισμό από άριστη έως χωρίς στίγμα. -33-

44 Χιλιομετρική απόσταση ανάμεσα στην θέση του χρήστη και το πρατήριο μέσω Google Maps api για μεγαλύτερη ακρίβεια Eικόνα 14: Πλαίσιο πληροφοριών συγκεκριμένου πρατηρίου Ακριβώς κάτω από αυτό το πλαίσιο υπάρχει η application bar στην οποία όμως τώρα τα κουμπιά της έχουν αλλάξει για να προσαρμοστεί στις ανάγκες του συγκεκριμένου use case ( περίπτωσης χρήσης ). Παρατηρούμε πως έχουν αλλάξει τελείως τα κουμπιά και έχουν προστεθεί νέα στην θέση των προηγούμενων, που προσφέρουν νέες δυνατότητες. Το πρώτο κουμπί από τα αριστερά προσφέρει την δυνατότητα πλοήγησης από την τοποθεσία του χρήστη, στην τοποθεσία του επιλεγμένου πρατηρίου. Πατώντας το, αρχίζει να λειτουργεί η ενσωματωμένη εφαρμογή χαρτών που έχουν όλα τα windows phone και γίνεται αναζήτηση της διαδρομής και προβάλετε στον χρήστη. Αν υπάρχει στο τηλέφωνο εγκατεστημένη η εφαρμογής Here Drive ( συνήθως σε Nokia Lumia συσκευές ), τότε εκκινείτε αυτή αντί της ενσωματωμένης εφαρμογής χαρτών, παρέχοντας καλύτερη εμπειρία χρήσης. Στην Eικόνα 16 και στην Eικόνα 15, φαίνονται οι διαφορετικές οθόνες πλοήγησης, της ενσωματωμένης εφαρμογής και της εφαρμογής Here Drive από τα αριστερά προς τα δεξιά, αντίστοιχα. -34-

45 Eικόνα 16: Ενσωματωμένη εφαρμογή πλοήγησης Eικόνα 15: Here Drive Το αμέσως επόμενο κουμπί στην application bar, είναι το κουμπί ορισμού αγαπημένου πρατηρίου. Είναι το κουμπί με το εικονίδιο τις καρδιάς με το σήμα + ή ανάλογα με το αν το πρατήριο είναι ήδη στα αγαπημένα ή πρόκειται τώρα να ορισθεί ως αγαπημένο. Όταν ένα πρατήριο γίνετε αγαπημένο, τότε αυτόματα εμφανίζετε ένα μικρό εικονίδιο σε σχήμα αστέρα πάνω από την συγκεκριμένη πινέζα στο χάρτη. Εάν το πρατήριου βγει από τα αγαπημένα, τότε το εικονίδιο εξαφανίζεται αυτόματα. Η παρακάτω Eικόνα 17 δείχνει την σχετική λειτουργία της εφαρμογής. Eικόνα 17: Προβολή αγαπημένου πρατηρίου -35-

46 Δίπλα από το κουμπί ορισμού αγαπημένου πρατηρίου, υπάρχει το κουμπί με το εικονίδιο της ασπίδας με θαυμαστικό. Αυτό το κουμπί παρέχει την εξής λειτουργία στον χρήστη. Υπάρχει η πιθανότητα ( μικρή ) ένα πρατήριο που να μην είναι ακριβώς στην σωστή θέση του ακόμα και αν η ακρίβεια των συντεταγμένων του είναι άριστη. Αυτό μπορεί να συμβεί λόγο αδυναμίας εύρεσης της θέσης με τόσο μεγάλη ακρίβεια από τους διαχειριστές του fuelgr. Μπορεί όμως ένα χρήστης να γνωρίζει την ακριβή θέση του πρατηρίου και έτσι με το πάτημα αυτού του κουμπιού, του δίνεται η δυνατότητα να στείλει μια ειδοποίηση στον server του fuelgr συνεπώς και στους διαχειριστές του, ότι αυτό το πρατήριο είναι σε λάθος θέση. Οι διαχειριστές αμέσως μόλις λάβουν μια τέτοια ειδοποίηση, θα ελέγξουν το πρατήριο και θα το διορθώσουν. Ένα εξίσου σημαντικό χαρακτηριστικό αυτής της εφαρμογής είναι ότι φέρνει την εικόνα του πρατηρίου στο τηλέφωνο του χρήστη μέσω της υπηρεσίας Google Street View μόνο όμως για τια πρατήρια που η ακρίβεια των συντεταγμένων τους είναι άριστη. Αυτό επιτυγχάνεται με το πάτημα του τέταρτου και τελευταίου κουμπιού πάνω στην application bar το οποίο εμφανίζεται με το εικονίδιο του street view της Google. Eικόνα 18: Εικόνα πρατηρίου Eικόνα 19: Εικόνα πρατηρίου από διαφορετική οπτική γωνία και επίπεδο zoom Παραπάνω, στην Eικόνα 18 και στης Eικόνα 19 φαίνεται η σχετική οθόνη της εφαρμογής που δείχνει στο χρήστη την εικόνα του πρατηρίου. Υπάρχουν και τα ανάλογο κουμπιά πλοήγησης με τα οποία ο χρήστης μπορεί να δει το πρατήριο από διαφορετικές οπτικές γωνίες καθώς και σε διαφορετικά επίπεδα zoom. Όπως αναφέρθηκε και προη- -36-

47 γουμένως, υπάρχει και η προβολή των πρατηρίων σε λίστα, για τα πρατήρια τα οποία δεν διαθέτουν γεωγραφικό στίγμα ή το στίγμα του είναι μη ακριβές. Η πρόσβαση σε αυτή την οθόνη της εφαρμογής επιτυγχάνετε με τον τρόπο που προαναφέρθηκε. Στη παρακάτω εικόνα (Εικόνα 22) βλέπουμε αυτή την λίστα των πρατηρίων. Εικόνα 22: Λίστα πρατηρίων χωρίς στίγμα Με την επιλογή ενός από τα πρατήρια της λίστας, δίνεται η δυνατότητα στον χρήστη ορίσει ή να διορθώσει την θέση του συγκεκριμένου πρατηρίου. Αυτό επιτυγχάνετε με την μετάβαση του χρήστη στην οθόνη διόρθωσης θέσης πρατηρίου που ήδη αναφέραμε πιο προηγουμένως. Η οθόνη αυτή αποτελεί βασικό κομμάτι της εφαρμογής καθώς και ο μηχανισμός αποστολής διόρθωσης στον server του fuelgr που συνεργάζονται για την υλοποίηση αυτής της λειτουργίας της εφαρμογής. Ο μηχανισμός αυτός θα αναλυθεί ε- κτενέστερα στο επόμενο κεφάλαιο μαζί με όλους τους βασικούς μηχανισμούς της ε- φαρμογής καθώς θα γίνει η ανάλυση του κώδικα που τους υλοποιεί. Όπως φαίνεται στην Eικόνα 20 και στην Eικόνα 21, η οθόνη διόρθωσης της γεωγραφικής θέσης ενός πρατηρίου αποτελείτε από: τον χάρτη διόρθωσης την scrollable πινέζα ορισμού νέας θέσης του πρατηρίου την λίστα με τα πρατήρια προς διόρθωση της θέσης τους τα κουμπιά αποστολής διόρθωσης, zoom και αλλαγής προβολής του χάρτη -37-