AsyncDisplayKit ASLayoutSpec Width

WidthTest.swift

import UIKit
import AsyncDisplayKit

var calculatedWidth: CGFloat = 0

class WidthTestViewController: UIViewController {
  
  // MARK: Properties
  
  private let containerNode: WidthTestContainerNode
  
  // MARK: Lifecycle
  
  required init() {
    self.containerNode = WidthTestContainerNode()
    super.init(nibName: nil, bundle: nil)
  }
  
  required init(coder aDecoder: NSCoder) {
    fatalError("storyboards are incompatible with truth and beauty")
  }
  
  // MARK: UIViewController
  
  override func viewDidLoad() {
    super.viewDidLoad()

    self.view.backgroundColor = UIColor(red: 20.0/255.0, green: 20.0/255.0, blue: 20.0/255.0, alpha: 1.0)
    self.view.addSubview(self.containerNode.view)
  }
  
  override func viewWillLayoutSubviews() {
    super.viewWillLayoutSubviews()
    
    self.containerNode.measure(CGSizeMake(180, 142))
    self.containerNode.frame = CGRectMake(
      (self.view.bounds.size.width - self.containerNode.calculatedSize.width) / 2,
      (self.view.bounds.size.height - self.containerNode.calculatedSize.height) / 2,
      self.containerNode.calculatedSize.width,
      self.containerNode.calculatedSize.height)
  }
  
  override func preferredStatusBarStyle() -> UIStatusBarStyle {
    return UIStatusBarStyle.LightContent
  }
  
  override func supportedInterfaceOrientations() -> UIInterfaceOrientationMask {
    return UIInterfaceOrientationMask.Portrait
  }
}

class WidthTestContainerNode: ASDisplayNode {
  
  // MARK: Properties
  
  let textNode: WidthTestTextNode
  
  private let blockNode: ASDisplayNode
  
  // MARK: Lifecycle
  
  required override init() {
    self.textNode = WidthTestTextNode()
    self.blockNode = ASDisplayNode()
    
    super.init()
    
    // Blue box
    self.backgroundColor = UIColor(red: 111.0/255.0, green: 168.0/255.0, blue: 222.0/255.0, alpha: 1.0)
    
    // Yellow box
    self.textNode.backgroundColor = UIColor(red: 255.0/255.0, green: 217.0/255.0, blue: 102.0/255.0, alpha: 1.0)
    self.textNode.attributedString = NSAttributedString(
      string: "asfhjashfasjkfhkas fkjasafhasfjhaskjfjkasf asfhjkashfjkas fashkjfh kajsf asfjasjhk fhkjasfhjk afsjkafsfhsjkasfhjkas",
      attributes: [NSForegroundColorAttributeName: UIColor.blackColor()])
    self.textNode.flexShrink = true
    self.textNode.flexGrow = true
    self.addSubnode(self.textNode)
    
    // Red box
    self.blockNode.backgroundColor = UIColor(red: 234.0/255.0, green: 153.0/255.0, blue: 153.0/255.0, alpha: 1.0)
    self.addSubnode(self.blockNode)
  }
  
  override func layout() {
    super.layout()
    
    // Display a red box where the extra space is
    let w = (self.textNode.calculatedSize.width - calculatedWidth)
    self.blockNode.frame = CGRectMake(
      CGRectGetMaxX(self.textNode.frame) - w,
      CGRectGetMinY(self.textNode.frame),
      w,
      self.textNode.frame.size.height)
  }
  
  // MARK: ASDisplayNode
  
  override func layoutSpecThatFits(constrainedSize: ASSizeRange) -> ASLayoutSpec {
    let hStack = ASStackLayoutSpec(
      direction: .Horizontal,
      spacing: 0,
      justifyContent: .Start,
      alignItems: .Start,
      children: [self.textNode])
    
    hStack.alignSelf = .Stretch
    
    let vStack = ASStackLayoutSpec(
      direction: .Vertical,
      spacing: 0,
      justifyContent: .Start,
      alignItems: .Start,
      children: [hStack])
    
    return ASInsetLayoutSpec(
      insets: UIEdgeInsetsMake(8, 8, 8, 8),
      child: ASStaticLayoutSpec(children: [vStack]))
  }
  
  class WidthTestTextNode: ASTextNode {
    
    // MARK: ASDisplayNode
    
    override func calculateSizeThatFits(constrainedSize: CGSize) -> CGSize {
      let size = super.calculateSizeThatFits(constrainedSize)
      
      // Store width to calculate size of red box
      calculatedWidth = size.width

      NSLog("Max Width: " + String(constrainedSize.width) + " | Calculated Width " + String(size.width))
      
      return CGSize(width: size.width, height: size.height)
    }
  }
}