Nous avons déjà vu quelques caractéristiques de fenêtres. Nous allons en aborder d'autres dans cette section.
Créer une autre fenêtre
Vous pouvez créer une seconde fenêtre pour votre application de la même manière que vous avez créé la première. Il suffit de créer un second fichier XUL contenant le code de la nouvelle fenêtre. Comme en HTML, vous pouvez utiliser la fonction window.open()
pour ouvrir la seconde fenêtre. Cette fonction retournera une référence à la fenêtre nouvellement ouverte. Vous pouvez utiliser cette référence pour appeler des fonctions de l'autre fenêtre.
La fonction open
prend trois arguments. Le premier est l'URL du fichier que vous souhaitez ouvrir. Le deuxième est le nom interne de la fenêtre. Le troisième est une liste de drapeaux de paramètres d'affichage. Le drapeau chrome
est important pour ouvrir la fenêtre comme un fichier chrome. Si vous n'ajoutez pas le drapeau chrome
, le fichier sera ouvert dans une nouvelle fenêtre du navigateur.
Par exemple :
var myWin = window.open("chrome://findfile/content/findfile.xul","findfile","chrome");
Spécifier la largeur et la hauteur
Vous aurez noté que lorsque des éléments sont ajoutés à une fenêtre, la largeur de la fenêtre s'étend pour s'adapter aux nouveaux éléments. La fenêtre n'est en fait qu'une boîte flexible et qui prend par défaut une orientation verticale. Vous pouvez également spécifier la largeur et la hauteur directement dans la balise window
. Cela, bien sûr, oblige la fenêtre à prendre une taille spécifique. Si vous ôtez ces spécifications, la taille sera déterminée par les éléments qui la constituent.
<window id="findfile-window" title="Recherche de fichiers" width="400" height="450" xmlns="https://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
Dans cet exemple, la fenêtre sera ouverte avec une largeur de 400 pixels et une hauteur de 450 pixels. Même s'il n'y a pas assez d'éléments pour lui faire adopter cette taille, la fenêtre s'ouvrira toujours à cette taille et il y aura un espace vierge dans l'espace restant. S'il y a trop d'éléments, la fenêtre n'adaptera pas ses dimensions pour en tenir compte. L'utilisateur devra alors redimensionner la boîte de dialogue. Vous devez faire attention, lorsque vous spécifiez une largeur et une hauteur, à ce que la fenêtre ne soit ni trop petite, ni trop grande. Vous devez considérer les thèmes graphiques ou la langue propres à l'utilisateur.
La largeur et la hauteur déterminent seulement la taille initiale de la fenêtre. L'utilisateur peut toujours redimensionner la fenêtre, à condition que celle-ci soit redimensionnable.
Autres propriétés de fenêtre
Les drapeaux ci-après peuvent être utilisés comme troisième argument de la fonction window.open
. Votre système d'exploitation peut ne pas les supporter tous. Vous pouvez également utiliser un des drapeaux pré-existants, que vous devriez trouver dans une référence JavaScript. Vous pouvez désactiver une propriété en la réglant sur 'no', par exemple dialog='no'
.
alwaysLowered
- La fenêtre apparaîtra toujours derrière les autres fenêtres.
alwaysRaised
- La fenêtre apparaîtra toujours devant les autres fenêtres.
centerscreen
- À son ouverture, la fenêtre sera centrée à l'écran.
dependent
- La position de la fenêtre sera toujours relative à la fenêtre qui l'a ouverte. Si la position de la fenêtre initiale est modifiée, la seconde fenêtre bougera automatiquement de même manière.
dialog
- la fenêtre est une boîte de dialogue pouvant apparaître différemment.
modal
- La boite de dialogue est modale. La fenêtre qui a ouvert la fenêtre modale ne peut pas être utilisée tant que la fenêtre modale n'est pas fermée.
resizable
- L'utilisateur peut redimensionner la fenêtre.
Voir également la référence DOM de window.open().
Nous allons voir ensuite comment ouvrir des boîtes de dialogue secondaires.
Interwiki