I wish to obtain a “present extra” impact for my part. The desired impact is as follows(sorry for my poor portray), the view’s top is ready to a particular worth at first(akin to 304), and after I click on the “test extra” button, the view’s top will return to its unique top.
In my demo, the picture all the time coated superview, and the contentLabel disappear at first, similar to the gif beneath. I attempted to set setContentCompressionResistancePriority
and setContentHuggingPriority
, however it’s not working.
I’ve two questions. Firstly the best way to make the picture to not cowl it is superview, and simply present part of it when its superview’s top isn’t sufficient for imageView to point out fully. Second, the contentLabel shouldn’t disappear at first, I observed that it’s as a result of the label doesn’t know its top at first, so the peak constraint is 0, however the best way to calculate the suitable top for the content material label in order that it may be proven on display screen even the superview’s top isn’t sufficient.
Right here is my code, I’ve tried half a day however nonetheless not a clue. Thanks for serving to:
import UIKit
import SnapKit
import SDWebImage
class ViewController: UIViewController {
var isExpanding = false
var defaultHeightConstraint: Constraint?
personal lazy var panelView: UIView = {
let view = UIView()
view.layer.masksToBounds = true
return view
}()
personal lazy var stackView: UIStackView = {
let stackView = UIStackView()
stackView.axis = .vertical
stackView.alignment = .middle
stackView.distribution = .fill
return stackView
}()
personal lazy var textPanelView: UIView = {
let view = UIView()
view.backgroundColor = .grey
return UIView()
}()
personal lazy var textTitleLabel: UILabel = {
let label = UILabel()
label.font = UIFont.systemFont(ofSize: 16)
label.textColor = .black
return label
}()
personal lazy var textContentLabel: UILabel = {
let label = UILabel()
label.font = UIFont.systemFont(ofSize: 12)
label.textColor = .black
label.numberOfLines = 0
return label
}()
personal lazy var imagePanelView: UIView = {
let view = UIView()
view.backgroundColor = .cyan
view.layer.masksToBounds = true
return UIView()
}()
personal lazy var imageTitleLabel: UILabel = {
let label = UILabel()
label.font = UIFont.systemFont(ofSize: 16)
label.textColor = .black
return label
}()
personal lazy var imageView: UIImageView = {
let imageView = UIImageView()
imageView.contentMode = .scaleAspectFill
view.layer.masksToBounds = true
return imageView
}()
personal lazy var expandPanel: UIView = {
UIView()
}()
personal lazy var expandBtnBgView: UIView = {
let view = UIView()
return view
}()
personal lazy var expandBtn: UIButton = {
let button = UIButton()
button.titleLabel?.font = UIFont.systemFont(ofSize: 14)
button.setTitleColor(.systemGreen, for: .regular)
button.setTitle("Examine Extra", for: .regular)
button.addTarget(self, motion: #selector(onClickExpandBtn), for: .touchUpInside)
button.backgroundColor = .white
return button
}()
override func viewDidLoad() {
tremendous.viewDidLoad()
setupUI()
setupModel()
}
override func viewDidAppear(_ animated: Bool) {
tremendous.viewDidAppear(animated)
}
override func viewWillLayoutSubviews() {
}
personal func setupUI() {
view.backgroundColor = .white
view.addSubview(panelView)
panelView.addSubview(stackView)
stackView.addArrangedSubview(textPanelView)
stackView.addArrangedSubview(imagePanelView)
textPanelView.addSubview(textTitleLabel)
textPanelView.addSubview(textContentLabel)
imagePanelView.addSubview(imageTitleLabel)
imagePanelView.addSubview(imageView)
panelView.addSubview(expandPanel)
expandPanel.addSubview(expandBtnBgView)
expandBtnBgView.addSubview(expandBtn)
panelView.snp.makeConstraints { make in
make.prime.equalToSuperview().inset(40)
make.left.proper.equalToSuperview().inset(16)
defaultHeightConstraint = make.top.lessThanOrEqualTo(304).constraint
}
defaultHeightConstraint?.isActive = true
stackView.snp.makeConstraints { make in
make.edges.equalToSuperview()
}
textPanelView.snp.makeConstraints { make in
make.left.proper.equalToSuperview()
}
textTitleLabel.snp.makeConstraints { make in
make.left.prime.equalToSuperview()
make.top.equalTo(22)
}
textContentLabel.snp.makeConstraints { make in
make.left.proper.equalToSuperview()
make.prime.equalTo(textTitleLabel.snp.backside).offset(12)
make.backside.equalToSuperview().inset(24)
}
imagePanelView.snp.makeConstraints { make in
make.left.proper.equalToSuperview()
}
imageTitleLabel.snp.makeConstraints { make in
make.prime.equalToSuperview()
make.left.equalToSuperview()
make.top.equalTo(22)
}
imageView.snp.makeConstraints { make in
make.prime.equalTo(imageTitleLabel.snp.backside).offset(12)
make.left.proper.equalToSuperview().inset(16)
make.width.equalTo(UIScreen.fundamental.bounds.width - 64)
make.top.equalTo(0)
make.backside.equalToSuperview().inset(24)
}
expandPanel.snp.makeConstraints { make in
make.left.proper.equalToSuperview()
make.top.equalTo(86)
make.backside.equalToSuperview()
}
expandBtnBgView.snp.makeConstraints { make in
make.left.proper.equalToSuperview()
make.top.equalTo(46)
make.backside.equalToSuperview()
}
expandBtn.snp.makeConstraints { make in
make.centerX.equalToSuperview()
make.backside.equalToSuperview().inset(16)
}
// this code didn't work
textPanelView.setContentHuggingPriority(.defaultHigh, for: .vertical)
textPanelView.setContentCompressionResistancePriority(.required, for: .vertical)
textContentLabel.setContentCompressionResistancePriority(.required, for: .vertical)
textContentLabel.setContentHuggingPriority(.required, for: .vertical)
imagePanelView.setContentHuggingPriority(.defaultLow, for: .vertical)
imagePanelView.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
imageView.setContentHuggingPriority(.defaultLow, for: .vertical)
imageView.setContentCompressionResistancePriority(.defaultLow, for: .vertical)
}
personal func setupModel() {
// setupText
textTitleLabel.textual content = "Bundle Title"
textContentLabel.textual content = "BeefnCheese BeefnDouble Cheese BeefnDouble Cheese BeefnDouble Cheese BeefnDouble Cheese BeefnDouble Cheese Beef "
// setupImage
imageTitleLabel.textual content = "Picture Title"
let imgString = "https://i.postimg.cc/Wzxfw1JY/stylish.jpg"
imageView.sd_setImage(with: URL(string: imgString)) { [weak self] picture, _, _, _ in
guard let self = self, let picture = picture else { return }
let imgSize = picture.measurement
let actualWidth = UIScreen.fundamental.bounds.width - 64
let actualHeight = (actualWidth / imgSize.width) * imgSize.top
self.imageView.snp.updateConstraints { make in
make.width.equalTo(actualWidth)
make.top.equalTo(actualHeight)
}
}
}
@objc func onClickExpandBtn() {
isExpanding = !isExpanding
if isExpanding {
defaultHeightConstraint?.isActive = false
expandBtn.setTitle("Collapse", for: .regular)
} else {
defaultHeightConstraint?.isActive = true
expandBtn.setTitle("Examine Extra", for: .regular)
}
}
}