Friday, October 4, 2013

constraintsWithVisualFormat, the most interesting coding style I've ever seen

WWDC 2012的演講中,介紹了auto layout,相對於其他文件,這關於排版的程式設計透過影片能比較快的學起來,其中最酷的是一個constraintsWithVisualFormat的函式,讓我們感覺到除了在裝置、界面設計上別出心裁的Apple,在開發者這端也有很有趣的設計。

Apple在iOS 5之後的開發平台上提供auto layout的功能,可以在點選storyboard點選某個view後,於右側的選單中開啓這功能(多已經預設),而constraints就是其中最重要的機制,不會複雜,說穿了,constraint就是一個一維線性代數(y = ax + b),裡頭的y和x分別是某個物件中的某個位置或長度,a和b就是個常數,於是乎,auto layout就是透過這些constraints對於物件擺放的敘述而排版,好的敘述會讓版面不論縮放、旋轉後都是好看的。

constraints可以用一般的函式一一輸入 y = ax + b,但是Apple在設計時候可能是發現這樣太麻煩了,一個constraint的函式表示要六、七行以上呢!所以提出Visual Format這樣的東西,是透過視覺化程式碼,對於喜歡ASCII Art的人的一大福音!

以下是WWDC 2012演講簡報中部分的內容,很酷!
視窗上的兩個button:

抓一下輪廓:

再抽象一點點:

程式碼就這樣出來了: