Comment faire pour créer des widgets sous Bada

**Nicolas** Dim 15 Aoû - 20:33

Les widgets sont ces petites applications que nous voyons sur notre écran principal. Ils sont écrits en HTML comme n'importe quelle page web.
Comme je l'ai mentionné , le widget est en quelque sorte une page web écrite en HTML, qui prend également l'avantage de CSS styles et Java Script.

Comment faire pour créer des widgets sous Bada Image1-e1280252652972

Comment faire pour créer des widgets sous Bada Image1-e1280252652972

Pour faire ce tutoriel nul besoin de logiciel chères, un simple notpad fait l'affaire, d'ailleurs c'est ce que j'utilise pour écrire tout mes codes en HTML / PHP,..

Le Widget est généralement constitué de 3 dossiers de base :

css (où tous les styles sont mentionnés),
js (où tous les scripts Java sont empilés)
images .

Tous les widgets (à la fois pour Bada et pour Samsung Omnia) ont une structures identique à celle ci, il est donc bon de la garder tel quelle

3 fichiers sont très importants, et sans eux rien ne peux focntionner

- index.htm - structure HTML du widget,
icon.png - l'icône que nous voyons (32bit image de taille 90 × 90)
config.xml fichier de configuration - (très important)

Commençons donc par le début et créeant le fichier : config.xml. Ce fichier est utilisé par l'OS Bada pendant l'installation du widget. Si il contient des erreurs, le widget ne sera pas installé du tout. Dans ce fichier il devrait y avoir:

Code:: <?xml version="1.0" encoding="UTF-8" standalone="no"?> <widget id="ExempleWidget" version="1.0" width="120" height="180" xmlns="http://www.w3.org/ns/widgets"> <title>Exemple</title> <description>Ici mettre la descritpion du widget</description> <icon src="icon.png"/> <content src="index.html"/> <access network="false"/> </widget>

Voici un petit lexique des différents thermes de ce code source :

