【问题标题】:Xcode Canvas for SwiftUI previews does not show upXcode 11:画布不显示
【发布时间】:2019-10-19 11:06:23
【问题描述】:

我正在尝试从 Xcode 11 运行新的 Canvas 功能,但 Canvas 不会显示。我做错了什么?

我刚刚创建了一个新的默认项目(单视图应用程序),对其进行编译并激活“编辑器 > 编辑器和画布”。我可以导航到项目中的每个文件,没有任何显示。

还有什么需要做的?

【问题讨论】:

标签: ios swift swiftui xcode11


【解决方案1】:

您需要使用 Catalina macOS 版本 (10.15),如 official tutorial

中所述

警告:Catalina 不支持 32 位应用程序,一些旧应用程序在更新后将停止工作。

【讨论】:

  • 当您尝试切换到Editor and Canvas 模式时,它应该在 Xcode 中清楚地传达。 “让我们什么也不做,强迫用户用谷歌搜索它为什么没有出现”的方法是一种糟糕的方法。
  • @KarolKulesza 没错,即使在开发门户上也显示了对新 iOS 的要求:Installation requires macOS 10.15 beta or Xcode 11 beta,但甚至没有 xcode11 的注释
  • 现在它会在打开画布时声明。
【解决方案2】:

根据official tutorial from Apple,进一步补充其他答案:

要在 Xcode 的画布中预览视图并与之交互, 确保您的 Mac 运行的是 macOS 10.15 beta。

很遗憾,由于测试版刚刚发布,我现在无法运行它,而且我没有备用 Mac!

