Auto Layout在JavaScript中實現：AutoLayout.js

jopen 10年前發布 | 20K 次閱讀 JavaScript開發 AutoLayout.js

AutoLayout.js在JavaScript中實現了 Apple的 Auto Layout 和 Visual Format Language 。Auto layout是一個讓你使用數學關系（約束）執行任何布局。它使用Auto Layout 是蘋果在 Xcode 5 (iOS 6) 中新引入的布局方式，旨在解決 3.5 寸和 4 寸屏幕的適配問題。屏幕適配工作在 iPhone 6 及 plus 發布以后變得更加重要，而且以往的“笨辦法”的工作量大幅增加，所以很多人開始學習使用 Auto Layout 技術。

// Create a view with a set of constraints
var view = new AutoLayout.View({
    constraints: constraints, // initial constraints (optional)
    width: 100,               // initial width (optional)
    height: 200,              // initial height (optional)
    spacing: 10               // spacing size to use (optional, default: 8)
});

// get the size and position of the sub-views
for (var key in view.subViews) {
    console.log(key + ': ' + view.subViews[key]);
    // e.g. {
    //   name: 'child1',
    //   left: 20,
    //   top: 10,
    //   width: 70,
    //   height: 80
    // }
}