Πώς να δημιουργήσετε ένα γραφικό στοιχείο

click fraud protection
...

Αρχιτεκτονική Widget

Τα γραφικά στοιχεία είναι αυτόνομες εφαρμογές που μπορούν συνήθως να βρεθούν ενσωματωμένες σε ιστότοπους τρίτων, όπως ρολόγια, δείκτες δημοπρασιών, αντίστροφες μετρήσεις συμβάντων κ.λπ. Τα γραφικά στοιχεία είναι επομένως μίνι εφαρμογές που αναπτύσσονται εύκολα, αναπτύσσονται γρήγορα και χρησιμοποιούνται για την αξιοποίηση προηγμένων τεχνολογιών προσθέτοντας λειτουργικότητα σε υπάρχουσες εφαρμογές. Εάν μπορείτε να δημιουργήσετε μια ιστοσελίδα, τότε ξέρετε πώς να δημιουργήσετε και να αναπτύξετε ένα γραφικό στοιχείο, καθώς χρησιμοποιούν την ίδια τεχνολογία JavaScript, DHTML και CSS. Τα γραφικά στοιχεία μπορούν να είναι είτε αξεσουάρ, γραφικά στοιχεία εφαρμογής ή πληροφορίες. Τα αξεσουάρ widget είναι αυτόνομα που λειτουργούν ανεξάρτητα από το Διαδίκτυο ή μια εφαρμογή. Τα γραφικά στοιχεία εφαρμογών συσχετίζονται πλήρως με μια εφαρμογή, ενώ τα γραφικά στοιχεία πληροφοριών λειτουργούν με δεδομένα Διαδικτύου.

Η αρχιτεκτονική

Βήμα 1

Ενεργοποιήστε το πρόγραμμα επεξεργασίας κειμένου και δημιουργήστε ένα αρχείο HTML. Το αρχείο HTML θα πρέπει να συμμορφώνεται με το πρότυπο XHTML 1.0 και παραπάνω προκειμένου να συμμορφώνεται με τις τρέχουσες βέλτιστες πρακτικές προτύπων Ιστού. Ένας απλός κώδικας XHTML θα μοιάζει με αυτό:

Το βίντεο της ημέρας

Widgets

Βήμα 2

Χρησιμοποιήστε το ετικέτα για να εκτελέσετε πλήρη απόδοση 2D για το γραφικό στοιχείο, εάν απαιτείται. Το χαρακτηριστικό "composite" είναι μια άλλη προσθήκη στην ετικέτα που επιτρέπει σε κάποιον να καθορίσει πώς αποδίδεται η εικόνα ("picture.png").

Βήμα 3

Χρησιμοποιήστε Cascading Style Sheets (CSS) για να διαμορφώσετε το γραφικό στοιχείο έτσι ώστε να εμφανίζεται ομοιόμορφα σε όλα τα προγράμματα περιήγησης. Μέρος του αρχείου CSS θα περιέχει το ακόλουθο στυλ:

Βήμα 4

Τοποθετήστε το παραπάνω αρχείο σε ξεχωριστό αρχείο. Σε αυτό το παράδειγμα, έχουμε αποθηκεύσει το αρχείο ως "widget.css". Ανατρέξτε στο αρχείο χρησιμοποιώντας τη δήλωση "εισαγωγή" στο κύριο αρχείο html όπως φαίνεται:

Προσθέτοντας δυναμισμό

Βήμα 1

Χρησιμοποιήστε το αντικείμενο "widget" για να παρέχετε πρόσθετη δυνατότητα. Για παράδειγμα, για πρόσβαση στις προτιμήσεις χρήστη, χρησιμοποιήστε την ακόλουθη γραμμή κώδικα:

widget.setPreferenceForKey (προτίμηση, κλειδί) GO widget.preferenceForKey (κλειδί);

Βήμα 2

Χρησιμοποιήστε συμβάντα ενεργοποίησης για να αποφύγετε την υπερβολική χρήση του χρόνου της CPU ή των πόρων δικτύου από το γραφικό στοιχείο. Ο παρακάτω κώδικας δείχνει πώς γίνεται αυτό:

If (window.widget) { widget.hide = απόκρυψη GO widget.show = εμφάνιση GO

συνάρτηση hide() { if (timeInterval == null) { timeInterval = setInterval (updateTime (true);", 500) GO } }

Προσθέστε άλλες λειτουργίες στον κώδικα όπως προτιμάτε.

Βήμα 3

Δημιουργήστε το αρχείο "Info.plist" για να προσδιορίσετε ένα γραφικό στοιχείο και τους πόρους του. Αυτό το αρχείο ποικίλλει ανάλογα με το τι πρέπει να περιέχει, ανάλογα με τον τύπο του γραφικού στοιχείου.

Υπόδειξη

Σύμφωνα με τις χρήσεις της τεχνολογίας Ιστού, ο δυναμισμός των γραφικών στοιχείων παρέχεται χρησιμοποιώντας JavaScript. Αυτό επιτρέπει στο γραφικό στοιχείο να έχει πρόσβαση στις προτιμήσεις χρήστη στο σύστημα, να αναστρέφει τα γραφικά στοιχεία για να έχει πρόσβαση στις προτιμήσεις, να ανοίγει άλλες εφαρμογές, ανταποκρίνονται σε συμβάντα ιστοσελίδας και εκτελούν εντολές συστήματος όπως εργαλεία γραμμής εντολών και κέλυφος σενάρια.