Comment organiser les fichiers JS dans un Appcelerator Titanium projet
J'ai récemment commencé à créer une application iPhone à l'aide Appcelerator de Titane. Depuis l'application est essentiellement tous les JS, j'ai besoin de quelques conseils sur comment je dois organiser ce projet.
Il devient très facile de créer une procédure de fichiers pour chaque affichage dans l'application. Est il possible que je peux intégrer MVC, ou une certaine structure pour le projet?
Merci, je l'apprécie.
-Tilo
- Alors que la question reste d'actualité, notez que certaines des réponses sont de plus obsolète: par maintenant, il y a certains modèles qui sont mentionnés dans les tutoriels et docs officielles - même le bon vieil exemple d'application KitchenSink (aka le roi des rats, des nids) a été remaniée afin de mieux tenir compte des bonnes pratiques.
Vous devez vous connecter pour publier un commentaire.
Titane lui-même est essentiellement MVC étant donné que votre app.js fichier est le contrôleur principal et chaque point de Vue que vous créez est le point de vue et que vous passez (ou l'ensemble) des données de modèle à l'encontre de la vue.
En Titane, vous pouvez décomposer votre application à l'aide d'un couple de nice mécanismes intégrés:
Le titane.inclure - Titane.include permet d'inclure un ou plusieurs fichiers JS dans le place peu comme le C
#include
directive de compilation. Vous pouvez mettre des fonctions communes et JS classes dans ce fichier, puis de les inclure où vous voulez importés et disponible.Le titane.L'INTERFACE utilisateur.createWindow - vous pouvez créer une nouvelle Vue comme une propriété de la nouvelle Fenêtre de passer une URL à un autre JS contexte qui permettra de créer un nouveau JS sous-contexte et de vous permettre de conserver sa variable d'espace (mais encore vous donner accès à vos parents).
Aussi, en Titane, vous pouvez créer des dossiers qui vous permettent logiquement d'organiser votre application dans une manière qui convient à vous et à votre application.
Edit: aujourd'Hui, le Titane.Il y a la méthode est obsolète.
Comme mentionné dans la documentation, nous devrions créer un CommonJS module et de l'utilisation de la
require()
déclaration.Plus d'informations à propos de cette déclaration : Besoin
Plus d'informations sur les modules : Les Modules de
Que je n'étais pas à la recherche d'un MVC solution pour un Titane de projet mobile, je suis venu avec l'approche suivante. Pour les petites applications, cela pourrait être conçu, mais pourrait aider pour le maintien de la croissance des applications.
Structure de dossier:
Pour séparer les points de vue, des modèles et des contrôleurs d'un espace de noms est nécessaire, de sorte que nous les définissons, dans le app.js qui est notre principal contrôleur:
Dans les dossiers que nous endroit unique les fichiers JavaScript pour chaque composant. Pour cela, on peut soit utiliser un JavaScript léger OOP bibliothèque, comme MooTools ou Prototype ou définir de simples JS fonctionne comme nos objets. Si vous aussi vous voulez hérite de l'objet parent les classes, une bibliothèque fait vraiment bon sens.
Exemples:
Après que nous pouvons inclure tous besoin de modèle/vue/contrôleur de classes avec Ti.include() dans le app.js fichier de référence et des composants avec notre espace de noms:
L'approche MVC serait désormais présumer que le contrôleur "contrôles" l'état de la vue et transmet les données à partir du modèle dans la vue. La vue se compose uniquement d'éléments d'INTERFACE utilisateur et les propriétés pour le style. Toute action qui est faite dans l'INTERFACE utilisateur déclenche un événement, qui raconte le contrôleur pour effectuer l'action souhaitée.
Mais bien sûr, la définition exacte de la MVC peut être différent selon votre goût personnel 😉
Ti.include()
est Amorti.Cela peut également aider: Une base struct de comment organiser un Titane de projet mobile: https://github.com/krawaller/Struct
Me permettre de mettre à jour cette question car la plupart des réponses sont remplacées. Au T4 2012, Appcelerator a publié l'Alliage MVC (beta) - Cadre avec la dernière IDE et SDK, Titane Studio 3.0 et le SDK 3.0. Alliage est complètement intégré avec le Studio, donc il est assez facile d'obtenir une base de application qui s'exécute en moins de 15 minutes. Alliage présente un important dossier de restructuration: Le /app dossier est maintenant, alors que tout le code de développement réside.
La /Ressources dossier, là où le code utilisé de résider, est maintenant la mise à jour de l'équivalent de la /construire dossier. Code compilé dans /Ressources est écrasé à chaque build.
J'ai créé une courte introduction d'apprêt (screencast) sur la création d'un Alliage de projet. Vous pouvez le voir via mon dossier dropbox.
Créer En Alliage De Projet
foo.js
enbar.js
et toto a besoin de savoir à ce sujet, il suffit d'ajouter à totovar bar = require('bar.js')
var bar = require('bar');
. N'ajoutez pas l'extension de fichier. Puis, dansfoo.js
, vous pouvez faire référence à la barre de code avecbar.doStuff();
Il ressemble Appcelerator fait leur propre Appcelerator MVC sur le marché, je n'ai pas évalué cette encore.
Plus D'Infos: http://johnkalberer.com/2011/09/29/appcelerator-mvc-example/