TextureGroup / Texture

Smooth asynchronous user interfaces for iOS apps.
https://texturegroup.org/
Other
8.02k stars 1.29k forks source link

ASTextNode can't put corner radius and shadow at the same time. #2098

Open lambda123254 opened 10 months ago

lambda123254 commented 10 months ago

I wanted to create text that have white background with corner radius and shadow around it, but it's not working, so how to do it? actually there are plenty workaround to solve this, but I just want to use ASTextNode properties, no need to add another element. When clipsToBounds = true, corner radius worked and shadow failed When clipsToBounds = false, corner radius failed and shadow worked

here is my code

class AnotherViewController: ASDKViewController<ASDisplayNode> {

    let rootNode = ASDisplayNode()
    lazy var textNode: ASTextNode = {
        let node = ASTextNode()
        node.clipsToBounds = true
        node.attributedText = NSAttributedString(string: "Test Text")
        node.textContainerInset = UIEdgeInsets(top: 6, left: 6, bottom: 6, right: 6)
        node.backgroundColor = .white
        node.cornerRadius = 5
        node.view.layer.shadowColor = UIColor.black.cgColor
        node.view.layer.shadowOpacity = 0.6
        return node
    }()

    override init() {
        super.init(node: rootNode)
        rootNode.backgroundColor = .red
        rootNode.automaticallyManagesSubnodes = true
        rootNode.layoutSpecBlock = {[self] node, constarint -> ASLayoutSpec in
            return ASStackLayoutSpec(direction: .vertical, spacing: 8, justifyContent: .center, alignItems: .center, children: [
                textNode
            ])
        }
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func viewDidLoad() {
        super.viewDidLoad()

    }
}

clipsToBounds = true

image

clipsToBounds = false

image