facebookarchive / AsyncDisplayKit

Smooth asynchronous user interfaces for iOS apps.
http://asyncdisplaykit.org
Other
13.4k stars 2.2k forks source link

ASTextNode pointSizeScaleFactors having issues with the transition API #2696

Closed smyrgl closed 7 years ago

smyrgl commented 7 years ago

Version: 40a8769217691b001cc5779af078b77137accac4

So here is my case, I have a stack layout which looks like this:

pane

The pane resizes and can slightly compress the header to a point. Here is the layoutSpec for the container:

        let paneRelativeSpec = ASRelativeLayoutSpec(horizontalPosition: .start, verticalPosition: .end, sizingOption: .minimumHeight, child: paneNode)
        let stackSpec = ASStackLayoutSpec(direction: .vertical,
                                          spacing: 0.0,
                                          justifyContent: .start,
                                          alignItems: .stretch,
                                          children: [headerNode, paneRelativeSpec])
        let statusBarInset = UIEdgeInsets(top: UIApplication.shared.statusBarFrame.size.height, left: 0, bottom: 0, right: 0)
        paneRelativeSpec.style.maxSize = CGSize(width: constrainedSize.max.width, height: constrainedSize.max.height - statusBarInset.top - 70)
        let stackInsetSpec = ASInsetLayoutSpec(insets: statusBarInset, child: stackSpec)
        let backgroundInsets = UIEdgeInsets(top: 0, left: 0, bottom: MinimumPaneHeight, right: 0)
        let backgroundOverlayInsetSpec = ASInsetLayoutSpec(insets: backgroundInsets, child: backgroundAnimatedNode)
        return ASWrapperLayoutSpec(layoutElements: [backgroundOverlayInsetSpec, stackInsetSpec])

And here is the relevant code for the header with the collapsing ASTextNode and ASImageNode.

    let titleNode: ASTextNode = {
        let node = ASTextNode()
        node.pointSizeScaleFactors = [0.8, 0.6, 0.4, 0.2]
        node.attributedText = NSAttributedString(string: "Welcome to Disqus!", attributes: [NSFontAttributeName: UIFont.disqusBlackFont(25.0), NSForegroundColorAttributeName: UIColor.white])
        return node
    }()

    override init() {
        super.init()
        automaticallyManagesSubnodes = true
        disqusImageNode.style.flexShrink = 1.0
        disqusImageNode.style.minSize = CGSize(width: 20, height: 20)
        titleNode.style.flexShrink = 1.0
    }

    override func layoutSpecThatFits(_ constrainedSize: ASSizeRange) -> ASLayoutSpec {
        let stackSpec = ASStackLayoutSpec(direction: .vertical,
            spacing: 10.0,
            justifyContent: .start,
            alignItems: .center,
            children: [disqusImageNode, titleNode])
        let insetSpec = ASInsetLayoutSpec(insets: UIEdgeInsets(top: 5, left: 5, bottom: 5, right: 5), child: stackSpec)
        return insetSpec
    }

Here is a video of what happens:

https://youtu.be/O-dwx2oYafw

If you want the layout transition code I can show it as well but it is basically just resizing the frames.

smyrgl commented 7 years ago

I'm going to close this because apparently someone fixed it in 2.0. Thanks guys!