10月27日，活字開發(fā)團隊負(fù)責(zé)人雷作為嘉賓代表葡萄城參加了掘金稀土開發(fā)者大會。在低代碼探索的話題分享中，他首次揭示了活字最受專業(yè)開發(fā)人員歡迎的三大特性及其實現(xiàn)原理。讓我們來看看低代碼如何贏得程序員的心。本文將重點介紹三個功能:自由設(shè)計頁面布局和樣式。

低代碼是一種覆蓋軟件開發(fā)整個生命周期的可視化解決方案。在用戶界面設(shè)計階段，低代碼開發(fā)平臺應(yīng)該提供什么樣的設(shè)計模式才能在保證高度定制的基礎(chǔ)上盡可能提高開發(fā)效率？為了解決這個問題，活字的開發(fā)團隊決定從“視覺開發(fā)”的源頭尋找思路。

作為微軟最早的合作伙伴，葡萄城不僅為微軟平臺開發(fā)者提供了大量控件，而且對平臺的技術(shù)特點及其背后的實現(xiàn)原理有著深刻的理解。在開發(fā)WinForm程序的時代，Visual Studio的用戶將控件拖動到窗體中，IDE會根據(jù)控件的位置和層次關(guān)系自動生成包含這些信息的代碼。運行時，這些代碼按順序執(zhí)行，與設(shè)計一致的樣式被還原和提取，以達(dá)到所見即所得的效果。這種開發(fā)模式已經(jīng)迅速成為Windows程序開發(fā)的標(biāo)準(zhǔn)模式。程序員無需運行程序就可以在設(shè)計器上看到頁面布局的效果。截至目前，用友U8+這款市場上用戶群體最大的ERP軟件，正是基于微軟技術(shù)棧以這種可視化方式開發(fā)的，在用戶體驗層面得到了企業(yè)用戶的廣泛認(rèn)可。

（用Visual Studio開發(fā)WinForm程序的經(jīng)驗）

因此，活字格將這種設(shè)計思想應(yīng)用到網(wǎng)頁的開發(fā)中，結(jié)合Excel的操作經(jīng)驗，最終提供了一種基于絕對坐標(biāo)的頁面設(shè)計方案。根據(jù)不同的應(yīng)用場景，該方案有“固定布局”和“網(wǎng)格布局”兩種模式

固定布局

固定布局是活字的默認(rèn)做法。開發(fā)人員在設(shè)計器中像Excel一樣在網(wǎng)格中完成頁面元素的布局和樣式設(shè)置。設(shè)計師在發(fā)布時會將帶有絕對坐標(biāo)的頁面設(shè)計存儲為模型文件并上傳到服務(wù)器；最終用戶瀏覽器中運行的解析引擎會將元數(shù)據(jù)恢復(fù)到與設(shè)計器中一致的Web界面。

（固定布局可以實現(xiàn)嚴(yán)格意義上的所見即所得）

除了所見即所得帶來的高開發(fā)效率外，這種設(shè)計體驗還具有以下三個明顯的優(yōu)勢:靈活的布局:開發(fā)人員可以將任何元素放置在頁面上的任何位置并將其設(shè)置為任何樣式，而不必拘泥于平臺內(nèi)置的模板。門檻更低:頁面布局和樣式設(shè)置的方式與Excel高度相似，全程可視化；開發(fā)人員無需具備CSS知識即可完成頁面設(shè)計；對于熟悉CSS的開發(fā)人員來說，可移動類型還提供了進(jìn)一步調(diào)整樣式的能力。兼容性好:可移動類型的元數(shù)據(jù)解析引擎不依賴于任何第三方JS框架或CSS樣式庫，可以保證頁面在不同瀏覽器和設(shè)備上的性能一致。

此外，如果開發(fā)目標(biāo)是替換現(xiàn)有的Excel模板，或者需求方提供的設(shè)計方案是用Excel描述的，開發(fā)人員也可以直接將Excel文件導(dǎo)入到活字中。Movable type會根據(jù)Excel自動生成頁面，還原內(nèi)容和大部分樣式，進(jìn)一步減少頁面開發(fā)的工作量。

