使用 AsyncDisplayKit 包装嵌套的 ASStackLayoutSpec
Wrapping nested ASStackLayoutSpec with AsyncDisplayKit
将嵌套 ASStackLayoutSpec
与 AsyncDisplayKit 结合使用我正在努力实现这一目标
所以我正在创建一个带有头像的垂直 ASStackLayoutSpec
和另一个带有用户名、时间戳和文本的水平 ASStackLayoutSpec
override func layoutSpecThatFits(_ constrainedSize: ASSizeRange) -> ASLayoutSpec {
// HEADER with username and timestamp
let spacer = ASLayoutSpec()
spacer.style.flexGrow = 1
let headerStackSpec = ASStackLayoutSpec.horizontal()
headerStackSpec.spacing = 2
headerStackSpec.alignItems = .baselineFirst
headerStackSpec.children = [userNode, spacer, timestampNode]
// CONTENT - HEADER and text
let contentStackSpec = ASStackLayoutSpec.vertical()
contentStackSpec.spacing = 2
contentStackSpec.children = [headerStackSpec, messageNode]
// MAIN - avatar and CONTENT
let mainStackSpec = ASStackLayoutSpec.horizontal()
mainStackSpec.spacing = 9
mainStackSpec.children = [avatarNode, contentStackSpec]
return ASInsetLayoutSpec(insets: UIEdgeInsets(top: 2, left: 10, bottom: 2, right: 10), child: mainStackSpec)
}
但是结果不是我想的那样
看起来文本变得无穷大,没有正确换行。时间戳也可能在右边出界的某个地方。
我尝试了 .alignItems
和 .justifyContent
的不同组合,但无法正常工作。
您需要在方法layoutSpecThatFits
:
中设置您消息节点的width
let messageWidth = UIScreen.main.bounds - (leftSpacing + rightSpacing)
message.style.width = ASDimension(unit: .points, value: messageWidth)
试试这些属性:
contentStackSpec.style.flexShrik = 1
messageNode.style.flexShrik = 1
contentStackSpec.children = [headerStackSpec, messageNode]
将嵌套 ASStackLayoutSpec
与 AsyncDisplayKit 结合使用我正在努力实现这一目标
所以我正在创建一个带有头像的垂直 ASStackLayoutSpec
和另一个带有用户名、时间戳和文本的水平 ASStackLayoutSpec
override func layoutSpecThatFits(_ constrainedSize: ASSizeRange) -> ASLayoutSpec {
// HEADER with username and timestamp
let spacer = ASLayoutSpec()
spacer.style.flexGrow = 1
let headerStackSpec = ASStackLayoutSpec.horizontal()
headerStackSpec.spacing = 2
headerStackSpec.alignItems = .baselineFirst
headerStackSpec.children = [userNode, spacer, timestampNode]
// CONTENT - HEADER and text
let contentStackSpec = ASStackLayoutSpec.vertical()
contentStackSpec.spacing = 2
contentStackSpec.children = [headerStackSpec, messageNode]
// MAIN - avatar and CONTENT
let mainStackSpec = ASStackLayoutSpec.horizontal()
mainStackSpec.spacing = 9
mainStackSpec.children = [avatarNode, contentStackSpec]
return ASInsetLayoutSpec(insets: UIEdgeInsets(top: 2, left: 10, bottom: 2, right: 10), child: mainStackSpec)
}
但是结果不是我想的那样
看起来文本变得无穷大,没有正确换行。时间戳也可能在右边出界的某个地方。
我尝试了 .alignItems
和 .justifyContent
的不同组合,但无法正常工作。
您需要在方法layoutSpecThatFits
:
width
let messageWidth = UIScreen.main.bounds - (leftSpacing + rightSpacing)
message.style.width = ASDimension(unit: .points, value: messageWidth)
试试这些属性:
contentStackSpec.style.flexShrik = 1
messageNode.style.flexShrik = 1
contentStackSpec.children = [headerStackSpec, messageNode]