ui.SplitPanel
Restez organisé à l'aide des collections
Enregistrez et classez les contenus selon vos préférences.
Widget contenant deux panneaux séparés par une ligne. Vous pouvez faire glisser le séparateur pour redimensionner les panneaux. Un ou les deux panneaux peuvent être des objets ui.Map.
Par défaut, la mise en page s'initialise avec une répartition à 50/50. Les styles "width" et "max/minWidth" des panneaux contrôlent la taille de la division pour les orientations horizontales. De même, utilisez "height" et "max/minHeight" pour la hauteur. Elles peuvent être exprimées en pixels (par exemple, "{n}px") ou en pourcentage du SplitPanel contenant (par exemple, "{n}%").
Notez que la taille indiquée pour le deuxième panneau sera ignorée si la taille du premier panneau est spécifiée, car la largeur globale du panneau fractionné est contrôlée indépendamment. Vous pouvez définir des tailles maximale et minimale pour les deux panneaux.
| Utilisation | Renvoie |
|---|
ui.SplitPanel(firstPanel, secondPanel, orientation, wipe, style) | ui.SplitPanel |
| Argument | Type | Détails |
|---|
firstPanel | ui.Panel, facultatif | Panneau de gauche ou du haut. La valeur par défaut est une nouvelle instance de ui.Panel. |
secondPanel | ui.Panel, facultatif | le panneau inférieur ou de droite. La valeur par défaut est une nouvelle instance de ui.Panel. |
orientation | Chaîne, facultative | Vous devez spécifier "horizontal" ou "vertical". La valeur par défaut est "horizontal". |
wipe | Booléen, facultatif | Indique si l'effet d'effacement doit être activé. Lorsque ce mode est activé, les deux panneaux occupent tout l'espace disponible. Le fait de faire glisser le séparateur ne définit pas la taille des panneaux, mais plutôt la partie de chaque panneau qui est affichée. Cet effet est analogue à une "transition d'essuyage". Ce mode est utile pour comparer deux cartes. Valeur par défaut : "false". |
style | Objet, facultatif | Objet des styles CSS autorisés avec leurs valeurs à définir pour ce panneau. La valeur par défaut est un objet vide. |
Sauf indication contraire, le contenu de cette page est régi par une licence Creative Commons Attribution 4.0, et les échantillons de code sont régis par une licence Apache 2.0. Pour en savoir plus, consultez les Règles du site Google Developers. Java est une marque déposée d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/07/26 (UTC).
[null,null,["Dernière mise à jour le 2025/07/26 (UTC)."],[[["\u003cp\u003eThe \u003ccode\u003eui.SplitPanel\u003c/code\u003e widget divides a UI element into two resizable panels, horizontally or vertically.\u003c/p\u003e\n"],["\u003cp\u003ePanel sizes can be customized using width/height and min/max dimensions, expressed in pixels or percentages.\u003c/p\u003e\n"],["\u003cp\u003eThe \u003ccode\u003ewipe\u003c/code\u003e option allows for a transition-like effect, ideal for comparing two map panels by overlaying them.\u003c/p\u003e\n"],["\u003cp\u003eThe split panel's default layout divides the space equally between the two panels.\u003c/p\u003e\n"],["\u003cp\u003eUsers can specify custom CSS styles to further customize the appearance of the \u003ccode\u003eui.SplitPanel\u003c/code\u003e.\u003c/p\u003e\n"]]],[],null,["# ui.SplitPanel\n\n\u003cbr /\u003e\n\nA widget containing two panels with a divider between them. The divider can be dragged, allowing the panels to be resized. One or both panels may be ui.Map objects.\n\n\u003cbr /\u003e\n\nBy default the layout initializes with a 50/50 split. The width and max/minWidth styles on the panels control the split sizing for horizontal orientations. Similarly, use height and max/minHeight for vertical. These can be given in pixels as '{n}px' or as a percentage of the containing SplitPanel as '{n}%'.\n\nNote that the given size for the second panel will be ignored if the first panel size is specified, since the overall width of the split panel is controlled independently. Max/min sizes may be set for both panels.\n\n| Usage | Returns |\n|--------------------------------------------------------------------------------------------|---------------|\n| `ui.SplitPanel(`*firstPanel* `, `*secondPanel* `, `*orientation* `, `*wipe* `, `*style*`)` | ui.SplitPanel |\n\n| Argument | Type | Details |\n|---------------|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| `firstPanel` | ui.Panel, optional | The left or top panel. Defaults to a new instance of ui.Panel. |\n| `secondPanel` | ui.Panel, optional | The bottom or right panel. Defaults to a new instance of ui.Panel. |\n| `orientation` | String, optional | One of \"horizontal\" or \"vertical\". Defaults to \"horizontal\". |\n| `wipe` | Boolean, optional | Whether to enable the wiping effect. When this mode is enabled, both panels take up all available space, and dragging the divider doesn't set the size of the panels but rather determines how much of each panel is shown. This effect is analogous to a \"wipe transition\". This mode is useful for comparing two maps. Defaults to false. |\n| `style` | Object, optional | An object of allowed CSS styles with their values to be set for this panel. Defaults to an empty object. |"]]
