Devenir un développeur d'applications de surveillance intelligente est une excellente idée, mais que se passe-t-il si vous êtes un développeur HTML? Serez-vous capable de réaliser votre rêve sans passer à une plate-forme complètement différente? Devez-vous abandonner toutes vos compétences en HTML et tout recommencer? Ne t'inquiète pas. Tizen vient à votre secours.
Tizen est un système d'exploitation de la famille Linux, ciblant une gamme d'appareils allant des smartphones aux montres intelligentes, etc. Bien que Tizen soit un projet de la Linux Foundation, il est guidé par la Tizen Association, dont les membres comprennent Samsung, Intel et d’autres sociétés bien connues du secteur des technologies..
Dans ce didacticiel, je vais vous montrer comment installer et configurer Tizen SDK for Wearable et développer une application de surveillance intelligente avec l'EDI. Commençons.
Actuellement, deux types de SDK sont disponibles, Tizen SDK et Tizen SDK for Wearable. Étant donné que ce tutoriel concerne le développement d'une application autonome de surveillance intelligente, vous avez besoin du kit de développement logiciel Tizen SDK for Wearable..
Vous pouvez le télécharger sur le site Web de Tizen Developers. Vous devez télécharger un fichier approprié gestionnaire d'installation qui correspond à votre système d'exploitation et à votre version. Si vous préférez une installation hors ligne à une installation en ligne, vous devez télécharger un Image du SDK aussi. Si votre système d'exploitation est Windows 8 ou Windows 8.1, vous pouvez télécharger les fichiers d'installation classés sous Windows 7. Ils fonctionneront parfaitement sous Windows 8 et 8.1..
Reportez-vous aux instructions détaillées de Tizen pour en savoir plus sur la configuration matérielle et logicielle requise par votre ordinateur..
Vous pouvez installer le SDK même si votre ordinateur ne répond pas à ces exigences matérielles. Toutefois, si vous le faites, l'émulateur de montre intelligente sera lent, ce qui entraînera des tests d'applications médiocres. Visitez la documentation pour plus de détails. Il explique comment activer Technologie virtuelle (VT) dans votre BIOS et Prévention de l'exécution des données sous Windows.
Si vous le souhaitez, vous pouvez installer Intel HAXM séparément. Une fois l'installation terminée, redémarrez votre ordinateur.
Sur le volet gauche de l'IDE, il y a deux fenêtres, Explorateur de projet et Connexion explorer. le Explorateur de projet affiche les projets créés par l'utilisateur. le Connexion explorer répertorie les périphériques connectés actuellement disponibles, les instances d'émulateur ou les périphériques distants.
Il faudra un certain temps pour lancer l'émulateur. Vous devriez voir une fenêtre avec un écran de démarrage similaire à la capture d'écran ci-dessous lorsqu'elle est opérationnelle. L’instance de l’émulateur doit apparaître comme une entrée dans Connexion explorer.
Faites glisser votre doigt du haut vers le bas, au centre de l’écran de démarrage, pour accéder à l’écran affichant les applications installées sur le périphérique ou l’émulateur. Puisque vous n'avez encore installé aucune application, seul le Réglages l'icône est affichée.
Vous pouvez revenir à l'écran précédent ou quitter une application en faisant glisser votre doigt du haut au milieu de l'écran..
Dans cet exemple, nous allons créer une application simple pour afficher une bande dessinée. Regardons chaque étape à tour de rôle.
Créons un nouveau projet dans l'EDI.
HTML, CSS et JavaScript constituent la base de la programmation sur la plateforme Tizen. Si vous êtes un assistant HTML, vous n'avez pas besoin d'apprendre un nouveau langage de programmation pour écrire des applications sur la plateforme Tizen. Vous pouvez utiliser vos compétences HTML, CSS et JavaScript existantes.
Nous devons d’abord ajouter deux sous-dossiers au myapp projet, bande dessinée et images. Pour ce faire, cliquez avec le bouton droit sur le myapp dossier de projet dans l'EDI et sélectionnez Nouveau> Dossier. Les sous-dossiers doivent apparaître dans le dossier développé. myappdossier dans l'IDE.
Téléchargez les fichiers sources de ce projet à partir de GitHub et accédez au images sous-dossier, qui contient un certain nombre de fichiers png. Copiez les fichiers png sur le images sous-dossier que vous avez créé il y a un moment.
Vous pouvez coller des fichiers sur le images sous-dossier dans le Explorateur de projet fenêtre en faisant un clic droit sur le sous-dossier et en sélectionnant Coller du menu contextuel.
Ensuite, créez neuf fichiers HTML avec les noms de fichier suivants dans le dossier bande dessinée sous-dossier en faisant un clic droit sur le bande dessinée sous-dossier et en sélectionnant Nouveau> Fichier. Assurez-vous d'inclure le .html extension pour les fichiers.
Vous devriez maintenant avoir neuf fichiers HTML dans le bande dessinée sous-dossier.
Modifions maintenant le code dans index.html. Ce fichier est le point d’entrée de votre application. Double-cliquez index.html ouvrir le fichier dans l'EDI. Changer le contenu de la
tag à
. Ensuite, changez le contenu de la balise avec les éléments suivants:
<<>>
Tout ce que nous avons fait, c'est ajouter une image à la page et deux boutons pour naviguer vers les autres pages, car notre bande dessinée aura dix pages. Une fois ces modifications apportées, enregistrez le fichier en sélectionnant Fichier> Enregistrer du menu.
Si vous êtes novice en HTML et CSS, Tuts + propose une vaste collection d'excellents tutoriels qui vous aideront à maîtriser les bases du développement Web..
Ensuite, double-cliquez style.css dans le css sous-dossier et modifier son contenu comme indiqué ci-dessous.
* font-family: Verdana, Lucida Sans, Arial, Helvetica, sans serif; body margin: 0px auto; couleur de fond: # 0a3003; img margin: 0; rembourrage: 0; bordure: 0; largeur: 100%; hauteur: auto; bloc de visualisation; float: gauche; .btn display: inline-block; rembourrage: 15px 4% 15px 4%; marge gauche: 1%; marge droite: 1%; marge supérieure: 5px; marge inférieure: 5px; taille de police: 30px; text-align: center; alignement vertical: milieu; bordure: 0; couleur: #ffffff; couleur de fond: # 4b4237; largeur: 40%; hauteur: 80px; texte-décoration: aucun;
Nous avons ajouté des styles pour le corps, les images et les menus de navigation. Une fois les modifications apportées, enregistrez le fichier..
De même, ajoutez du code à tous les autres fichiers HTML que vous avez créés. le style.css déposer dans le css Le sous-dossier doit être lié de manière externe à tous ces fichiers HTML. Si vous êtes certain de cette étape, téléchargez les fichiers sources à partir de GitHub et examinez les sources pour plus de précisions..
Pour tester votre application, sélectionnez le myapp dossier du projet et, dans le menu, choisissez Projet> Projet de construction pour construire le projet. Assurez-vous que l'instance de l'émulateur est opérationnelle.
Faites un clic droit sur le myapp dossier et sélectionnez Exécuter en tant que> Application Web portable Tizen pour exécuter le projet dans l'émulateur. Utilisez les boutons fléchés de l'interface utilisateur pour accéder à la page suivante ou précédente. Faites glisser votre doigt depuis le haut de l'écran pour quitter l'application..
Dans ce didacticiel, nous avons créé une application de bande dessinée simple avec le SDK Tizen pour Wearable et l'avons exécutée sur l'émulateur de montre intelligente fourni avec l'EDI. Le vrai plaisir commence lorsque vous êtes prêt à l’installer et à l’exécuter sur un périphérique physique.
Vous trouverez de nombreuses informations supplémentaires sur les sites Web de Samsung et de Tizen Developers. Qu'est-ce que tu attends?