1.
對於移動開發來說，視覺化開發工具已經是必不可少的了。但是大多數的 iOS 和 Android 開發者，可能都沒怎麼用過 xCode 或 Android Studio 中的視覺化工具。因為覺得通過拖拽元件的方式，在佈局的時候，精準度還是會差了一些，而且可能經常會加上一些多餘的引數。
最開始我也用的很少，不過自從去年的谷歌 IO 大會之後，我才發現，原來 Android Studio 的視覺化佈局工具已經這麼好用了。從那之後，我在開發中就會經常用到了，而且將視覺化和程式碼佈局的方式相結合起來，效率可以提高不少。
然而 React Native 雖然是移動開發技術，但是用到目前為止，我還沒有遇到一個稱心如意的視覺化開發工具。不說佈局視覺化開發了，甚至連視覺化都沒有做到。每次 UI 改動，都還是需要通過真機預覽。儘管有 Live Reload 和 Hot Reloading，但是這功能時不時的就會抽風，感覺並不是太穩定。
2.
說了這麼多，其實就是想給大家推薦一個我最近發現的 React Native 視覺化開發工具：draftbit
和其他平臺的視覺化工具一樣，它可以通過拖拽的方式進行佈局。所有的屬性設定也可以通過皮膚進行調整。
而且 draftbit 結合了 Expo，可以直接通過二維碼的方式進行真機預覽。我覺得這才應該是移動開發該有的樣子，先在皮膚裡把 UI 調好了，再到真機裡去預覽，而不是反過來，直接通過真機除錯佈局。
當佈局除錯好之後，直接通過 View Code 功能將程式碼匯出，然後拷貝到我們自己的專案中。然後就可以愉快的寫業務邏輯了。我覺得要是官方後期再出個 WebStorm 外掛就好了，可以一鍵把生成的程式碼匯入專案指定目錄下，那樣就太方便了。不過這個工具才起步，後面說不定真的會有。
3.
視覺化佈局工具，操作上還真沒什麼好說的，因為真的太簡單了，看一遍就都會了。而且我發現 draftbit 的“顏值”還挺高的，這也讓人多了幾分想使用它的“衝動”。
不過比較可惜的是，目前這款工具還處於內測階段，需要有邀請碼才能註冊使用。但是官網已經放開了登記通道，可以填寫自己的郵箱進行登記，如果後面開始公測了，就會及時收到邀請了。
- 官網地址：draftbit.com/#design
- 內測登記：draftbit.com
- 官方推特：@draftbit