百行代碼變十行,蘋果SwiftUI可視化編程讓開發者驚嘆完美

2021-01-03 機器之心Pro

蘋果開發者大會 WWDC 2019 在北京時間今天凌晨開幕。在這場大會上除了「史上最難看 Mac 主機」、首次出現的 iPadOS 以外，我們還終於可以對飽受詬病的iTunes 說再見了。而對於開發者來說，新發布的 SwiftUI 可能是最吸引人的特性，在 Craig Federighi 的演示中，我們可以輕鬆地把一百行的前端代碼縮減到十幾行。

Swift 是蘋果於 2014 年發布的全新開發語言，可與 Objective-C* 共同運行於 macOS 和 iOS 平臺，用於搭建基於蘋果平臺的應用程式。Swift 的設計以安全為出發點，以避免各種常見的編程錯誤類別。近年來，這種程式語言的熱度上升很快，甚至有人呼籲用它來代替 Python，作為 TensorFlow 支持的語言。

「取代 Python」並不只是說說而已。今年 4 月，谷歌在 GitHub 上開放了 Swift for TensorFlow 項目。

既然 Swift 語言已經這麼有潛力了，那麼我們難道不應該給它加入更多的特性，助它一臂之力嗎？今天蘋果就為 Switf 前端編程插上了翅膀，其最新發布的 SwiftUI 是一個基於 Swift 語言的、創新而又極為簡單的用戶界面解決方案，各種平臺上的應用都能用它打造精緻的用戶界面。

SwiftUI 使用統一的一套工具和 API，即可創建在任意蘋果設備使用的用戶界面。通過定義一個易讀易寫的聲明式 Swift 語法，SwiftUI 可以順暢的和 Xcode 工具一起完成設計工作。SwiftUI 自動支持動態字體調整（Dynamic Type）、暗黑模式（Dark Mode）、本地化（localization）和輔助功能（accessibility），這意味著開發者的第一行 SwiftUI 代碼是他們目前寫出的功能最強大的 UI 代碼。

官方教程：https://developer.apple.com/tutorials/swiftui/官方文檔：https://developer.apple.com/documentation/swiftui/

SwiftUI 的特點是什麼

SwiftUI 使用聲明式語法，所以我們可以簡單地聲明用戶界面的樣式。例如，開發者可以聲明需要由一串文本輸入框構成的組件，然後定義每一個輸入框的字體對齊方式、字體樣式、字體顏色。這些代碼比以往更加易懂，省時並易於維護。

這種聲明式的方式甚至允許使用複雜的功能，如動畫（animation）。只需要幾行代碼，即可添加動畫在任何控制項上，並且可以使用易於調用的特效。在運行時，SwifthUI 會自行控制創建流暢動作的所有步驟，並且可以解決程序衝突，保證 app 穩定運行。動畫特效變得如此容易，我們可以發掘使 app 更加靈動的方式。

只需一次就能定義布局

開發者只需定義視圖（view）中內容和布局，SwiftUI 懂得什麼時候需要改變，並可以隨時更新（視圖）以匹配設計。

建立可復用的組件

組合小而簡單的視圖，構成更大更複雜的界面。視圖可以在任何一處蘋果設備和平臺共享。

簡化動畫構建

創建流暢的動畫效果十分簡單，如同聲明一個簡單的方法。SwiftUI 可以在需要的時候自動計算並渲染。

設計工具

Xcode 11 內建了非常直觀的新設計工具，我們可以通過 SwiftUI 使用拖放等簡單操作而構建界面。當我們在設計面板時，我們編輯的所有內容都與左邊編輯器的代碼完全同步。當我們修改預覽（preview）時，對應代碼可實時生成，也就是說我們對預覽修改的內容能實時體現在代碼中。Xcode 會立即重新編譯你的修改，並將它們插入到 APP 的運行版中。因此在整個開發中，預覽可視化與代碼可編輯性能同時支持並交互。

如上所示為 SwiftUI 的代碼與預覽部分，它們之間是可以實時交互的。總體而言，這種新型工具主要有以下三大特點：

