Comment créer un widget

...

Architecture des widgets

Les widgets sont des applications autonomes qui peuvent généralement être trouvées intégrées sur des sites tiers comme des horloges, des tickers d'enchères, des comptes à rebours d'événements, etc. Les widgets sont ainsi des mini-applications faciles à déployer, rapides à développer et utilisées pour tirer parti des technologies avancées en ajoutant des fonctionnalités aux applications existantes. Si vous pouvez créer une page Web, alors vous savez comment créer et déployer un widget car ils utilisent la même technologie que JavaScript, DHTML et CSS. Les widgets peuvent être des widgets d'accessoires, d'applications ou d'informations. Les widgets accessoires sont autonomes et s'exécutent indépendamment d'Internet ou d'une application. Les widgets d'application sont associés à part entière à une application tandis que les widgets d'information fonctionnent avec les données Internet.

L'architecture

Étape 1

Lancez votre éditeur de texte et créez un fichier HTML. Le fichier HTML doit être conforme à la norme XHTML 1.0 et supérieure afin de se conformer aux meilleures pratiques des normes Web actuelles. Un simple code XHTML ressemblera à ceci :

Vidéo du jour

Widgets

Étape 2

Utilisez le tag pour effectuer un rendu 2D complet pour le widget si nécessaire. L'attribut "composite" est un autre ajout à la balise qui permet de spécifier comment l'image ("picture.png") est rendue.

Étape 3

Utilisez des feuilles de style en cascade (CSS) pour styliser le widget afin qu'il s'affiche uniformément sur tous les navigateurs. Une partie du fichier CSS contiendrait le style suivant :

Étape 4

Placez le fichier ci-dessus dans un fichier séparé. Dans cet exemple, nous avons enregistré le fichier sous le nom « widget.css ». Référencez le fichier à l'aide de l'instruction « import » sur le fichier html principal, comme indiqué:

Ajout de dynamisme

Étape 1

Utilisez l'objet « widget » pour fournir une capacité supplémentaire. Par exemple, pour accéder aux préférences de l'utilisateur, utilisez la ligne de code suivante :

widget.setPreferenceForKey (préférence, clé) GO widget.preferenceForKey (clé);

Étape 2

Utilisez des événements d'activation pour éviter une utilisation excessive du temps CPU ou des ressources réseau par le widget. Le code ci-dessous montre comment cela se fait :

Si (window.widget) { widget.hide = masquer GO widget.show = afficher GO

function hide() { if (timeInterval == null) { timeInterval = setInterval (updateTime (true);", 500) GO } }

Ajoutez d'autres fonctions au code selon vos préférences.

Étape 3

Créez le fichier "Info.plist" pour identifier un widget et ses ressources. Ce fichier varie sur ce qu'il doit contenir en fonction du type de widget.

Pointe

En accord avec les usages des technologies Web, le dynamisme des widgets est assuré grâce à JavaScript. Cela permet au widget d'accéder aux préférences de l'utilisateur sur le système, de retourner les widgets pour accéder aux préférences, d'ouvrir d'autres applications, répondre aux événements de page Web et exécuter des commandes système telles que des outils de ligne de commande et un shell scripts.