Comment faire mes applications « skinnable »?

Question

est-il un moyen standard pour faire mes applications skinnable?

Par « skinnable » Je veux dire la capacité de l'application à supporter de multiples peaux.

Je ne vise aucune plate-forme particulière ici. Je veux juste savoir s'il y a des directives générales pour la réalisation des applications skinnable.

Il ressemble à écorcher des applications web est relativement facile. Qu'en est-il des applications de bureau?

Answer 1

Skins sont juste encore un autre niveau d'abstraction (YALOA!).

Si vous lisez sur le modèle de conception MVC vous comprendrez bon nombre des principes nécessaires.

La couche de présentation (ou la peau) n'a qu'à faire quelques petites choses:

• Afficher l'interface
• Lorsque certaines actions sont prises (en cliquant, saisir du texte dans une boîte, etc.), il déclenche des actions
• Il doit recevoir des avis du modèle et contrôleur quand il a besoin de changer

Dans un programme normal, cette abstraction se fait par le code ayant qui relie les zones de texte aux méthodes et aux objets qu'ils sont liés à, et ayant un code qui change l'affichage en fonction des commandes du programme.

Si vous voulez ajouter écorcher vous devez prendre cette capacité et faire en sorte que peut être fait sans compiler le code.

Consultez, par exemple, XUL et voir comment il est fait là-bas. Vous trouverez beaucoup de projets écorcher utilisent XML pour décrire les différents « visages » de la peau (il jouer de la musique, ou l'organisation de la bibliothèque pour une peau de lecteur MP3), puis où chaque commande se trouve et quelles données et méthodes il devrait être fixé dans le programme.

Il peut sembler difficile jusqu'à ce que vous le faites, alors vous vous rendez compte qu'il est comme tout autre niveau d'abstraction que vous avez traité avant (d'un programme avec GOTO, pour le contrôle des, aux fonctions, aux structures, aux classes et objets , de compilateurs JIT, etc).

La courbe d'apprentissage initiale n'est pas trivial, mais faire quelques projets et vous verrez qu'il est pas difficile.

-Adam

Answer 2

Gardez tous vos styles dans un fichier CSS séparé (s)

Restez à l'écart de tout style en ligne

Answer 3

Cela dépend vraiment de la façon dont « skinnable » vous voulez que vos applications soient. Permettre à l'utilisateur de configurer les couleurs et les images va être beaucoup plus facile que de laisser les cacher / supprimer des composants ou même écrire leurs propres composants.

Pour la plupart des cas, vous pouvez probablement vous en sortir avec écrit une sorte de fournisseur de ressources qui sert des couleurs et des images au lieu de les coder en dur dans votre fichier source. Donc, ceci:

Color backgroundColor = Color.BLUE;

Deviendrait quelque chose comme:

Color backgroundColor = ResourceManager.getColor("form.background");

Alors, tout ce que vous devez faire est de changer les mises en correspondance dans votre classe ResourceManager et tous les clients seront compatibles. Si vous voulez faire en temps réel, en changeant une des applications du ResourceManager probablement envoyer un événement à ses clients et les informer que quelque chose a changé. Ensuite, les clients peuvent redessiner leurs composants s'ils veulent.

Answer 4

La mise en œuvre varie selon la plate-forme, mais voici quelques considérations générales multiplateformes:

• Il est bon d'avoir un plan d'ensemble mis en place dans lequel les éléments visuels peuvent être « branchés ». Il est plus difficile (mais possible) pour soutenir dispositions générales complètement différentes par skinning.
• Développer une convention de nommage bien documenté pour les actifs (images, fragments HTML, etc.) qui composent une peau.
• Conception d'une manière propre à « découvrir » les peaux existantes et ajouter de nouvelles. Par exemple: Winamp utilise un format de fichier ZIP pour stocker toutes les images pour ses peaux. Tous les fichiers de la peau se trouvent dans un dossier bien connu hors du dossier de l'application.
• Soyez au courant des questions d'échelle. Pas tout le monde utilise la même résolution d'écran.
• Vous allez permettre le développement de la peau tiers? Cela aura une incidence sur votre conception.
• Architecturalement, le modèle Model-View-Controller se prête à écorcher.

Ce ne sont que quelques petites choses à connaître. Votre mise en œuvre varie entre web et client de graisse et par vos exigences de fonctionnalité. HTH.

