行動端重佈局

1. 由於手機螢幕比 PC 端和 Pad 端都小，因此針對以下三種場景的模板製作，手機端需要採用不同的佈局。

2. 下面的報表設計場景中，場景一需要手機重佈局，而場景二、三不需要手機重佈局。

   場景一：做好的決策報表含報表塊等元件，在 PC 和 Pad 以及手機上共用，在 PC 和 Pad 端都是寬高自適應螢幕或者寬高等比例縮放，但是在手機上沒有太大的佈局要求，只需要在手機上面流式佈局展現，即一行一個元件這種情況。

   場景二：在手機上採用原始佈局，PC 端想要和手機共用一套模板，模板設計的時候建議以行動端效果為先。

   場景三：在手機上採用原始佈局，為手機專門製作的模板。

3. 手機重佈局只能在決策報表的 body 元件的行動端屬性下設定，設定項包括：內邊距、元件間隔、元件凍結、控制元件順序。

1

頁邊距。

1. 在右側面板點選【body】，在【行動設備】中勾選【手機重佈局】,在【進階】中，將【邊距】全部設定為10。

2. 如圖2所示，在行動端預覽時可以看到有頁邊距。

2

組件間隔。

1. 在【屬性】→【佈局】中，將【元件間隔】設定為20。

2. 如圖所示，在行動端預覽時可以看到各個元件之間存在間隔。

3

組件凍結。

1. 組件凍結作用範圍如下：

   只能選 body 中第一層非容器下的組件( 報表塊、圖表塊、文字等 )，不能設定凍結容器( tab元件 & 絕對畫布塊 )。

   如果是插件化擴充的非容器組件，也可以選。

   組件可以多選。

2. 在【行動設備】中，點選【組件凍結】後的文字框，選擇chart0，設定組件凍結。

3. 如圖所示，在行動端預覽時可以看到chart0，不會隨著向下滑動而移動。

4

控制元件順序。

1. 在組件順序中可以透過【上移】、【下移】、【排序】調整元件的排列順序。

2. 這裡選擇report0，點選兩次【上移】將其移動到最上方。

3. 如圖所示，在行動端預覽時可以看到report0在最上方。