ui.SplitPanel
Zadbaj o dobrą organizację dzięki kolekcji
Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Widżet zawierający 2 panele rozdzielone separatorem. Możesz przeciągnąć separator, aby zmienić rozmiar paneli. Jeden lub oba panele mogą być obiektami ui.Map.
Domyślnie układ jest inicjowany z podziałem 50/50. Style width i max/minWidth na panelach kontrolują rozmiar podziału w przypadku orientacji poziomej. Podobnie w przypadku elementów pionowych użyj właściwości height i max/minHeight. Można je podać w pikselach jako „{n}px” lub jako procent zawierającego elementu SplitPanel jako „{n}%”.
Pamiętaj, że podany rozmiar drugiego panelu zostanie zignorowany, jeśli określono rozmiar pierwszego panelu, ponieważ ogólna szerokość podzielonego panelu jest kontrolowana niezależnie. Maksymalne i minimalne rozmiary można ustawić dla obu paneli.
| Wykorzystanie | Zwroty |
|---|
ui.SplitPanel(firstPanel, secondPanel, orientation, wipe, style) | ui.SplitPanel |
| Argument | Typ | Szczegóły |
|---|
firstPanel | ui.Panel, opcjonalnie | Panel po lewej stronie lub u góry. Domyślnie jest to nowa instancja ui.Panel. |
secondPanel | ui.Panel, opcjonalnie | w dolnym lub prawym panelu. Domyślnie jest to nowa instancja ui.Panel. |
orientation | Ciąg znaków, opcjonalnie | Wartość „horizontal” lub „vertical”. Domyślnie jest to „horizontal”. |
wipe | Wartość logiczna, opcjonalna | Czy włączyć efekt wycierania. Gdy ten tryb jest włączony, oba panele zajmują całą dostępną przestrzeń, a przeciąganie separatora nie ustawia rozmiaru paneli, tylko określa, ile miejsca zajmuje każdy z nich. Ten efekt jest analogiczny do „przejścia z przesunięciem”. Ten tryb przydaje się do porównywania dwóch map. Wartość domyślna to fałsz. |
style | Obiekt (opcjonalnie) | Obiekt dozwolonych stylów CSS z wartościami, które mają zostać ustawione w tym panelu. Domyślnie jest to pusty obiekt. |
O ile nie stwierdzono inaczej, treść tej strony jest objęta licencją Creative Commons – uznanie autorstwa 4.0, a fragmenty kodu są dostępne na licencji Apache 2.0. Szczegółowe informacje na ten temat zawierają zasady dotyczące witryny Google Developers. Java jest zastrzeżonym znakiem towarowym firmy Oracle i jej podmiotów stowarzyszonych.
Ostatnia aktualizacja: 2025-07-26 UTC.
[null,null,["Ostatnia aktualizacja: 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. |"]]
