nathantannar4 / InputBarAccessoryView

A simple and easily customizable InputAccessoryView for making powerful input bars with autocomplete and attachments
MIT License
1.17k stars 229 forks source link

InputBarButtonItems stacked horizontally in top stack #226

Open ElrB opened 2 years ago

ElrB commented 2 years ago

Hi, thanks for your work. I wanted to ask how could I achieve what is in the attached image below (WhatsApp input bar top stack for status reply). I also attached what I have achieved so far with below code.

func configInputbarForReply(title: String?, subtitle: String?, image: UIImage?) { let attributed = NSMutableAttributedString(string: title ?? "", attributes: [.font : UIFont.systemFont(ofSize: 13, weight: .semibold), .foregroundColor: UIColor(named: kblackOnWhiteColor)!]) let attributedTextMessage = NSMutableAttributedString(string: subtitle ?? "", attributes: [.font : UIFont.systemFont(ofSize: 12, weight: .regular), .foregroundColor: UIColor(named: kblackOnWhiteColor)!]) if self.traitCollection.userInterfaceStyle == .dark { self.postSampleImageButton.backgroundColor = .systemGray5 self.postCaptionButtonLabel.backgroundColor = .systemGray5 self.replierNameButtonLabel.backgroundColor = .systemGray5 } else { self.postSampleImageButton.backgroundColor = .systemGray2 self.postCaptionButtonLabel.backgroundColor = .systemGray2 self.replierNameButtonLabel.backgroundColor = .systemGray2 }

    self.postSampleImageButton.setSize(CGSize(width: 50, height: 50), animated: false)
    self.postSampleImageButton.contentHorizontalAlignment = .fill
    self.postSampleImageButton.contentVerticalAlignment = .fill
    self.postSampleImageButton.contentEdgeInsets = UIEdgeInsets(top: 10, left: ScreenSize.Width - 40, bottom: 8, right: 20)
    self.postSampleImageButton.image = UIImage(named: "appLogo")?.withRoundedCorners(radius: 5)
    self.postSampleImageButton.contentMode = .scaleAspectFill
    self.replierNameButtonLabel.setAttributedTitle(attributed, for: .normal)
    self.postCaptionButtonLabel.setAttributedTitle(attributedTextMessage, for: .normal)
    self.postCaptionButtonLabel.titleLabel?.numberOfLines = 1
    self.postCaptionButtonLabel.titleLabel?.lineBreakMode = .byTruncatingTail
    self.postCaptionButtonLabel.setTitleColor(UIColor(named: kBLACKONWHITECOLOR), for: .normal)
    self.postCaptionButtonLabel.contentHorizontalAlignment = .left
    self.postCaptionButtonLabel.contentEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 15, right: 20)
    self.replierNameButtonLabel.contentHorizontalAlignment = .left

    if image != nil {
        self.replierNameButtonLabel.contentEdgeInsets = UIEdgeInsets(top: 5, left: 10, bottom: 8, right: 20)
        self.inputBar.setStackViewItems([self.postSampleImageButton, self.replierNameButtonLabel, self.postCaptionButtonLabel], forStack: .top, animated: true)
    } else {
        self.replierNameButtonLabel.contentEdgeInsets = UIEdgeInsets(top: 20, left: 10, bottom: 20, right: 20)
        self.inputBar.setStackViewItems([self.replierNameButtonLabel, self.postCaptionButtonLabel], forStack: .top, animated: true)
    }

    inputBar.isHidden = false
    self.inputBar.inputTextView.becomeFirstResponder()
}

image_123986672-3

Screen Shot 2022-04-29 at 1 26 31 AM