拖拽：通過簡單拖拽 Canvas 上的控制項來排列用戶界面上的各種組件。單機打開檢查器（inspector）以選擇字體、顏色、對齊方式和其它設計選項，我們也可以通過光標輕鬆重新排列控制項。這些視覺編輯器在代碼編輯器中也能用，所以我們可以使用檢查器挖掘每個控制項的不同選項，即使在界面的手動編程部分也是一樣的。我們可以從庫中拖拽控制項，再放入到設計面板或代碼面板都是可以的。

動態替換：Swift 編譯器和運行時可以完全嵌入到 Xcode 中，所以我們的 APP 會一直處於構建和運行的狀態。我們看到的預覽界面並不是對用戶界面的近似，它就是我們的實時 APP。Xcode 會通過「動態替換」在實時 APP 中交換編輯的代碼，這是 Swift 中的新特徵。

預覽：現在，我們可以創建任何 SwiftUI 視圖的一個或多個預覽，從而得到樣本數據，並配置幾乎用戶能看到的所有內容，例如大字體、定位或「暗黑模式」等。預覽還能在任何設備上以任何朝向展示我們的 UI。

GitHub 包管理也要支持 Swift

GitHub 有很多開源項目，但真正要做成包還是需要其它包管理工具，因此 GitHub 希望能直接根據原始碼發布公有或私有包。在蘋果發布 SwiftUI 的同時，Github5 月份提出的 Github Package Registry 將進一步支持 Swift 包，此前它已經支持 JavaScript（npm）、 Java（Maven）等耳熟能詳的工具。

Swift 包使開發者可以更簡單的在不同的項目之間，以及 Swift 社區共享工具和原始碼。Swift 包管理器（Swift Package Manager），是一個跨平臺的構建、運行、測試和打包你的 Swift 代碼的工具，現已在 Github 開源。包的信息已經寫入 Swift，使我們可以更好地管理 Swift 中的 Target 、聲明 Product，並管理相關環境依賴。Swift 包管理器和 Github 包列表協作可以幫助開發者更容易發布自己的 Swift 項目。

使移動端開發者有更高效的生產力工具也十分重要。隨著 Swift 生態環境的增長壯大，能夠和蘋果團隊一起合作完成 Swift 開發工具流使 GitHub 的開發者非常興奮。在 Swift 包管理項目上線後，我們可以更加便捷地構建和調用不同的開源工作。

參考連結：

https://developer.apple.com/xcode/swiftui/https://github.com/apple/swifthttps://github.blog/2019-06-03-github-package-registry-will-support-swift-packages/

