Développez vos applications pour TV Samsung avec Tizen
Tizen est un système d’exploitation basé sur Linux qui a fait son apparition en 2012. Ce projet open source est principalement soutenu par Samsung qui l’utilise dans un large éventail de ses produits (on le retrouvera dans des montres, des véhicules, des réfrigérateurs, des télévisions et aussi certains téléphones). Le but de ce système d’exploitation est d’offrir une plateforme de développement commune pour tous ces appareils afin de faciliter le développement d’applications.
Je me suis intéressé à ce système pour découvrir ses possibilités et voir si je pouvais développer ma propre application pour contrôler ma domotique depuis ma TV Samsung. Le but de cet article est de partager avec vous mon parcours et vous apprendre comment développer une application pour votre TV Samsung. Nous verrons dans un premier temps comment mettre en place et utiliser le kit de développement (SDK) Tizen puis nous créerons une petite application de contrôle domotique.
Installation de l’environnement Tizen
Pour développer des applications pour Tizen, nous allons commencer par mettre en place notre environnement. Première étape : installer Tizen Studio. Rendez-vous au ici pour le télécharger.
Première difficulté rencontré sur mon Windows 7 : l’installeur refuse d’installer Tizen dans le dossier indiqué… C’est un bug connu, un petit tour sur StackOverflow et le problème est vite corrigé : saisissez C:\Users\<nom utilisateur>\AppData\Roaming\Samsung\tizen-studio dans le champ « SDK location » et C:\Users\<nom utilisateur>\AppData\Roaming\Samsung\tizen-studio-data dans le champ « Data location ».
Un début prometteur
Une fois l’installation terminée, il vous sera proposé de lancer le Package Manager : acceptez et continuez. Allez ensuite dans Extension SDK et installez les extensions TV Extensions-4.0 et Samsung Certificate Extension.
Fermer le Package Manager, cochez Launch the Tizen Studio et cliquez sur OK. Un emplacement ce Workspace vous est alors demandé, c’est dans ce dossier que seront stockés tous les fichiers de nos projets Tizen. Ici, vous pouvez saisir le dossier que vous voulez puis continuez pour lancer Tizen Studio.
Même avec ton maquillage, je te reconnais Eclipse
Pour ceux familiers avec l’IDE Eclipse, vous devriez vite prendre vos marques : on retrouve les projets sur le volet de gauche, l’éditeur au centre et la console en bas.
Création d’un projet
Nous allons commencer par créer un projet simple et le déployer sur notre TV. Cliquez sur Create new project dans le volet de gauche, sélectionnez Template, puis Custom > TV-samsung v4.0. Sélectionnez ensuite Web Application puis Basic Project et enfin donnez un nom au projet.
Tizen Studio va alors générer un projet de base HTML5. Voyons un peu les fichiers qu’il contient :
- config.xml : ce fichier contient toute la configuration du projet Tizen. C’est ici que vous pouvez régler le point d’entrée, les permissions et la sécurité de celui-ci.
- index.html : le point d’entrée par défaut du projet. C’est une simple page HTML depuis laquelle vous pouvez importez vos fichiers JavaScript et CSS.
- js/main.js : ce fichier contient quelques instructions JavaScript pour rendre l’application interactive. Pour l’instant il ne fait pas grand chose mais nous allons nous intéresser à la partie suivante :
Nous pouvons voir que Tizen utilise les mêmes API que les navigateurs classiques. Les applications développées pour le Web peuvent donc potentiellement fonctionner sur votre TV.
On peut également voir l’appel à un objet tizen. Cet objet contient un ensemble de méthodes qui permettent de contrôler plus de fonctionnalités de la TV. Je ne rentrerai pas en détail sur ces fonctionnalités dans cet article mais vous pouvez retrouver la documentation (un peu obscure) ici.
Maintenant que nous avons vu la structure du projet, voyons comment le déployer sur notre TV.
Déployer l’application Tizen sur votre télévision
Le déploiement d’une application Tizen sur une TV se déroule en plusieurs étapes : nous allons d’abord voir comment passer notre TV en mode développeur pour pouvoir la connecter à Tizen Studio. Ensuite, nous créerons un certificat pour pouvoir signer notre application et autoriser son déploiement sur la TV.
Passer la télévision en mode développeur
Pour pouvoir connecter votre Smart TV à Tizen Studio, vous devez activer le mode développeur. Ce mode nous permettra de déployer notre application directement sur la TV.
Avant de commencer, assurez-vous que votre TV et l’ordinateur sont sur le même réseau. Effectuez ensuite les actions suivantes :
- Rendez-vous dans le menu « Apps » sur votre TV
Le menu « Apps » sur la Smart TV Samsung
- À l’aide de la télécommande, appuyez sur les boutons 1, 2, 3, 4 et 5 : une fenêtre apparaît et vous permet d’activer le mode développeur et de renseigner l’adresse IP du PC.
La fenêtre d’activation du mode développeur
- Activez le mode développeur et renseignez l’IP du PC. Une fois ces informations renseignées, redémarrez la TV (il faudra peut-être la débrancher)
- Retournez dans le menu « Apps », vous devriez voir en haut de l’écran le texte rouge « Developer Mode » qui vous confirme que vous êtes passés en mode développeur.
Confirmation d’activation du mode développeur
Connecter Tizen Studio à votre télévision
Maintenant que le mode Développeur est activé, vous pouvez connecter votre Smart TV à Tizen Studio. Voici la procédure à suivre :
- Dans la barre d’outils de Tizen Studio, cliquez sur Device Manager.
Bouton Device Manager
- Ensuite, cliquez sur Remote Device Manager.
Bouton Remote Device Manager
- Cliquez sur Scan Devices pour lancer la recherche de votre TV.
Bouton Scan Devices
- Une recherche est lancée et vous devriez voir votre TV apparaître dans la liste. Passez le switch sur la droite à On pour connecter votre TV.
Smart TV connectée dans le Remote Device Manager
- Vous pouvez ensuite fermer la fenêtre Remote Device Manager et Device Manager.
Création du certificat
Nous allons bientôt pouvoir déployer notre application ! Étape finale : créer un certificat de signature pour autoriser notre application à être déployée sur des appareils réels. Voici les étapes à suivre :
- Dans la barre d’outils de Tizen Studio, cliquez sur Certificate Manager.
Bouton Certificate Manager
- Si vous voyez la fenêtre Migration for Certificate Profile, cliquez sur Cancel.
- Appuyez sur le bouton « Plus » pour ajouter un certificat.
Bouton d’ajout de certificat
- Cliquez sur Samsung en type de certificat.
- Sélectionnez TV en type de device.
- Choisissez Create a new certificate profile et entrez un nom pour le profil de certificat (« default » par exemple).
- Sélectionnez Create a new author certificate. Ce certificat vous identifie et assure que c’est vous qui avez signé l’application.
- Renseignez les champs nom et mot de passe.
- L’outil va alors vous demander de vous connecter ou de créer un compte Samsung pour pouvoir créer votre certificat.
- Vous avez terminé la création du certificat d’auteur ! Continuez pour créer le certificat de distributeur.
- Sélectionnez Create a new distributor certificate. Celui-ci vous permettra d’autoriser votre TV à installer l’application. Si vous deviez déployer votre application sur un store, celui-ci serait fourni par Samsung.
- Dans la liste suivante, vous devriez voir un DUID renseigné par défaut. C’est l’ID de la TV que nous avons connecté à l’étape précédente. La création du certificat nous permettra de déployer sur cette TV. Vous n’avez pas d’informations à changer sur cet écran, passez à l’étape suivante.
Configuration du certificat de distributeur
- Vous avez terminé la création du certificat de distributeur !
Installer le certificat sur la télévision
Maintenant que nous avons créé le certificat, nous devons l’ajouter à la TV pour qu’elle accepte l’installation d’applications :
- Rendez vous dans le Device Manager.
- Faites un clic droit sur votre TV et sélectionnez Permit to install applications.
- Une fenêtre vous félicite : « Succeeded to upload a certificate«
Lancer l’application
Pfiou… Ça fait beaucoup de clics et de formulaires, mais nous y sommes. Retournez sur l’écran principal de Tizen Studio et cliquez sur le bouton « Play » puis sélectionnez « Tizen Web Application » pour lancer votre application.
Bouton de lancement d’application
Attendez quelques secondes et vous devriez voir l’application par défaut se lancer sur votre TV.
L’application d’exemple Tizen
Conseils pour le développement pour Tizen
Maintenant que l’application basique se lance, parlons un peu développement.
Mon but avec Tizen était de développer une petite application pour pouvoir contrôler mes objets connectés depuis ma TV. Cette application est juste une interface qui communique avec les API d’Home Assistant pour afficher des appareils et les contrôler.
L’application de contrôle Home Assistant depuis Tizen. Mes lumières et mes lecteurs de média sont affichés, je peux naviguer de l’un à l’autre à la télécommande et changer leur état.
Je ne vais pas rentrer dans les détails du développement d’une application HTML5 car cela rendrait cet article un peu trop long (pour ceux que ça intéresse, vous pouvez retrouver le projet complet sur GitHub). Je vais plutôt vous parler des soucis que j’ai rencontré pendant le développement d’une application Tizen et mes conseils pour garder sa santé mentale pendant le développement.
Comprendre la plateforme
Nous avons vu plus tôt que la plateforme Tizen utilisait les mêmes API que les navigateurs. C’était plutôt rassurant dans le début de mes développements car c’est un environnement que je connais plutôt bien. L’enchantement a vite disparu.
En effet ma TV de 2016 se base sur une version de Webkit de 2013 avec quelques customisations de la part de Samsung. La plupart des fonctionnalités du JavaScript moderne ne seront donc pas disponibles… Jusque là rien de bien grave, armez-vous de polyfills et les fonctionnalités pourront être émulées.
Les autres problèmes sont rencontrés sur la partie CSS. Tizen devrait supporter les instructions Flexbox (celles-ci sont supportées depuis 2010), mais ce n’a pas l’air d’être le cas. Le principal problème est que cela nous empêche d’utiliser la plupart des bibliothèques modernes de composants.
Se passer de Tizen Studio
Le développement depuis Tizen Studio n’est pas forcément ce qu’il y a de plus agréable… L’outil est assez lent, il n’y a pas de compilation de JavaScript (ce qui oblige à utiliser du JavaScript Old School) et il vous fera quitter votre environnement de développement habituel.
J’ai vite préféré le quitter pour retourner dans VSCode et créer un projet en JavaScript moderne (avec React dans mon cas). Il suffit ensuite de récupérer le fichier config.xml d’utiliser l’extension VSCode tizentv.
Accéder à Internet
Pour pouvoir communiquer avec Home Assistant (ou tout autre système), il faut pouvoir effectuer des requêtes externes à l’application. Par défaut, celles-ci sont désactivées pour les applications Tizen.
Pour les activer, rendez-vous dans le fichier config.xml. Dans l’onglet Pivileges, ajoutez http://tizen.org/privilege/internet aux privilèges de l’application, puis rendez-vous dans l’onglet Policy et ajoutez une entrée. Vous pouvez saisir le domaine exact auquel vous voulez accéder ou * si vous voulez donner accès à n’importe quel domaine.
Contrôler l’application à la télécommande
L’aspect le plus intéressant du développement sur TV est la limite de l’interface utilisateur : la télécommande.
Dans la plupart des cas, vous aurez le droit à 6 boutons : gauche, droite, haut, bas, OK et retour. La solution la plus simple peut être de créer des liens entre chaque élément, mais celle-ci peut être fastidieuse à mettre en place et peut facilement être source d’erreurs (changement de design, plus ou moins de données que prévu, etc.).
Ce que j’ai essayé d’automatiser.
Il existe un très bon article de Netflix à ce sujet que je vous recommande. Pour mon projet, j’ai réimplémenté le comportement avec le composant Focusable. Celui-ci permet une navigation naturelle dans l’application sans que j’ai à me soucier de l’emplacement de mes composants.
Conclusion
Voilà pour le développement d’application avec Tizen. Mon expérience n’aura pas été des plus agréables : des bugs peu compréhensibles, une documentation faible et une communauté désespérée par le manque de support des créateurs.
Même s’ils continuent de faire évoluer leur plateforme, je pense que Samsung devra de se mettre au niveau des standards du marché pour que des développeurs apportent des applications novatrices sur celle-ci. Je ne serait pas étonné que les contrôles à la télécommande soient de plus en plus abandonnés au profit des contrôles vocaux qui pourraient simplifier grandement l’expérience utilisateur.
J’espère que cet article vous aura donné un bon aperçu de la plateforme Tizen et qu’il pourra vous aider si jamais vous devez vous y aventurer 😉
JavaScript and Progressive Web Apps enthusiast
☕ Coffee lover ☕
Home automation newbie
Bonjour,
Article sympa mais ma Samsung ne semble pas être sous Tizen, quand je vais dans le menu Apps de Samsung et que je tape « 12345 » il ne se passe rien du tout.
Comment vérifier l’OS de ma télé Samsung UE32F5300AW.
Merci d’avance pour votre réponse.
Cordialement,
iPapy
Bonjour iPapy,
J’ai regardé un peu plus en détail et l’accès au mode développeur a l’air différent sur les séries F (et un peu plus compliqué). Vous pourrez trouver les instructions complètes ici.
Le développement d’applications pour ces TV ne passe pas non plus par le Tizen SDK, il faudra télécharger Samsung TV SDK (la version « for Legacy Platform » je pense, à tester).
Le fonctionnement a l’air un peu différent : il faut installer un serveur apache sur l’ordinateur qui exposera l’application à la TV.
J’espère que ça pourra vous aider ! N’hésitez pas à partager votre expérience, je suis sûr que ça pourra aider d’autres personnes 😉
Bonsoir Antoine,
Merci pour les informations, je vais regarder cela d plus près dans la semaine je vous tiendrais au courant.
Cordialement,
Franck
Bonjour
Petit problème pour moi je ne sais pas comment faire
J’ai réussi à mettre ma TV en mode développeur la remonte devise manager trouvé bien mon adresse Ip de ma TV mais il ne veut pas si connecter.
voila le message d’erreur
connecting to 192.168.1.16:26101…
failed to connect to 192.168.1.16:26101
You may get this message for following reasons:
-This remote device is already connected by another one.
-This remote device is running on a non-standard port.
-There is no IP address, please check the physical connection.
J’espère que quelqu’un pourra m’aidai
Par avance merci.
Bonjour,
J’avais rencontré cette erreur deux fois :
– lorsque la TV n’avait pas été redémarrée entièrement (en débranchant son alimentation)
– lorsque je n’avais pas renseigné la bonne adresse IP (celle du PC) lors de l’activation du mode développeur
Sinon en regardant un peu sur les forums Tizen certains arrivent à connecter le device en recommençant cette étape (désactiver le mode développeur, redémarrer la TV, activer le mode développeur en renseignant l’IP du PC et redémarrer à nouveau).
Dites-moi si cela résout le problème 🙂
non ca n’a pas marché j ai essayé plusieurs fois mais ça n ‘a pas marché tu n’aurais pas un tutoriel pour installer disney + sur tv ua55j6300
Cordialement
merci beaucoup
Bien. Mais pour un propriétaire d’une TV 2016 (KS8000) c’est un peut décourageant de voir que c’est basé sur Webkit.
Depuis les débuts, je suis déçu de cette TV. Très peu d’applications – un minimum pour vendre… Très peu de mise à jour et pas du tout d’informaion sur les mise à jour. Et la promesse de Samsung que cette TV soit compatible IoT a été renié.
Bonjour
es possible de stocker un projet dans un seeveur web et appeler le fochier index.html via un local.herf depuis un script installé sur la Tv tizen.
Bonjour miloud,
Je ne pense pas qu’il soit possible de définir un point d’entrée (index.html) hébergé sur un serveur. Cependant, il est possible d’inclure des ressources hébergées sur un serveur depuis ce fichier (javascript, CSS, etc.).
Tu peux donc créer un index.html « vide » qui se charge juste de charger l’application JS depuis ton serveur et tu devrais obtenir un résultat similaire à ce que tu voulais obtenir.
Bonjour,
Auriez-vous une méthode pour acceder en ftp à ma TV samsung série « M » svp ?
Je veux recuperer quelques widgets etranger.
Merci.
Bonjour Toune,
Je ne connais pas de méthode pour accéder à un FTP sut les TVs Samsung.
Cependant, pour le téléchargement d’applications étrangères, je peux peut-être aider :
– Dans le Smart Hub, aller dans la partie « Apps » et sélectionner « Configuration des conditions générales d’utilisations »
– Vous devriez arriver sur l’écran suivant :
– Sur cet écran, appuyez dans l’ordre sur touches suivantes de votre télécommande : « ⏩️ » (bouton avance rapide), « 2 », « 8 », « 9 », « ⏪️ » (bouton de retour rapide). Vous devriez voir la liste de pays suivante apparaître :
– Vous pouvez ensuite sélectionner le pays que vous voulez utiliser pour le store d’applications Samsung. Une fois sélectionné, confirmez en cliquant sur « OK ». La TV va ensuite changer les applications installées par défaut pour utiliser celles du pays sélectionné (attention, les applications du store de l’ancien pays ne seront plus disponibles et cela peut vous déconnecter de certaines applications)
Vous pouvez regarder cette vidéo si vous voulez plus d’informations sur la manipulation à effectuer.
Bonjour Antoine.
Bravo pour ce blog, je n’en ai pas trouvé d’autre concernant la programmation pour les TV Tizen.
Je ne suis pas dev, mais je comprends qu’il est bel et bien possible de développer un VLC pour les TV Samsung modernes (telles les « The Frame »). Celles-ci ne savent plus lire les formats vidéos anciens, et pas mal de monde semble s’en plaindre. Il y a une demande, c’est sur.
Y aurait il un forum vers qui me tourner?
Bonjour Araldite,
Il serait intéressant de voir si le problème peut être contourné en utilisant le lecteur vidéo web (en utilisant le navigateur web de la TV par exemple). Si d’anciens formats de vidéos sont compatibles avec ce lecteur, il sera peut-être possible de faire une application simple qui ajoute le support de certains formats (il est peut-être possible de s’inspirer du projet suivant : https://github.com/Samsung/TizenTVApps/tree/master/TVDemoVideoPlayer).
L’autre piste envisageable serait de développer une application native pour TV Samsung. Celles-ci étaient développées en C++ et s’appuyaient sur NaCl. Cependant, cette plateforme a l’air d’être dépréciée en faveur de WebAssembly…
Pour ces deux pistes, je ne suis pas sûr que le développement soit simple ni que les performances soient bonnes pour des vidéos de haute qualité.
Je ne trouve toujours pas de bonne documentation ou de communautés très actives dans le développement Tizen donc je ne sais pas si je pourrai donner beaucoup plus de conseils.
Si tu trouves des résultats ou des informations intéressantes, n’hésite pas à les partager ici, je pense que ça pourra aider d’autres personnes.
Bon courage 🙂
Bonjour Antoine,
merci pour ce blog qui m’a permis de me lancer dans un web app tizen.
De mon côte je developpe en react mais j’avoue que le passage de mon app react au projet tizen dans TizenStudio est un peu obscure.
Vous ecrivez qu’il suffit de copier le fichier config.xml mais avec les dernieres version il semble que cela ne soit pas suffisant.
Mon principal problème est que j’ai d’un coté mon repertoire react et l’autre le repertoire créé par TizenStudio, comment avez vous fait la fusion svp ?
Merci.
Bonjour Marcus,
Merci pour votre commentaire, l’article rentre en effet assez peu dans les détails pour l’installation de l’application.
J’ai créé un nouveau projet d’exemple avec toutes les étapes de configuration pour pouvoir lancer le projet sur une TV. Vous pouvez le retrouver ici : https://github.com/Dramloc/react-tizen.
Il a été testé avec la dernière version de Tizen Studio (3.7).
N’hésitez pas à me dire si certaines étapes restent confuses, j’essayerai d’améliorer les instructions d’installation.
Bonjour Antoine, merci pour votre réponse, en fait je me suis sorti en copiant simplement toutes les data du repertoire Build dans le dossier du template Tizen généré.
Par contre j’ai cru comprendre que pour publier sur le store officiel Samsung,
il fallait ajouter des fonctions du type écran de veille etc ? Avez vous rencontré ce type de besoin ?
Merci !
Bonjour Marcus,
Je n’ai pas cherché à déployer d’application sur le store, je les utilise seulement sur ma TV.
D’après la documentation, il faut aller sur http://seller.samsungapps.com/tv, enregistrer l’app et passer par un processus de validation.
Par contre, je n’ai pas trouvé la liste des validations que l’app doit passer, donc je ne pourrai pas plus vous aider sur cette partie.
Bon courage et n’hésitez pas à partager vos résultats.
Bonjour,
Tout d’abord très intéressant votre blog
Je voulais savoir s’il était possible d’installer Tizen Studio sur ma tv samsung UE55D8000 datant de 2011. Merci
Bonjour Renaud,
Désolé pour le délai de réponse.
Il est possible de retrouver les compatibilités Tizen à l’adresse suivante : https://developer.samsung.com/smarttv/develop/specifications/tv-model-groups.html.
La TV UE55D8000 n’a pas l’air d’être compatible, désolé !
Bonsoir, Antoine,
Savez vous si un application pour acceder à SALTO existe, et si oui ou on peut la trouver, l’installer sur la TV ?
Merci de votre reponse
Bonjour André,
Apparemment, l’application Salto sera disponible sur les TV Samsung courant décembre (Cf. https://eu.community.samsung.com/t5/t%C3%A9l%C3%A9visions/salto-tv/td-p/2243964).
En attendant, il est peut-être possible d’utiliser l’application Salto sur une box Android TV (comme la Xiaomi Mi Box S ou le nouveau Chromecast avec Google TV).
Salut Antoine.
Permettez moi tout d’abord pour vous féliciter. J’ai beaucoup appris en lisant cet article.
Sinon j’ai une question si vous le permettez : Est ce que vous avez essayé de porter un navigateur web (Firefox ou Chrome) sur une TV Tizen ? vu que le navigateur par défaut est très très limité.
Merxi beaucoup d’avance
Bonjour Nathan, merci pour votre commentaire.
Porter un navigateur me parait très compliqué : il faudrait sans doute reprendre toute la base de code pour adapter le rendu, les interactions utilisateurs, les interactions avec le système, etc.
Pour les limitations du navigateur Samsung, j’ai l’impression qu’il y a eu de l’amélioration avec les années (Cf. https://developer.samsung.com/smarttv/develop/specifications/web-engine-specifications.html).
Par contre, j’ai du mal avec la politique de Samsung de figer les mises à jour de leur navigateur et de publier des navigateurs déjà obsolètes à la sortie de la TV (par exemple, les TV 2020 sortent avec une version de Chromium datant de septembre 2018).
Merci beaucoup pour votre temps et votre réponse.
Je crois que je vais investir dans un petit chromcast et le tour est joué.
Merci encore une fois … Et bravo pour votre site !
Hello Antoine,
Merci pour ton billet clair et synthétique.
J’ai récupéré une Smart TV avec une webcam et je suis un peu frustré de ne pas pouvoir l’utiliser avec le système portal TV par faceb*** que j’ai offert à mon père ce Noël. Saurais tu m orienter pour avoir un client WhatsApp ou Facebook sur ma Smart TV ? Je ne trouve rien dans l’App store de Samsung 🙁
Bonjour Sebuntu,
Je ne pense pas qu’il y ait ces applications dans le store Samsung.
Tu peux peut-être essayer d’utiliser le navigateur web de la TV et d’accéder aux versions web des applications (https://web.whatsapp.com/ ou https://www.messenger.com/). Sur ma TV de 2016, celles-ci ne sont pas compatibles mais tu auras peut-être plus de chance !
N’hésite pas à faire un retour si cela fonctionne 😀
Salut
Je souhaite exporter une appli retrouver sur Samsung TV App shop pour l’installer sur une autre télé (car pas dispo dans la barre de recherche)
Est ce possible ? Je parle de l’application ROOM IPTV de Technoware v1. 1.3
Merci pour ton retour
Bonjour Antoine, je viens de lire vos échanges avec diverses personnes et je ne peux qu’admirer vos compétences. Je vais acquérir prochainement un KIOSK KM24A Samsung qui fonctionne sous TIZEN, n’étant pas connaisseur dans ce domaine, je désire ouvrir un lien internet pour faire tourner l’application »File d’attente EzTurns » qui fonctionne très bien sous un environnement PC / OS / Android. J’imagine que l’ouvrir de ce lien par le biais de TIZEN sera pour vous chose facile ce qui n’est pas le cas pour moi. Ma question est simple, pouvez-vous m’aider dans cette démarche et un grand BRAVO pour votre aide, Merci.