How to wrap a SwiftUI View inside a ASDisplayNode

Question

Today I was trying to figure out a way to interface SwiftUI and Texture (AsyncDisplayKit).

That way I get the speed and benefits of AsyncDisplayKit, ASNetworkImage, etc. and the flexibility of SwiftUI and Combine in my detail views.

score 1 · Accepted Answer · answered Oct 21 '19 at 00:39

Interfacing SwiftUI and Texture / AsyncDisplayKit

We can initialize a node and provide a SwiftUI view to be used as the backing view. The Text view nests in a UIHostingController, a UIViewController subclass that represents a SwiftUI view within UIKit contexts.

The view is provided via a block that will return a view so that the actual construction of the view can be saved until later. The node display step happens synchronously because a node can only be asynchronously displayed when it wraps an _ASDisplayView (the internal view subclass), not when it wraps a UIView.

//
//  HostingNode.swift
//

import AsyncDisplayKit
import SwiftUI

class HostingNode: ASDisplayNode {

    var viewController: UIViewController?

    override init() {
        super.init()

        setViewBlock { [weak self]() -> UIView in
            self?.viewController = self?.makeHostingController()
            return self?.viewController?.view ?? UIView()
        }
    }

    private func makeHostingController() -> UIViewController {
        UIHostingController(
            rootView: Text("Attention")
        )
    }
}

References:

It is hard to control the layout of the `UIHostingController`... and it seems preferable to do the opposite and embed a ASViewController inside a `UIViewControllerRepresentable`. — Mycroft Canner, Oct 21 '19 at 18:26

How to wrap a SwiftUI View inside a ASDisplayNode

1 Answers1