相關焦點

  • 百行代碼縮成十行,蘋果開發者大會上亮相的Swift UI成了入門碼農禮物
    浙江24小時——錢江晚報記者 張雲山「Hello Everyone，歡迎回到WWDC2019 開發者大會。」 在熟悉的庫克開場白中，蘋果公司開了一場歷史上最長，也是內容最多的一次開發者大會，兩個半小時更新了五大系統，還推出了兩款新硬體。
  • 蘋果發布全新SwiftUI框架,原生支持所有蘋果設備平臺
    在昨天的 WWDC2019 上，Apple 推出了一個全新的 SwiftUI 框架，這是一個現代化的 UI 界面編碼結構，它是從頭開始構建的，以利用 Swift
  • 不到500行Python代碼,你能編出什麼?
    【IT168 評論】不到500行Python代碼，你能寫出什麼東西?Github上一個名為「500lines」的開源項目集結了眾多業內較為知名的開發者，同時，所有貢獻項目的代碼行數均在500行以內。完整版本每章包含一個程序演練，該程序在至多500條原始碼行中解決了軟體工程中的規範問題。來看看業內一線的編程大牛能在500行代碼之內編出什麼程序吧!
  • 程式設計師的復仇:11 行代碼讓 Node 社區雞飛狗跳
    兩天前，一名NPM（Nodejs Package Manager）社區的貢獻者Azer Koçulu出於對NPM管理層的怨憤（詳情），不聲不響刪除了自己在NPM上面的全部代碼，其中就包含只有11行代碼的「Left-pad」，
  • 1行代碼實現數據集可視化、分析與比較
    現在，github上一位博主告訴你：不用學，用sweetviz就行。這是一個基於Python編寫的數據分析軟體，只要掌握3種函數用法，一行Python代碼就能實現數據集可視化、分析與比較。所有輸入的數值、文本信息都會被自動檢測，並進行數據分析、可視化和對比，最後幫你進行數據總結。在這樣的數據分析下，結果一目了然。
  • 1行代碼實現Python數據可視化圖表美觀清晰，自帶對比功能
    這是一個基於Python編寫的數據分析軟體，只要掌握3種函數用法，一行Python代碼就能實現 數據集可視化、分析與比較 。所有輸入的數值、文本信息都會被自動檢測，並進行數據分析、可視化和對比，最後幫你進行數據總結。在這樣的數據分析下，結果一目了然。
  • 4行代碼Python就能實現NBA投籃數據可視化
    NBA剛剛結束，怎樣對球員投籃數據做可視化？我發現了大佬造的輪子，只需4行代碼就能實現。此處通過查看原始碼(core.py)，發現數據的請求地址。果然是4行代碼呀03年至20年，小皇帝到詹皇的投籃數據可視化。
  • 10行以內代碼能有哪些高端操作？Python 編程
    Python憑藉其簡潔的代碼，贏得了許多開發者的喜愛。因此也就促使了更多開發者用Python開發新的模塊，從而形成良性循環，Python可以憑藉更加簡短的代碼實現許多有趣的操作。下面我們來看看，我們用不超過10行代碼能實現些什麼有趣的功能。一、生成二維碼二維碼作為一種信息傳遞的工具，在當今社會發揮了重要作用。
  • 記「十行狀元、百優工匠」競賽活動電腦程式員決賽冠軍王小龍
    編程，「編」出精彩人生 ——記「十行狀元、百優工匠」競賽活動電腦程式員決賽冠軍王小龍 (資料照片) 湖南日報記者 徐行 攝 記者 鄒靖方 獲得省「十行狀元、百優工匠」競賽活動電腦程式員決賽第一名後，王小龍的生活並沒有太大的變化，他依然站在講臺上，用相聲般的語言為學生們講解計算機編程知識。 王小龍，是株洲健坤北大青鳥培訓學校的電腦程式員老師，從事計算機編程技術已有14年歷史。
  • Google有20億行代碼
    儘管你可能會說拿Google那麼多軟體的代碼和Windows單個軟體比是不公平的，但事實上，Google這20億行代碼其實存儲在一個代碼庫中，25000位Google工程師可以隨時調用它，它就像統一的單個軟體。
  • 實時可視化Debug:開源新工具,一鍵解析代碼結構
    但代碼要是比較長，錯誤就會隱藏比較深了，這個時候，不論你是採用 print() 大法，還是善用 assert 語句，或者乾脆設置斷點，DeBug 總是一條慢慢排除的道路。之前機器之心曾介紹過極簡 DeBug 工具 PySnooper ，我們只需要向感興趣的函數增加一個裝飾器，就能得到該函數的詳細 log，包含哪行代碼能運行、什麼時候運行以及本地變量變化的確切時間等等。
  • 通吃任何領域10個python可視化庫，炫酷可視化再也不用怕
    儘管它已有十多年的歷史，但它仍是Python使用者最廣泛使用的繪畫庫。其設計與20世紀80年代開發的一種專有程式語言----MATLAB非常相似。因為matplotlib是第一個Python數據可視化庫，所以很多其它的庫都是以其為基礎構建的，亦或者在分析期間與其協同合作的。
  • 實時可視化Debug:VS Code 開源新工具,一鍵解析代碼結構
    但代碼要是比較長，錯誤就會隱藏比較深了，這個時候，不論你是採用 print() 大法，還是善用 assert 語句，或者乾脆設置斷點，DeBug 總是一條慢慢排除的道路。之前機器之心曾介紹過極簡 DeBug 工具 PySnooper ，我們只需要向感興趣的函數增加一個裝飾器，就能得到該函數的詳細 log，包含哪行代碼能運行、什麼時候運行以及本地變量變化的確切時間等等。
  • ...微軟命令行工具發布!引誘開發者叛逃Mac,開源六小時衝上GitHub...
    這是不少抱著Mac參加微軟Build大會的開發者，看到命令行工具Windows Terminal後的第一反應。除了這個新的命令行工具之外，微軟還發布了完整內核的Linux子系統WSL 2。當真是直擊開發者G點。長期以來，Linux和Mac下的命令行工具自成一派，Windows卻是另一套命令系統。這也是很多開發者不選擇Windows系統的原因。今後還買什麼Mac，還裝什麼Linux系統？
  • 4 行代碼繪製湖人隊的投籃情況
    相信編程派的讀者裡有不少 NBA 球迷（雖然我不是），最近湖人奪冠的新聞關注度比較高，因此分享一篇分析 NBA 投籃數據的 Python 可視化教程。作者已經將可視化的代碼封裝成一個方便使用的 Github 開源項目了，可以根據自己的需求更新數據源即可使用。36歲的老詹還沒有老，4座總冠軍+4次FMVP。關於NBA球員投籃數據的可視化，只需4行代碼就能實現。
  • 清華畢業生開發嵌入Python的程式語言,99行代碼實現《冰雪奇緣》
    因為他用99行代碼，實現了《冰雪奇緣》的特效。據悉，當時艾莎施展魔法的特效鏡頭，儘管僅僅呈現短暫的一秒鐘，但卻需要高性能計算機，運算一周的時間。《冰雪奇緣》雖然沒有真人出演，預算卻高達1.5億美元，每一秒的鏡頭都是經費在燃燒。一般人想用電腦做出CG特效簡直不可想像。
  • 40行Python代碼,實現卷積特徵可視化
    本文將向你解釋如何僅使用 40 行 Python 代碼將卷積特徵可視化。最近在閱讀 Jeremy Rifkin 的書《The End of Work》時，我讀到一個有趣的關於 AI 的定義。在本文中我將向你解釋如何僅用 40 行 Python 代碼來實現隨機圖像的像素值優化（如下圖），從而生成卷積神經網絡的特徵可視化。
  • 24行Python代碼讓小球「彈」起來
    注釋是程式設計師針對代碼做些什麼而給出的註解。注釋不是供Python讀取的，會忽略掉注釋。在第十行，def draw()：表示定義了一個繪圖函數，冒號後面的語句表示具體的繪製工作。第十一行中，screen表示屏幕，fill表示布滿，white表示白色，在Python中，單引號&39;或雙引號&34;內的一個字符序列，叫作字符串。利用字符串，我們可以給背景設定不同的顏色。
  • 泰州「十行百星」先進典型事跡報告會舉行
    「喜迎黨的十九大砥礪奮進的五年」泰州市首屆「十行百星」先進典型事跡報告會在這裡舉行。市領導莊兆林、常勝梅、臧大存、杜榮良、繆雲忠參加活動。　　報告會上，6名「十行百星」代表飽含深情，為大家作了一場感人至深、催人奮進的報告，讓大家受到了一次深刻的思想教育和精神洗禮。
  • 新入行的程式設計師應該學習哪門程式語言？
    新入行的程式設計師最常詢問我的問題之一就是：我應該學習哪門程式語言。我曾指導過很多開發者，他們總是懷疑自己的選擇，甚至改變主意，不斷地從一門程式語言跳躍到另一門程式語言，總是擔心做出錯誤的決定。如果你總是糾結於「我到底應該學習哪門程式語言」，本章正好適合你。首先，我會消除一些疑問；然後，我將就如何選擇你的第一門程式語言給你一些實用的考慮因素。