I am creating custom node to show gif file with play and pause button. Following is my code.
import Foundation
import AsyncDisplayKit
class GifNode: ASCellNode {
var gifImageNode:ASNetworkImageNode = {
let node = ASNetworkImageNode()
node.contentMode = .scaleAspectFit
node.shouldRenderProgressImages = true
return node
}()
var playImage: ASImageNode = {
let node = ASImageNode()
node.contentMode = .scaleAspectFit
node.style.height = ASDimensionMakeWithPoints(30)
node.style.height = ASDimensionMakeWithPoints(30)
node.backgroundColor = .gray
node.image = #imageLiteral(resourceName: "play")
return node
}()
init(model:GifContent)
{
super.init()
self.automaticallyManagesSubnodes = true
let width = UIScreen.main.bounds.size.width
let height = (width * model.height) / model.width
gifImageNode.url = URL(string: "https://i.pinimg.com/originals/07/44/38/074438e7c75034df2dcf37ba1057803e.gif")
gifImageNode.style.width = ASDimensionMake(width)
gifImageNode.style.height = ASDimensionMake(height)
gifImageNode.animatedImagePaused = true
gifImageNode.addTarget(self, action: #selector(self.toggleGifPlay), forControlEvents: .touchUpInside)
}
@objc func toggleGifPlay()
{
self.gifImageNode.animatedImagePaused = !self.gifImageNode.animatedImagePaused
self.playImage.isHidden = !self.gifImageNode.animatedImagePaused
}
override func layoutSpecThatFits(_ constrainedSize: ASSizeRange) -> ASLayoutSpec {
let playButtonCenterSpec = ASCenterLayoutSpec(centeringOptions: .XY, sizingOptions: .minimumXY, child: self.playImage)
return ASOverlayLayoutSpec(child: gifImageNode, overlay: playButtonCenterSpec)
}
}
When I try to use gif node in another ASCellNode it does not render. I can see play button but not the actual gif file. If I try to load jpeg with same control, it works fine. Also it works fine, if I try to load gif directly and not using above class.
Not sure if I am missing anything.
I test your app, but gifImageNode.animatedImagePaused = true
is disabled by default ur animation.