Answer 5

Le principe de base est celui utilisé par CSS dans les pages Web.

Plutôt que jamais spécifier la mise en forme (couleur / police / mise en page [dans une certaine mesure]) de votre contenu, vous décrivez simplement ce type de contenu est.

Pour donner un exemple de web, dans le contenu d'une page de blog que vous pouvez marquer des sections différentes comme étant un:

1. Titre
2. Blog Entrée
3. Volet Archive

etc.

L'entrée peut être des sous-sections severl comme « position », « corps » et « horodatage ».

Alors, ailleurs, vous avez une feuille de style qui spécifie toutes les propriétés de chaque type d'élément, la taille, l'alignement, la couleur, arrière-plan, la police, etc. Lors du rendu de la page ou srawing / initialisant les componatns dans votre interface utilisateur vous consultez toujours le courant stylesheet pour rechercher ces propriétés.

Alors, skinning, et même l'édition de votre conception, devient beaucoup plus facile. Vous créez simplement un autre feuille de style et ajuster les valeurs au contenu de votre chaleur.

Edit:

Un point essentiel à retenir est la distinction entre un style général (comme les classes en CSS) et un style spécifique (comme les ID CSS). Vous voulez être en mesure d'identifier de manière unique certains éléments dans votre mise en page, tels que le titre, comme étant un seul élément identifiable que vous pouvez appliquer un style unique, alors que d'autres éléments (comme une entrée dans un blog ou un champ une vue de base de données) voudront tous avoir le même style.

Answer 6

Il est différent pour chaque plate-forme / technologie.

Pour WPF, jetez un oeil à ce que Josh Smith appelle skinning structurel: http: / /www.codeproject.com/KB/WPF/podder2.aspx

Answer 7

Cela devrait être relativement facile, procédez comme suit:

1. Strip toutes style pour votre application Web entière ou site web
2. Utilisez pour changer css la façon dont votre application a l'air.

Pour plus d'informations, visitez jardin css zen pour des idées.

Answer 8

Vous ne devriez pas. Ou au moins vous devriez vous demander si c'est vraiment la bonne décision.

dépecer brise les lignes directrices de conception de l'interface utilisateur. Il « jarres » l'utilisateur parce que votre application fonctionne à la peau et semble tout à fait différente de toutes les autres applications utilisant leur. Des choses comme des touches de raccourci de commande ne seront pas cohérents et ils vont perdre la productivité. Il sera moins accessible aux personnes handicapées parce que les lecteurs d'écran auront plus de mal à comprendre.

Il y a une tonne de raisons de ne pas la peau. Si vous voulez juste faire votre demande visuellement distincte, qui est une mauvaise raison, à mon avis. Vous rendre votre application plus difficile à utiliser et moins susceptibles que les gens vont jamais aller au-delà de la période d'essai.

Ceci étant dit, il y a certaines classes d'applications où skinning est essentiellement prévu, comme les lecteurs multimédias et imersive jeux en plein écran. Mais si votre application n'est pas dans une classe où skinning est en grande partie le mandat, je songerais sérieusement à trouver d'autres façons de rendre votre application mieux que vos concurrents.

Answer 9

En fonction de la profondeur que vous souhaitez creuser, vous pouvez choisir d'utiliser un cadre de « formatage » (par exemple Java de PLAF, CSS du Web), ou une architecture de niveaux multiples entièrement découplé.

Si vous voulez définir une peau connectables, vous devez considérer que dès le début. La couche de présentation sait rien à propos de la logique métier, mais il est API et vice versa.

Answer 10

Il semble que la plupart des gens ici se réfèrent à CSS, comme si son la seule option de dépeçage. Windows Media Player (et Winamp, AFAIR) utiliser XML ainsi que des images (si neccesary) pour définir une peau.

Les crochets références XML, événements, etc. et gère la façon dont les choses sont et réagissent. Je ne suis pas sûr de la façon dont ils gèrent l'arrière, mais le chargement d'une peau donnée est vraiment aussi simple que localiser le fichier XML approprié, charger les images puis les placer là où ils doivent aller.

XML vous donne également beaucoup plus de contrôle sur ce que vous pouvez faire (à savoir créer de nouveaux composants, modifier la taille des composants, etc.).

XML combiné avec CSS pourrait donner des résultats merveilleux pour un moteur skinning d'un bureau ou d'une application web.