How to animate when add Bottom Stack View with bottomStackView.addArrangedSubview()

[nathantannar4]

What animation are you trying to achieve

_{Sent with GitHawk}

[lalfuturedev]

I just want to get animate both messageInputBar and collectionView in bottomStackViews from bottom to top.I tried with self.layoutIfNeeded() in UIView.animate function.It did animate but doesn't smooth.

[nathantannar4]

What method calls are you using? Please provide some code snippets else it's difficult for me to dubug what your doing. What's is happening and what do you expect to happen? "Doesn't smooth" isn't descriptive enough

_{Sent with GitHawk}

[lalfuturedev]

Sorry for the unclear question.This is my code to animate bottomStackViews.

` import Foundation import MessageInputBar

class MM360MessageInputBar: MessageInputBar{

fileprivate let bottomStackImages: [String] = ["doc_input_item","cam_input_item","gal_input_item","audio_input_item","loc_input_item"]
fileprivate var bottomStackCollectionView: AttachmentCollectionView!
fileprivate var isBottomStackVisible: Bool = false
fileprivate var bottomItem: InputBarButtonItem!

override init(frame: CGRect) {
    super.init(frame: frame)
    setUpBottomStackCollectionView()
    configure()
}

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

fileprivate func configure(){
    backgroundView.backgroundColor = Colors.InputBar.backgroundColor
    backgroundView.borderColor = .clear
    separatorLine.isHidden = true

    inputTextView.backgroundColor = .white
    inputTextView.placeholderTextColor = UIColor(red: 0.6, green: 0.6, blue: 0.6, alpha: 1)
    inputTextView.textContainerInset = UIEdgeInsets(top: 8, left: 16, bottom: 8, right: 16)
    inputTextView.placeholderLabelInsets = UIEdgeInsets(top: 8, left: 20, bottom: 8, right: 20)
    inputTextView.layer.cornerRadius = 16.0
    inputTextView.layer.masksToBounds = true
    inputTextView.scrollIndicatorInsets = UIEdgeInsets(top: 8, left: 0, bottom: 8, right: 0)

    sendButton.title = nil
    sendButton.image = UIImage(named: "message_send_btn")!.withRenderingMode(.alwaysOriginal)
    sendButton.keyboardEditingBeginsAction()

    let plusButton = InputBarButtonItem().onSelected {[weak self] (item) in

        guard let strongSelf = self else{
            return
        }

        if strongSelf.isBottomStackVisible{
            strongSelf.bottomStackView.removeArrangedSubview(strongSelf.bottomStackCollectionView)

// strongSelf.setStackViewItems([], forStack: .bottom, animated: true) }else{ strongSelf.bottomStackView.addArrangedSubview(strongSelf.bottomStackCollectionView) // strongSelf.setStackViewItems([strongSelf.bottomItem], forStack: .bottom, animated: true) }

        UIView.animate(withDuration: 0.3, animations: {
            strongSelf.layoutIfNeeded()
        }, completion: { (_) in

        })

        strongSelf.isBottomStackVisible = !strongSelf.isBottomStackVisible
        item.image = strongSelf.isBottomStackVisible ? UIImage(named: "conv_cross_icon")!.withRenderingMode(.alwaysOriginal) : UIImage(named: "conv_plus_icon")!.withRenderingMode(.alwaysOriginal)
    }

    plusButton.setSize(CGSize(width: 36, height: 36), animated: false)
    plusButton.setImage(UIImage(named: "conv_plus_icon")!.withRenderingMode(.alwaysOriginal), for: .normal)
    plusButton.imageView?.contentMode = .scaleAspectFit
    setLeftStackViewWidthConstant(to: 55, animated: false)
    setStackViewItems([plusButton], forStack: .left, animated: false)

// bottomItem = InputBarButtonItem() // bottomItem.addSubview(bottomStackCollectionView) // bottomItem.setSize(CGSize(width: 300, height: 200), animated: true) // bottomItem. = bottomStackCollectionView

}

fileprivate func setUpBottomStackCollectionView(){
    let layout = UICollectionViewFlowLayout()
    layout.scrollDirection = .vertical
    layout.itemSize = CGSize(width: 100 , height: 100)
    layout.sectionInset = UIEdgeInsets(top: 20, left: 0, bottom: 20, right: 0)
    bottomStackCollectionView = AttachmentCollectionView(frame: .zero, collectionViewLayout: layout)
    bottomStackCollectionView.intrinsicContentHeight = 240
    bottomStackCollectionView.bounces = false
    bottomStackCollectionView.isScrollEnabled = false
    bottomStackCollectionView.showsHorizontalScrollIndicator = false
    bottomStackCollectionView.backgroundColor = .clear
    bottomStackCollectionView.register(UINib(nibName: "InputImageViewCell", bundle: nil), forCellWithReuseIdentifier: InputImageViewCell.identifier)
    bottomStackCollectionView.dataSource = self        
}

}

extension MM360MessageInputBar: UICollectionViewDataSource{

func numberOfSections(in collectionView: UICollectionView) -> Int {
    return 1
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return bottomStackImages.count
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

    if let cell = collectionView.dequeueReusableCell(withReuseIdentifier: InputImageViewCell.identifier, for: indexPath) as? InputImageViewCell{
        cell.imageView.image = UIImage(named: bottomStackImages[indexPath.item])!
        return cell
    }

    assert(false, "Unexpected Cell")
}

} `

This is the result that I am facing.I don't want animation that color cover the bottomStackCollectionView.I want simple animation to appear from bottom to top.

[nathantannar4]

When you set the bottom stack view items don't make the call animated if you adding your own animation block. Also, call layoutIfNeeded on the collection view before the animation block so it's size(based on constraints) can be calculated

_{Sent with GitHawk}

[lalfuturedev]

Thanks @nathantannar4 for giving your time...

[ducanh92hust]

What is the solution?