Ce que je fais habituellement dans ce genre de situations est la conception de la page web cadre de la première. Je vais avoir un div pour l'en-tête, le menu latéral et le pied de page. Je vais aussi avoir un div
dans mon code HTML pour le contenu principal.
Exemple:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name='gwt:module' content='org.project.package.Core=org.project.package.Core'>
</head>
<body>
<!-- Load the JavaScript code for GWT -->
<script language="javascript" src="ui/org.project.package.ui.Core.nocache.js"></script>
<!-- For some unknown reason in Internet Explorer you have to have cellpadding/spacing ON THE ELEMENT and not on the STYLE if it is in the body tag like this -->
<table id="wrapper" cellpadding="0" cellspacing="0" style="width: 100%;height: 100%;">
<!-- Header row -->
<tr style="height: 25%;">
<td colspan="2" id="header"></td>
</tr>
<!-- Body row and left nav row -->
<tr style="height: 65%;">
<td id="leftnav"></td>
<td id="content"></td>
</tr>
<!-- Footer row -->
<tr style="height: 10%;">
<td colspan="2" id="footer"></td>
</tr>
</table>
<!-- This iframe handles history -->
<iframe id="__gwt_historyFrame" style="width:0;height:0;border:0"></iframe>
</body>
</html>
(Si vous le souhaitez <div> base de mises en page, n'hésitez pas à les utiliser à la place.)
Alors que vous construisez votre point d'entrée (dans mon cas Core.java
) comme vous le feriez normalement, le réglage de chacun des éléments en tant que de besoin.
RootPanel.get("header").add(new Header());
RootPanel.get("leftnav").add(new NavigationMenu());
RootPanel.get("footer").add(new Footer());
Il est, bien sûr, possible d'avoir une statique du pied de page et en-tête, mais c'est ni ici ni là.
J'ai aussi une classe abstraite appelée "Contenu". Les objets de contenu étendre "Composite" et ont différentes méthodes pour simplifier la création et la présentation d'une nouvelle page. Chaque page que j'ai créer pour cette application, que ce soit un écran d'aide, à l'écran de recherche, panier d'achat, ou quoi que ce soit d'autre, est de type Content
.
Maintenant, ce que j'ai à faire est de créer une classe appelée "ContentContainer". C'est un singleton qui est responsable de la gestion du "contenu" de l'élément. Il a une méthode "setContent" qui accepte les objets de type "Contenu". Ensuite, il élimine en principe rien dans le "contenu" <td> et le remplace avec ce widget (Composite) est attribué par le "setContent" la méthode. Le setContent méthode traite aussi de l'histoire et de la barre de titre de la gestion. Fondamentalement, la ContentContainer sert à regrouper tous les différents points de liaison que vous avez à faire si chaque contenu de la page a à "savoir" à propos de toutes les fonctions qu'il doit effectuer.
Enfin, vous avez besoin d'un moyen pour arriver à cette page, à droite? C'est simple:
ContentContainer.getInstance().setContent(new Search());
Mettre le ci-dessus dans le cadre d'un événement de clic quelque part et que vous êtes d'or.
Les seules choses que vos autres widgets besoin d'être lié à la ContentContainer et le type de Contenu qu'ils ajoutent.
Les inconvénients que je peux voir à ChrisBo de l'approche, vous avez une liste qui doit être maintenu de jetons -> pages. L'autre inconvénient que je peux voir, c'est que je ne vois pas comment vous pouvez avoir une histoire réelle du système avec cette méthode.
Une chose qu'il ne proposons plus de mon approche, c'est que tous les choix sont assez centralisée. Je voudrais utiliser une sorte de Enum ou au moins une classe statique avec les valeurs de Chaîne m'empêcher de mongling des liens.
Dans les deux cas, je pense que le point peut être résumé comme ceci: permuter le contenu de certains élément de la page en fonction de ce que votre utilisateur clique sur les actions de votre utilisateur(s) effectuer.