widget Id - peut être une valeur alphanumérique (après certification, il contient le numéro 0 × 10000715, comme, mais si nous écrivons "ExampleWidget" il fonctionne aussi très bien,
Version - version widget,
width- widget sont largeur initiale (le cadre jaune, nous voyons au cours de glisser widget),
height- zone widget hauteur initiale (le cadre jaune, nous voyons au cours de glisser widget),
title- le nom du widget,
Description-widget brève description (s'il contient des caractères UTF-8 que tout fichier XML doit être UFT-8 codé ou widget ne sera pas installé),
Icon - le chemin de l'icône widget principal (peut pointer vers d'autres - comme "/ images/1.png», mais il est bon de faire de cette façon),
Contenu - point de widget contenu principal et doit toujours être "index.html",
Accès au réseau - true si nous avons besoin d'utiliser le réseau de nos widgets, sinon false (si elle est définie à true, nous serons amené à tourner sur le WiFi ou GPRS).

Ces quelques lignes sont un strict minimum pour que votre widget fonctionne et nous ne devons pas oubliez pas d'enregistrer ce fichier au format UTF-8 (surtout pas en Unicode mais sous en ANSI) sous peine de ne pas pouvoir installer le widget .

OK, nous avons préparé une config - Maintenant, nous allons commencer l'aventure html !!!

Les widgets sont un peu limités dans leur html, CSS, DOM et JavaScript. Par exemple, nous avons seulement que quelques événements disponibles: onClick (), onMouseUp (), onFocus (), onBlur ().

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Exemple de widget</title> <link rel="stylesheet" type="text/css" href="css/exempleWidget.css"/> <script src="js/exempleWidget.js" type="text/javascript"></script> </head> <body> <img id="logo" src="images/mygsm.png" onClick="testLogo();"/> <span class="logoLabel">Bonjour de mygsm!</span> </body> </html>

Dans l'exemple de widget suivant je vais utiliser seulement deux fichiers externes: css / exapleWidget.css (feuille de style) et js / exapleWidget.js (code JavaScript).
le code JS contient un script simple qui afficheras «Bonjour de Mygsm.fr »

Code:: // exampleWidget.js function testLogo() { alert('Bonjour de Mygsm'); } // exempleWidget.css span.logoLabel { top: 5px; font-size:20px; color:#FFFFFF; }

Mais ces quelques fichiers et dossiers ne fera rien sans le fameux fichier widget (. WGT). Pour ce faire nous avons besoin d'utiliser n'importe quel logiciel de compression Zip (j'ai utilisé 7Zip à cet effet) avec l'option Deflate (par défaut), puis modifier l'extension en . WGT.

Et voila ! Nous avons notre premier widget.

Pour l'installer, il suffit de copier le fichier . WGT sur l'appareil Si tout est OK, Bada nous informe que ce widget n'est pas certifié et nous demande si nous voulons l'installer de toute façon.

voici deux fichiers :

mikanel06 Jeu 19 Aoû - 19:19

De mon côté j’ai un soucis, je comprends bien la procédure mais rien à faire, lors de l’installation sur le wave, j’ai le message « En cours » puis plus rien (il ne me dit pas Unsigned …) et rien ne s’installe alors que j’ai bien vérifié, la widget n’est pas déjà installée sur le wave, j'encode en UTF8 ... j'y perd mon latin => y a t'il un moyen simple de tester la validité de la widget avant et après ZIP ???

Côté zip c'est ok pour moi si je dezippe et rezippe le wgt, là la widget se charge !!!

**Nicolas** Jeu 19 Aoû - 20:22

Quand il te dit Unsigned tu dois pouvoir VALIDER , pour que ce dernier s'installe , quand tu encodes UTF8 est ce que tu sélectionne bien ANSI est non pas unicode ?

je n'ai pas de moyen simple pour tester le widget.. il te faudra passer par eclispse (http://www.eclpise.org) et télécharger le log , puis sur le site http://innovator.samsungmobile.com/down/cnts/toolSDK.list.do?platformId=12 pour télcharger les élément widgets..
tu aura aussi besoin de http://developer.bada.com/apis/tools/sdk/list.do?categoryID=FC02040100&menu=MC01040500

sinon j'ai entendu parler de "bondi" visiblement un soft pour les widgets sous bada http://en.wikipedia.org/wiki/BONDI_(OMTP)

regarde et redits moi

mikanel06 Ven 20 Aoû - 8:20

Bon j'ai trouvé, c'est une widget que je voulais modifier hors elle fait appel à du BONDI ... donc on ne peut pas l'éditer manuellement. Il faut obligatoirement passer par eclipse (importer le wgt, modifier les données, et packager le nouveau wgt). Apparemment c'est parce que ces widget sont signés et donc il faut que l'outil regénère la signature à chaque modif ...

bozzo Ven 20 Aoû - 9:32

Bonjour,

Je me suis lancé dans la création d'un widget permettant de créer un raccourci vers une application locale (ou même faisant la liste des applications) ...
Mais après quelques recherches, pour des raisons de sécurité, il n'est pas possible d'exécuter une application autre que celles installée par défaut sur le wave (mail, navigateur, mp3, ...) donc par exemple impossible de faire un raccourci vers "Palringo" ou autre ...
Dommage !

Par contre pour faire un raccourci vers l'une des applis par défaut c'est vraiment super simple Smile

**Nicolas** Ven 20 Aoû - 9:38

bozzo a écrit:

Par contre pour faire un raccourci vers l'une des applis par défaut c'est vraiment super simple

Si tu peux nous faire un petit tutoriel ce serrais vraiment sympa

bybam Jeu 30 Sep - 21:33

Désoler de vous déranger, mais ce language informatique ne me parle pas du tout, avez vous une methode "simple" pour que je créer des Widget sur mon Wave, surtout pour des site type "VDM, FaceBook, etc" qui ressemblerai au Widget deja existant, ou pouvez vous me guider pour leurs créations.

Merci de votre aide

Contenu sponsorisé

Inscrivez vous sur notre nouveau forum pour poster vos questions ou commentaires sur MyGsm http://www.mygsm.fr/forum

N'oubliez pas de visitez nos sponsors !!!

Comment faire pour créer des widgets sous Bada

Comment faire pour créer des widgets sous Bada

Fichier ne s'installe pas !!!

Re: Comment faire pour créer des widgets sous Bada

Re: Comment faire pour créer des widgets sous Bada

Re: Comment faire pour créer des widgets sous Bada

Re: Comment faire pour créer des widgets sous Bada

imcompréhension

Re: Comment faire pour créer des widgets sous Bada