（“仿紙文檔”頁面使用活字開發(fā)）

網(wǎng)格布局

固定布局可以確保最終的頁面布局與預(yù)期完全一致，它通常用于開發(fā)需要非常嚴(yán)格的界面布局的場景，例如那些需要延續(xù)現(xiàn)有體驗并降低用戶培訓(xùn)成本的內(nèi)部應(yīng)用程序。然而，對于面向外部用戶的應(yīng)用程序，開發(fā)人員通常需要提供更“現(xiàn)代”的界面來提高用戶滿意度。此時，活字提供的“網(wǎng)格布局”就派上用場了。

類似于固定布局參考WinForm的設(shè)計思想，網(wǎng)格布局的設(shè)計思想起源于WPF。為了根據(jù)屏幕大小自動調(diào)整頁面布局，WPF提供了網(wǎng)格布局控件，并允許開發(fā)人員通過在Grid.ColumnDefinition中設(shè)置width =“25 *“來控制每個元素的大小比例。簡單地說，在固定布局的基礎(chǔ)上，將頁面元素的絕對定位坐標(biāo)轉(zhuǎn)換為可以根據(jù)設(shè)定規(guī)則計算的動態(tài)坐標(biāo)，從而實現(xiàn)網(wǎng)格布局。

在活字頁面設(shè)計界面中，元素的絕對定位坐標(biāo)由所在單元格確定，單元格的位置以行和列描述。當(dāng)我們將這些行和列設(shè)置為“根據(jù)內(nèi)容自適應(yīng)”或“在指定范圍內(nèi)按比例分布”時，絕對定位的坐標(biāo)就變成了根據(jù)規(guī)則計算的動態(tài)坐標(biāo)。這種方法一方面提供了更靈活的頁面布局方法，另一方面由于延續(xù)了固定布局的使用體驗而不是將其分離出來，最終使得活字頁面布局的學(xué)習(xí)曲線更加平滑，開發(fā)者更容易上手。

（使用網(wǎng)格布局開發(fā)的頁面效果）

不同的應(yīng)用場景和最終用戶群體對頁面布局和樣式的要求完全不同。作為一種開發(fā)工具，低代碼平臺應(yīng)該允許開發(fā)人員自由開發(fā)各種風(fēng)格的頁面，但許多低代碼平臺并沒有這樣做。因此，很容易理解“以固定布局和網(wǎng)格布局自由設(shè)計頁面”被選為程序員最喜歡的活字功能。

在低代碼領(lǐng)域，葡萄城有著自己得天獨厚的條件。在2012年開始低代碼預(yù)研之前，葡萄城已經(jīng)專注于軟件開發(fā)工具領(lǐng)域32年，并先后推出了基于VBX、COM、。NET和純前端技術(shù)平臺，并根據(jù)技術(shù)環(huán)境和用戶需求的變化積極迭代產(chǎn)品和技術(shù)，不斷減少軟件開發(fā)所需的代碼，提高軟件開發(fā)生產(chǎn)率，積累了豐富的技術(shù)實力和領(lǐng)先的R&D經(jīng)驗。經(jīng)過四年的研發(fā)，活字低代碼開發(fā)平臺于2016年正式上線。為了與更多開發(fā)商共同創(chuàng)造和建設(shè)，葡萄城對開發(fā)商采取了免費的商業(yè)模式。迄今為止，已有超過6萬名開發(fā)人員通過活字印刷踏上了低代碼開發(fā)之旅，其中包括許多來自軟件公司和大型企業(yè)信息部門的專業(yè)開發(fā)人員。

如果你是一名對低代碼技術(shù)持觀望態(tài)度的開發(fā)者，不妨搜索“活字”，免費下載這款由數(shù)萬名開發(fā)者評選出的企業(yè)級低代碼開發(fā)平臺，與葡萄城一起開啟你的低代碼之旅吧！