最近在學習使用ivx進行開發的過程中，對響應式佈局/自適應佈局/寬度自適應（相對定位）方面的開發頗有收穫，自己總結了些經驗希望能和大家分享下。爲了方便，我針對官網的demo柵格系統，進行了以下分析：
1.自適應佈局的核心組件要用到相對行的環境寬，單個模板的進行設計的時候通過設置環境寬變化時模塊的寬度，可以實現不同環境寬時都能美觀合適地展示模塊，我多少試驗後發現環境寬較大時，將模塊寬度就設置小一點，這樣每行顯示的模塊數量就會變多，看起來不會太分散，同理，環境寬較小時就設置大一點，這樣每行顯示的模塊數量就會變少，看起來不會太擁擠，具體設置在後文中會說明。
2.首先的話，多個模板肯定要用到很多組相同的數據，所以建議先新建一個數組，將需要展示的模塊數據導入數組，然後在首頁下創建相對行，作爲導航欄，這裏demo中導航欄的寬度爲100%，因爲導航欄要自適應網頁的寬度，所以寬度設置爲百分比，再在相對行容器下添加對象，demo中選擇的是等間距的水平對齊方式，這樣能讓對象隨着網頁寬度變化撐滿導航欄，如果想要讓所有對象都保持在一塊，就選擇其他的水平對齊方式
3.導航欄完成後，我們再看主體的編輯方式，demo中採用了在一個居中對齊的相對行中再添加80%寬度內容區的方法，這樣可以讓模板與網頁邊緣保持20%網頁寬度距離，看起來更美觀舒適，不會出現邊框遮擋模板的情況。這裏內容區使用等間距的水平對齊方式，使模板儘量鋪滿網頁且排列整齊，接着創建一個模板循環，將循環與模板數據綁定起來，就可以進行單個模板的設計了。
4.接下來是最關鍵的地方，demo中我們將環境寬較大時的模塊寬度設置爲30%，這樣每行就會顯示3個模塊（總寬度爲100%，3個模塊平均下來就是33%，但每個模塊之間要有間距，所以這裏設置爲30%比較合適），環境款較小時的模塊寬度設置爲45%（總寬度爲100%，2個模塊平均下來就是50%，但每個模塊之間要有間距，所以這裏設置爲45%比較合適），這樣每行就會顯示2個模塊，同理，環境寬爲手機寬的時候，將模塊寬度設置爲100%,這樣1行就只有1個模塊充斥這個行。
最後，分享下我的心得，UI組件的選擇和行列排列方式需要多練習，有紮實的基礎功才能繼續往前走，環境寬的設置是我認爲自行應佈局中最重要的一環，還需要多熟悉，ivx總能帶給我很多驚喜，在以後不斷的學習開發過程中我會繼續給大家分享自己的心得和經驗的。