- 原文地址:Announcing Ant Design 3.0
- 原文作者:Meck
- 譯文出自:掘金翻譯計劃
- 本文永久連結:github.com/xitu/gold-m…
- 譯者:木羽zwwill
- 校對者:Usey95、 swants
Ant Design 3.0 駕到
Ant Design 是一個致力於提升「使用者」和「設計者」使用體驗,提高「研發者」開發效率的企業中後臺設計體系。
14 個月前我們釋出了 Ant Design 2.0。期間我們收到了 200 多位貢獻者的 PR,經歷了大約 4000 個提交和超過 60 個版本
GitHub 上的 star 數也從 6k 上升到了 20k。
自 2015 年以來的 GitHub star 趨勢。
今天,我們很高興地宣佈,Ant Design 3.0 正式釋出了。在這個版本中,我們為元件和網站做了全新的設計,引入了新的顏色系統,重構了多個底層元件,加入了新的特性和優化,同時最小化不相容的更改。這裡可檢視到完整的更改日誌。
這是我們的主頁:ant.design/index-cn
全新的顏色系統
我們的新顏色系統源於天空的啟發,因為她的包容性與我們品牌基調一致。基於對天空色彩隨時間自然變化的觀察,對光和陰影規則的研究,我們重新編寫了顏色演算法來生成一個全新的調色盤,相應的層次也進行了優化。新調色盤的感官更年輕,更明亮,灰度過渡得更自然,是感性美和理性美的完美結合。此外,所有主流色值都參照了資訊獲取標準。
元件的新設計
在之前的版本中,元件的基本字型大小是 12px,我們收到了很多來自社群的反饋,建議我們加大字號。我們的設計師也意識到,在大螢幕普及的今天,14px 是更合適的字型大小。因此,我們將基本字型大小增大到了 14px,並對所有元件的尺寸進行了適配。
元件重寫
我們重寫了 Table
元件來解決一些歷史性問題。引入了一個新的工具 components
,現在你可以使用這個工具來高度定製 Table
元件,這裡有一個示例,可以新增拖拽功能。
Form
元件也被重新編寫,為表單巢狀提供更好的支援。
另一個重寫的元件是 Steps
,這個重寫的 Steps
有著更簡單的 DOM 結構並且相容到IE9。
全新的元件
這個版本,我們新增了兩個元件, List 和 Divider。
List
元件對於文字、列表、圖片、段落和其他資料的顯示非常方便。與第三方庫整合也很簡單,例如,您可以使用 react-virtualized 來實現無限載入列表。更詳細的例子可以參考 List 文件。
Divider
元件可用於在不同的章節中分割文字段落,或者將行內文字/連結分開,如表的動態列。詳細的示例可以參考 Divider 文件。
全面支援 React 16 和 ES 模組
在這個版本中,我們增加了對 React 16 和 ES 模組的支援。如果你正在使用 webpack 3,那麼你現在可以通過 tree-shaking
和 ModuleConcatenationPlugin
來享受 antd 對元件的優化。如果你使用的是 babel-import-plugin
,只需將 libraryDirectory
設定到 es
目錄。
更友好的 TypeScript 支援
在我們的程式碼中,我們已經刪除了所有的隱式 any
型別,在您的專案中不再需要配置 "allowSyntheticDefaultImports": true
。如果您計劃使用 TypeScript 來編寫專案,請參考我們的新文件 「在 TypeScript 中使用」。
? 還有一件事兒
有些人可能已經知道了,我們正在開發另一個名為 Ant Design Pro 的專案,它是一個企業級中後臺前端/設計解決方案,是基於 Ant Design 3.0 的 React Boilerplate。儘管它還沒有達到 1.0 版本。但是隨著 antd 3.0 的釋出,現在可以投入使用了。
接下來
我們的設計師正在重新編寫我們的設計指南,並設計一個新的 Ant Design 官網。我們非常高興能夠提供更好的設計語言,以激發更多構建企業級應用的靈感。
為了使 1.0 早日成型,我們的工程師正在投入到 Ant Design Pro 努力工作,同時我們也需要你的幫助來翻譯我們的文件
最後
如果沒有你們的支援、反饋和參與,就不可能有今天的成功。感謝優秀的 Ant Design 社群。如果您在使用 antd 時遇到任何問題,可隨時在 GitHub 提交問題。
感謝你的閱讀。敬請安裝、star、嘗試。 ?
連結
- Ant Design
- Ant Design Github Repository
- Ant Design Pro
- Ant Design Mobile
- NG-ZORRO — An Angular Implementation of Ant Design
掘金翻譯計劃 是一個翻譯優質網際網路技術文章的社群,文章來源為 掘金 上的英文分享文章。內容覆蓋 Android、iOS、前端、後端、區塊鏈、產品、設計、人工智慧等領域,想要檢視更多優質譯文請持續關注 掘金翻譯計劃、官方微博、知乎專欄。