Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Web 端的 SwiftUI:SwiftWebUI #6125

Merged
merged 5 commits into from
Jul 20, 2019

Conversation

EmilyQiRabbit
Copy link
Contributor

译文翻译完成,resolve #6076

@EmilyQiRabbit EmilyQiRabbit changed the title Update swiftwebui.md Web 端的 SwiftUI:SwiftWebUI Jul 12, 2019
@leviding leviding added the iOS label Jul 12, 2019
@iWeslie
Copy link
Contributor

iWeslie commented Jul 15, 2019

校对认领

@fanyijihua
Copy link
Collaborator

@iWeslie 好的呢 🍺

@pingren
Copy link
Contributor

pingren commented Jul 15, 2019

@leviding 校对认领

Copy link
Contributor

@pingren pingren left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

校对完成

新人第一次校对,如有问题请多多指教!😁

@EmilyQiRabbit @leviding


Beginning of the month Apple announced [SwiftUI](https://developer.apple.com/xcode/swiftui/) at the [WWDC 2019](https://developer.apple.com/wwdc19/). A single “cross platform”, “declarative” framework used to build tvOS, macOS, watchOS and iOS UIs. [SwiftWebUI](https://github.com/SwiftWebUI/SwiftWebUI) is bringing that to the Web ✔️
这个月初,苹果在 [2019 年 WWDC 大会](https://developer.apple.com/wwdc19/)公布了 [SwiftUI](https://developer.apple.com/xcode/swiftui/)。它是一个独立的“跨平台”、“声明式”框架,可用于构建 tvOSmacOSwatchOS 以及 iOS 的用户界面(UI)。而 [SwiftWebUI](https://github.com/SwiftWebUI/SwiftWebUI) 正在将这种功能迁移到 Web 研发✔️。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

『正在将这种功能迁移到 Web 研发✔️』 => 『正将这个框架迁移到 Web 上✔️』。

理由:前面说到 SwiftUI 是一个框架,bringing that 里指代 SwiftUI


## SwiftWebUI

So what exactly is [SwiftWebUI](https://github.com/SwiftWebUI/SwiftWebUI)? It allows you to write SwiftUI [Views](https://developer.apple.com/documentation/swiftui/view) which display in a web browser:
所以 [SwiftWebUI](https://github.com/SwiftWebUI/SwiftWebUI) 到底可以用来做什么?答案是使用 SwiftWebUI,你能写可以在 web 浏览器展示的 SwiftUI [View](https://developer.apple.com/documentation/swiftui/view)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

『所以[SwiftWebUI]到底可以用来做什么?答案是使用SwiftWebUI,你能写可以在 web 浏览器展示的 SwiftUI [View]』 =>

『所以[SwiftWebUI]到底可以用来做什么?它可以在 web 浏览器内展示你编写的 SwiftUI [View]。』

理由:修改表达符合中文习惯。


To repeat the **Disclaimer**: This is a toy project! Do not use for production. Use it to learn more about SwiftUI and its inner workings.
重申一次**免责声明**:SwiftWebUI 只是一个很初级的项目!不要用于生产环境。建议用它来学习 SwiftUI 和它的内部工作原理。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

讨论:toy project 直接根据字面意思翻译为玩具(级)项目会不会更好?


The point is to be able to reuse the [knoff-hoff](https://en.wikipedia.org/wiki/Die_Knoff-Hoff-Show) and share it between different platforms. In this case, the Web ✔️
重点是能够复用 [knoff-hoff](https://en.wikipedia.org/wiki/Die_Knoff-Hoff-Show),并且可以跨平台共享。在这个意义上,Web 比较有优势。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

讨论:复用 [knoff-hoff] 似乎是指 SwiftWebUI 能像 Die Knoff-Hoff-Show 这档节目秀一样,让开发者尝试或者模仿简单的 UI 小实验并且展示成果。这里需要意译吧,虽然我也想不出怎么译😓。

The show explained scientific concepts by means of simple experiments that anyone could replicate. In addition, hobbyists were given the opportunity to present their inventions; these included a pretzel-cutting machine and a foam-throwing machine.

参考:https://en.wikipedia.org/wiki/Die_Knoff-Hoff-Show#Concept


But lets get down to the nitty gritty and write a simple SwiftWebUI application. In the spirit of “Learn once, use anywhere” watch those two WWDC sessions first: [Introducing SwiftUI](https://developer.apple.com/videos/play/wwdc2019/204/) and [SwiftUI Essentials](https://developer.apple.com/videos/play/wwdc2019/216). We don’t go that deep in this blog entry, but this one is recommended too (and the concepts are mostly supported in SwiftWebUI): [Data Flow Through SwiftUI](https://developer.apple.com/videos/play/wwdc2019/226).
现在让我们就开始着手细节,写一个简单的 SwiftWebUI 应用吧。秉承着“一次学习,随处可用”这样的理念,先看看这两个 WWDC 会议记录吧:[SwiftUI 介绍](https://developer.apple.com/videos/play/wwdc2019/204/) [SwiftUI 核心](https://developer.apple.com/videos/play/wwdc2019/216)。在这篇博客中我们不会讲解的这么深入,但是下面这一点文本也会推荐给你(并且 SwiftWebUI 可以支持这其中的大部分概念):[SwiftUI 的数据流](https://developer.apple.com/videos/play/wwdc2019/226)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

『在这篇博客中我们不会讲解的这么深入,但是下面这一点文本也会推荐给你(并且 SwiftWebUI 可以支持这其中的大部分概念):[SwiftUI 的数据流]』 =>

『虽然在这篇博客中我们不会深入讲解,但是推荐你看看[SwiftUI 的数据流](其中的大部分概念也适用于 SwiftWebUI)』

理由:修改表达符合中文习惯。


![](http://www.alwaysrightinstitute.com/images/swiftwebui/SemanticUI/cards.png)

It is very easy and a lot of fun to add such Views. One can quickly compose pretty complex and good looking layouts using WOComponent's SwiftUI Views.
为界面添加这样的 View 非常简单,并且能让你感觉到乐趣。使用 WOComponentSwiftUI Views,每个人都能快速的组建出虽然复杂但是非常好看的界面布局。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

『为界面添加这样的 View 非常简单,并且能让你感觉到乐趣。使用 WOComponent 的 SwiftUI Views,每个人都能快速的组建出虽然复杂但是非常好看的界面布局。』 =>

『添加这样的 View 非常轻松愉快。使用 WOComponent 的 SwiftUI Views,每个人都能快速地创作复杂又好看的布局。』

理由:简化翻译;修改表达。

> `Image.unsplash` constructs image queries against the Unsplash API running at `http://source.unsplash.com`. Just give it some query terms, the size you want and optional scopes.
> Note: That specific Unsplash service seems to be a little slow and unreliable sometimes.
> `Image.unsplash` 会根据运行在 `http://source.unsplash.com` 的 API 构建图片请求。只需要传递给它一些请求参数,比如你想要的图片大小和其他的可配置选项。
> 注意:这个 Unsplash 服务有时候会比较慢,也有可能并不非常可靠。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

『 也有可能并不非常可靠。』 =>

『有点靠不住。』

理由:修改表达符合中文习惯。


This implementation is pretty simple and inefficient. The real thing has to deal with a much higher rate of state modifying events, does all the animation things at 60Hz frame rates, etc etc.
目前我们的实现方法非常简单,也并不高效。正式版必须要处理高频率的状态改变时间,还要将所有的动画效果都改为 60Hz 的帧率等等。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

『正式版必须要处理高频率的状态改变时间, 』 => 『正式版必须要处理高频率的状态改变,』


It would make a chat client demo trivial.
这会让客户端的演示更轻量
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

『这会让客户端的演示更轻量』=> 『这会让聊天客户端的演示更轻松。』


Next: Direct To Web and some Swift’ified EOF (aka CoreData aka ZeeQL).
接下来:(这句不太会翻译,求校对的同学指教~)(又名 CoreData 或者 ZeeQL)。
Copy link
Contributor

@pingren pingren Jul 15, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Direct To Web 和 EOF (Enterprise Objects Framework) 都是 Apple 开发的 WebObjects 的一部分。
WebObjects 首次发布于 1996 年,上次更新是在 10 年前,这是只有国外骨灰级 Mac 程序员才看的懂的梗😂。

我的理解:
接下来:(让我们期待新时代的) Direct To Web 和 Swift 化的 EOF (即 CoreData 或 ZeeQL)。

参考:

Direct To Web (D2W) allows developers to rapidly create an HTML-based Web application that accesses a database.

https://en.wikipedia.org/wiki/WebObjects, https://en.wikipedia.org/wiki/Enterprise_Objects_Framework

@leviding
Copy link
Member

@pingren 很赞 👍

@EmilyQiRabbit
Copy link
Contributor Author

@pingren 感谢校对~赞~

@leviding leviding added the Tag 一次校对修改完成 label Jul 16, 2019
@sunui
Copy link
Contributor

sunui commented Jul 17, 2019

@iWeslie 延期啦 快来校对一下了

@@ -35,94 +35,94 @@ struct MainPage: View {
}
```

Results in:
代码的结果是:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

代码运行的结果是


The stated goal of SwiftUI is not “[Write once, run anywhere](https://en.wikipedia.org/wiki/Write_once,_run_anywhere)” but “[Learn once, use anywhere](https://developer.apple.com/videos/play/wwdc2019/216)”. Don’t expect to be able to take a beautiful SwiftUI application for iOS, drop the code into a SwiftWebUI project and get it to render exactly the same in the browser. That is not the point.
SwiftUI 的核心目标不是“[一次编码,随处可运行](https://en.wikipedia.org/wiki/Write_once,_run_anywhere)”,而是“[一次学习,随处可用](https://developer.apple.com/videos/play/wwdc2019/216)”。不要期待着可以将 iOS 上好看的 SwiftUI 应用直接拿来,把代码拷贝到 SwiftWebUI 项目中然后就可以在浏览器看到一模一样的渲染效果。因为这并不是 SwiftWebUI 的重点。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

把代码拷贝到 SwiftWebUI 项目中虽然可以在浏览器看到一模一样的渲染效果,但这并不是 SwiftWebUI 的重点。

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

把代码拷贝到 SwiftWebUI 项目中应该是看不到一摸一样的效果吧?原文说的是「Don’t expect to be able to...」

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

不好意思看漏了,我没有注意到前半句,就原来的翻译可以的


The point is to be able to reuse the [knoff-hoff](https://en.wikipedia.org/wiki/Die_Knoff-Hoff-Show) and share it between different platforms. In this case, the Web ✔️
重点是能够像 [knoff-hoff](https://en.wikipedia.org/wiki/Die_Knoff-Hoff-Show) 一样让开发者模仿 SwiftUI 进行代码实验并看到运行结果,同时还可以跨平台共享。在这个意义上,Web 比较有优势。
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

重点是能可以重用 knoff-hoff 并跨平台分享,在我们这篇文章中,就是指 Web 端


As of today SwiftWebUI requires a [macOS Catalina](https://www.apple.com/macos/catalina-preview/) installation to run (“Swift ABI” 🤦‍♀️). Fortunately it is really easy to [install Catalina on a separate APFS volume](https://support.apple.com/en-us/HT208891). And an installation of [Xcode 11](https://developer.apple.com/xcode/) is required to get the new Swift 5.1 features SwiftUI makes heavy use of. Got that? Very well!
目前,SwiftWebUI 需要 [macOS Catalina](https://www.apple.com/macos/catalina-preview/) 才能运行 (“Swift ABI” 🤦‍♀️)。幸运的是,[在单独的 APFS 宗卷上安装 Catalina](https://support.apple.com/en-us/HT208891) 很简单。同时还需要安装 [Xcode 11](https://developer.apple.com/xcode/),这样才能获取到最新的 Swift 5.1 的特性,这些特性 SwiftUI 将会大量使用。都懂了吗?非常好!
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

目前由于 Swift ABI 不兼容,SwiftWebUI 需要运行在 macOS Catalina 上。

这样才能获取到最新的 Swift 5.1 的特性=> 这样才能使用最新的 Swift 5.1 语法

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

感觉还是最新的 Swift 5.1 特性比较好?feature 应该是 特性 的意思吧?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

我也觉得应该翻译成特性,BTW,感觉这里的 the new 是形容 features 的。

最新的 Swift 5.1 的特性 => Swift 5.1 的新特性


> Linux? The project is indeed **prepared** to run on Linux, but that hasn’t been finished yet. The only real thing missing is a simple implementation of the [Combine](https://developer.apple.com/documentation/combine) [PassthroughSubject](https://developer.apple.com/documentation/combine/passthroughsubject) and a little infrastructure surrounding that. Prepared: [NoCombine](https://github.com/SwiftWebUI/SwiftWebUI/blob/master/Sources/SwiftWebUI/Misc/NoCombine.swift). PRs are welcome!
> 如果你使用的是 Linux 系统该怎么办?这个项目已经**在准备**运行在 Linux 上了,但是工作还并没有完成。目前项目还缺少的部分是一个对 [Combine](https://developer.apple.com/documentation/combine) [PassthroughSubject](https://developer.apple.com/documentation/combine/passthroughsubject) 的简单实现,并且在这个方面,我遇到了一点困难。目前准备好的代码在:[NoCombine](https://github.com/SwiftWebUI/SwiftWebUI/blob/master/Sources/SwiftWebUI/Misc/NoCombine.swift)。欢迎大家为项目提 pull request!
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这个项目已经即将准备运行在 Linux 上了


![](http://www.alwaysrightinstitute.com/images/swiftwebui/ProjectSetup/3-swift-project-name.png)

Then we add [SwiftWebUI](https://github.com/SwiftWebUI/SwiftWebUI) as a Swift Package Manager dependency. The option is hidden in the “File / Swift Packages” menu group:
然后,将 [SwiftWebUI](https://github.com/SwiftWebUI/SwiftWebUI) 作为 Swift 包管理依赖加入项目。这个选项在 “File / Swift Packages” 菜单中:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

然后,将 SwiftWebUI 添加到 Swift 包管理器并导入项目

Copy link
Contributor

@iWeslie iWeslie left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

校对完成 @EmilyQiRabbit @leviding

@EmilyQiRabbit
Copy link
Contributor Author

@iWeslie 感谢校对 @leviding 修改完成

@leviding leviding added 标注 待管理员 Review and removed Tag 一次校对修改完成 正在校对 labels Jul 20, 2019
@leviding leviding merged commit 4158179 into xitu:master Jul 20, 2019
@leviding
Copy link
Member

@EmilyQiRabbit 已经 merge 啦~ 快快麻溜发布到 掘金,然后在本 PR 下回复文章链接,方便及时添加积分哟。

掘金翻译计划有自己的知乎专栏,你也可以投稿哈,推荐使用一个好用的插件
专栏地址:https://zhuanlan.zhihu.com/juejinfanyi

@leviding leviding added 翻译完成 and removed 标注 待管理员 Review labels Jul 20, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Web 端的 SwiftUI:SwiftWebUI
6 participants