【讨论】:

    【解决方案3】:

    您仍然可以在操场上看到实时视图(未安装 Catalina)。 使用UIHostingController

    import UIKit
    import SwiftUI
    import PlaygroundSupport
    
    
    
    struct ContentView : View {
        var body: some View {
    
            Text("Hello World")
                .foregroundColor(Color.blue)
        }
    }
    
    // Present the view controller in the Live View window
    PlaygroundPage.current.liveView = UIHostingController.init(rootView: ContentView())
    

    【讨论】:

    • 但这不是新画布,如果您运行应用程序,它只是实时视图。你也可以通过一个项目来做到这一点
    • 这可能很酷,但这不是问题所在。在阅读了其他答案之后,很明显,Apple 只是没有在足够多的地方放置“Xcode 11 beta 运行在 Mojave 上,但在 Catalina 上运行更多功能最好”的通知。预览是我最喜欢使用的功能之一。
    【解决方案4】:

    预览版仅适用于 MacOS 10.15 Beta

    您需要在 Xcode 11.0-Beta 中点击 Editor and Canvas Option,或者您可以从顶部选项点击 Editor -> Editor and Canvas

    附上截图供参考。

    【讨论】:

      【解决方案5】:

      要在 Xcode 中预览画布中的视图并与之交互,请确保您的 Mac 正在运行 MacOS 10.15 beta

      SwiftUI 开发工具仅在 macOS 10.15 beta 上运行时可用。

      https://developer.apple.com/tutorials/swiftui/creating-and-combining-views

      【讨论】:

        【解决方案6】:

        除了运行 MacOS Catalina [beta] 之外,您似乎还需要安装 命令行工具,否则它会失败并“暂停”画布(这发生在 Xcode 11 Beta 2 中)。要安装它们,请运行:

        xcode-select --install
        

        【讨论】:

          【解决方案7】:

          如果您将 Xcode 升级到更高的 beta 版本并在此过程中收到以下错误消息,可能会出现这种情况:

          加载插件失败

          插件“com.apple.dt.UVKit”在路径 “/Applications/Xcode-beta.appDownloads/Xcode-beta.app/Contents/PlugIns/UVKit.framework” 无法加载。插件或其必备插件之一 可能丢失或损坏。插件或其先决条件之一 插件可能丢失或损坏,可能需要重新安装。

          解决办法好像是把Catalina beta版升级到同级。这是 Apple 的Beta Software Downloads 的链接。

          【讨论】:

            【解决方案8】:

            您必须至少安装 macOS 版本(10.15 或更高版本)

            【讨论】:

              【解决方案9】:

              Canvas 预览仅在将 MacOS 10.14 更新到 10.15 后才有效

              我们有 Mac OS Catalina Beta 版 (10.15)

              升级您的系统,它就可以工作了。 :)

              Check this link

              【讨论】:

                【解决方案10】:

                一些重要的清单,请一一检查。如果这一切都完成了,您可以轻松获得“编辑器和画布”选项。

                1. 您的 MacOS 版本等于或高于 10.15

                2. 您至少使用 Xcode 11 Beta 或更高版本。如果您有 Xcode 11 但您的 MacOS 低于 10.15 ,您将无法看到该选项。

                3. 从终端运行命令:

                sudo xcode-select -s /Applications/Xcode.app/Contents/Developer

                然后

                sudo xcodebuild -license

                1. 如果检查列表 1 和 2 已完成,请转到首选项选项并选择命令行工具。首选项 -> 位置并将命令行工具分配给 Xcode 11/Beta。

                大多数时候,选项 4 是问题所在。

                【讨论】:

                  【解决方案11】:

                  更新 Mac OS 版本 10.15 或更高版本。更新 Xcode 11 或更高版本。之后点击 Editor > Canvas 进行代码预览。

                  奖励:如果您想查看左侧的代码预览,您可以从菜单图标 > 布局 > 画布右侧更改布局。 (我分享了截图)

                  【讨论】:

                    【解决方案12】:

                    复制swift文件的内容,


                    将文件移至回收站


                    再次创建 swift 文件


                    粘贴并运行您的代码




                    【讨论】:

                    • 令人震惊的是,这是唯一有效的方法。似乎该文件以某种方式停止被识别为 SwiftUI 文件,直到创建了一个新文件。重新启动和重新启动 Xcode 无济于事,甚至关闭/显示画布等。复制内容,删除文件,创建一个新文件并粘贴。瞧。
                    【解决方案13】:

                    对 Xcode 为 SwiftUI 画布提供的功能感到沮丧(以及它如何无法与您交流您需要升级到 Catalina 才能使用此功能),我决定创建自己的工具:QDesigner。这是一个 iPad 应用程序,您可以在其中简单地将 SwiftUI 控件拖放到 iPhone 画布上,轻按几下对其进行自定义,轻按一下即可生成 SwiftUI 代码。 无需 Xcode

                    QDesigner 的第一个 Beta 版可通过 TestFlight 获得:
                    https://testflight.apple.com/join/aSXW5tVp

                    还有一款适用于 iPhone 的 QDesigner Client 配套应用,可与运行在 iPad 上的 QDesigner 连接,在目标设备上查看您的 UI 设计,实时更新:
                    https://testflight.apple.com/join/DQv0DBJU

                    我希望它至少对你们中的一些人有所帮助! 让我知道你的想法,当然还有大量工作要让它完全发挥作用,但第一个测试版已经对基本的SwiftUI 使用有益。

                    观看QDesigner 的演示视频并访问网站了解更多信息:
                    https://Q-Mobile.IT/Q-Designer

                    【讨论】:

                      【解决方案14】:

                      另外,请确保在您的 SwiftUI 文件中调用此函数(在实际的 View 结构之外)。

                      struct ContentView_Previews: PreviewProvider {
                          static var previews: some View {
                              ContentView() // Initialize your struct
                          }
                      }
                      

                      【讨论】:

                        【解决方案15】:

                        如果您将 swiftUI 文件移动到新文件夹,画布将不会出现,最好的解决方案是复制文件中的所有代码,然后将文件删除到垃圾箱中,然后创建一个新文件并粘贴您的代码

                        步骤:

                        1. 复制文件代码

                        2. 删除文件

                        3. 创建一个同名的新文件

                        4. 将代码粘贴到新文件中

                        【讨论】:

                        • 在 Big Sur 11.1 上做了这个,nada。还有别的东西。
                        【解决方案16】:

                        我尝试了所有这些步骤,但后来意识到我的文件中没有设置我的PreviewProvider。没有这个,预览就不会显示。

                        确保您已将其设置为:

                        struct YourView_Previews: PreviewProvider {
                            static var previews: some View {
                                YourView()
                            }
                        }
                        

                        然后您可以按照此线程中其他答案的建议进行操作,您的画布窗口应该会立即弹出。

                        【讨论】:

                          【解决方案17】:

                          对于想要将预览移到右侧的人...将布局(工作区的右角倒数第二个选项)更改为“右侧画布”

                          【讨论】:

                            猜你喜欢
                            • 1970-01-01
                            • 2014-05-10
                            • 1970-01-01
                            • 1970-01-01
                            • 2016-09-09
                            • 2018-09-15
                            • 1970-01-01
                            • 2014-08-16
                            • 2014-12-16
                            相关资源
                            最近更新 更多