[發(fā)明專利]一種結(jié)合絕對(duì)定位和流式定位的畫布定位方法

在審

• 申請(qǐng)?zhí)枺?/td>: 202310799674.1
• 申請(qǐng)日: 2023-07-03
• 公開（公告）號(hào): CN116540996A
• 公開（公告）日: 2023-08-04
• 發(fā)明（設(shè)計(jì)）人: 謝云光;戴文艷;楊斌;黃彥予;侯建洪;葉威鑫;劉駿
• 申請(qǐng)（專利權(quán)）人: 長(zhǎng)威信息科技發(fā)展股份有限公司
• 主分類號(hào): G06F8/34
• 分類號(hào): G06F8/34;G06F8/38;G06F3/0486
• 代理公司: 福建昇云知識(shí)產(chǎn)權(quán)代理有限公司 35305
• 代理人: 王丹

1.一種結(jié)合絕對(duì)定位和流式定位的畫布定位方法，其特征在于，包括以下步驟：

將應(yīng)用設(shè)計(jì)器的畫布設(shè)置為絕對(duì)定位position：absolute；

在畫布中開辟一個(gè)區(qū)域?qū)ｉT作為流式布局空間，并通過應(yīng)用設(shè)計(jì)器內(nèi)置的容器組件關(guān)聯(lián)流式片段；

通過在絕對(duì)畫布中拖拽容器組件到指定區(qū)域，并通過容器組件對(duì)指定的流式片段進(jìn)行載入渲染。

2.根據(jù)權(quán)利要求1所述的一種結(jié)合絕對(duì)定位和流式定位的畫布定位方法，其特征在于，所述畫布設(shè)置父節(jié)點(diǎn)為position:?relative,子節(jié)點(diǎn)設(shè)置為position:?absolute。

3.根據(jù)權(quán)利要求1所述的一種結(jié)合絕對(duì)定位和流式定位的畫布定位方法，其特征在于，所述流式布局空間通過采用element-plus布局容器組件來實(shí)現(xiàn)頁面的流式布局，具體如下：

通過el-row將頁面一行分成24份來渲染，在el-row下嵌套了el-col?通過設(shè)置el-col?span?屬性將元素按照比例來渲染；

在容器組件中，將容器組件父節(jié)點(diǎn)設(shè)置position：absolute作為絕對(duì)定位進(jìn)行對(duì)容器組件任意位置的拖拽，將其子節(jié)點(diǎn)采用el-row組件進(jìn)行渲染，然后通過指定的片段配置項(xiàng)，將片段內(nèi)的控件信息用el-col標(biāo)簽渲染到的el-row標(biāo)簽下。

4.根據(jù)權(quán)利要求1所述的一種結(jié)合絕對(duì)定位和流式定位的畫布定位方法，其特征在于，遍歷讀取當(dāng)前應(yīng)用的所有的片段信息并以樹形式展示給用戶選擇，用戶通過選擇完對(duì)應(yīng)的片段，將片段的配置信息進(jìn)行讀取，并通過容器組件按照片段的類型對(duì)片段內(nèi)容進(jìn)行渲染。

5.一種結(jié)合絕對(duì)定位和流式定位的畫布定位系統(tǒng)，其特征在于，包括處理器、存儲(chǔ)器、通信接口和通信總線，所述處理器、所述存儲(chǔ)器和所述通信接口通過所述通信總線完成相互間的通信；所述存儲(chǔ)器用于存放至少一可執(zhí)行指令，所述可執(zhí)行指令使所述處理器執(zhí)行如下操作：

將應(yīng)用設(shè)計(jì)器的畫布設(shè)置為絕對(duì)定位position：absolute；

在畫布中開辟一個(gè)區(qū)域?qū)ｉT作為流式布局空間，并通過應(yīng)用設(shè)計(jì)器內(nèi)置的容器組件關(guān)聯(lián)流式片段；

通過在絕對(duì)畫布中拖拽容器組件到指定區(qū)域，并通過容器組件對(duì)指定的流式片段進(jìn)行載入渲染。

6.一種計(jì)算機(jī)存儲(chǔ)介質(zhì)，其特征在于，所述計(jì)算機(jī)存儲(chǔ)介質(zhì)存儲(chǔ)有多條指令，所述指令適于由處理器加載并執(zhí)行如權(quán)利要求1～4任意一項(xiàng)的方法步驟。