JavaScript ArcGIS UI.move用法及代碼示例

基本信息

以下是所在類或對象的基本信息。

AMD: require(["esri/views/ui/UI"], (UI) => { /* code goes here */ });

ESM: import UI from "@arcgis/core/views/ui/UI";

類： esri/views/ui/UI

繼承: UI > Accessor

子類： DefaultUI

自從：用於 JavaScript 4.0 的 ArcGIS API

用法說明

UI.move函數(或屬性)的定義如下：

move (component, position)

將一個或多個 UI 組件移動到指定位置。

參數：

規格：

類型說明

component Widget|HTMLElement|String|Object|Array

要移動的組件。該值可以是小部件實例、HTML 元素、表示 DOM 節點 ID 的字符串值或包含任何這些類型組合的數組。有關代碼示例，請參閱下麵的示例片段。或者，您可以傳遞具有以下規範的對象數組。

規格：

component Widget\|HTMLElement\|String	要移動的組件。這可以是小部件實例、HTML 元素、表示 DOM 節點 ID 的字符串值。
position String	可選的目的地位置。如果未提供該組件，該組件將被放置在 UI 容器中。如果不指定，則默認使用`manual`。使用 `manual` 允許您將組件放置在容器中，您可以使用 CSS 將其放置在任何位置。可能的值："bottom-leading"\|"bottom-left"\|"bottom-right"\|"bottom-trailing"\|"top-leading"\|"top-left"\|"top-right"\|"top-trailing"\|"manual"
index Number	可選的組件的放置索引。該索引顯示了相對於其他組件放置組件的位置。例如，當位置為 top-* 時，值為 0 會將其置於最頂部，最左表示左下，最右表示右下。

position String|Object

可選的

目的地位置。如果未提供該組件，該組件將被放置在 UI 容器中。

規格：

position String	可選的視圖中添加組件的位置。如果未指定，則默認使用`manual`。使用 `manual` 允許您將組件放置在容器中，您可以使用 CSS 將其放置在任何位置。可能的值："bottom-leading"\|"bottom-left"\|"bottom-right"\|"bottom-trailing"\|"top-leading"\|"top-left"\|"top-right"\|"top-trailing"\|"manual"
index Number	可選的組件的放置索引。該索引顯示了相對於其他組件放置組件的位置。例如，當位置為 top-* 時，`0` 的值會將其放置在最頂部，最左邊為左下角，最右邊為右下角。

例子：

// Moves the BasemapToggle widget from the view if added.
// See the example for add() for more context
view.ui.move(toggle, "bottom-leading");

// Moves the default zoom widget to the bottom left corner of the view's container
view.ui.move("zoom", "bottom-left");

// Moves multiple widgets to the bottom right of the view's UI
view.ui.move([ compass, toggle, "zoom" ], "bottom-right");

// Moves the legend to the topmost position in the top-right corner of the view's UI.
view.ui.move({component: legend, position: "top-right", index: 0});

相關用法

注：本文由純淨天空篩選整理自arcgis.com大神的英文原創作品 UI.move。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。