I am trying to achieve something with Auto Layout and Stackview. I have a Vertical Stackview with a UIView, UITextView, and UIView in it as shown below.
I have checked out the previous answers here but couldn't find a clean solution to achieve this.
The UITextView is editable and must expand as the user types in it - for this I have disabled the scroll for the UITextView in the IB. I also have a height constraint set on the UITextView set to "Greater than or equal to" 10 and number of lines set to 0, so that the UITextView takes the intrinsic height at run time while the user types. I also want the expansion of the UITextView to continue until the UIStackView bottom edge reaches the Keypad accessory's top edge. I have been somewhat able to achieve the expanding UITextView part with my stack view pinned to the top, trailing, and leading edges of the Superview but I keep getting an error that the stackview needs Y position or height which is understandable but if I give it a fixed height or bottom constraint then the UITextView simply won't expand.
I also am not sure how to stop the expansion of the UITextView when it reaches the top edge of the Keyboard accessory view.
The code that I have so far is
let allowedHeight = self.view.frame.height - (self.keyboardHeight! + self.accessory.frame.height)
Basically find the allowed height in the view frame by subtracting the keyboardheight+Accessory view height. This calculation happens correctly. Next I do this (inside textViewDidChange) in hopes that just enabling/disabling the scroll on the UITextView would work but it clearly doens't since the whole text view then weirdly jumps up and down with every key stroke.
func textViewDidChange(_ textView: UITextView) {
if stackView.frame.height >= allowedHeight{
textView.isScrollEnabled = true
}
if stackView.frame.height < allowedHeight{
textView.isScrollEnabled = false
}
}
What is the best way to achieve what I am looking to do?
Couple notes...
I think you'll be better off setting the Max Height of your UITextView rather than of your UIStackView. The Text View will expand / contract based on its content, so you can set a <= height constraint.
Calculate the "elementsHeight" - the vertical size used by your top and bottom views, plus any spacing - and set the "max text view height" to the view height minus elementsHeight ... and subtract keyboard height when visible.
Update the text view's height constraint constant when "max text view height" changes.
Then set up an Observer for the text view's .contentSize ... and enable / disable scrolling based on .contentSize.height compared to "max text view height".
Needs a bit of hoop-jumping, to make sure you update sizes when subviews are laid-out, and to make sure you don't get in a recursion loop.
This is how I set it up:
The initial height constraint on the text view is <= 40 - but that doesn't really matter, as it will be changed via code every time the views layout differently.
I put up an example on GitHub -- it works, but is really just a starting-point. Take a look if you're interested, and pick it apart. https://github.com/DonMag/ExpandingTextView
Related
I am designing a chat app in which I am using the UITableViewAutomaticDimension property of table view when I am setting the label lines to 6 then all cells height is according to the text which label contains but when I increase the number of lines for label then some cells have extra height. Even when scrolling it then cell height again changed.You can check the image so that you can understand it easily thanks.
You need to give label constraints from top and bottom, rather than center vertically.
Give vertical content hugging priority
Trying to get my messages in the tableView to have automatic height in each row but currently the long label texts are cut. Any help appreciated!
This function is called from viewDidLoad() and it is called for each row(tested with print):
All constraints are set in the storyboard:
Lines are set to 0:
Constraints for label:
Resulting in no dynamic height but cutting the message instead:
I think your issue might be because your label is set in a UIView. What is your UIView constraint? Your UIView shouldn't have a height anchor for sure and maybe you could try setting it to the same height as your label. (Best guess)
I have a view and inside it I have a UILabel. I want the view to change its width according to the length of the text.
What I tried is to first perform SizeToFit() on my UILabel, hoping this will change its frame, and then put the labels frame into the view's frame.
This doesn't work, I guess because of auto layout restrictions.
This is the code of what I tried:
private func example(){
self.labelInsideView.sizeToFit()
viewThatContainsLabel.frame = labelInsideView.frame
self.layoutIfNeeded()
}
It seems pretty obvious that this won't work, because I am pretty sure size to fit does not change the frame. Is there any way to achieve this?
Make an IBOutlet of your UIView's width constraint and then simply change the width constraint constant to the width of UILabel
self.labelInsideView.sizeToFit()
self.widthConstraintOfView.constant = labelInsideView.frame.size.width
self.layoutIfNeeded()
Why are you even using this function. Your view should have constraints.
Leading = Top = Bottom = 8 and Trailing >= 20
Your label should have all the constraints equal to 5.
Now try and add any text in your Label and you'll get updated frame of the view without using this function. Just try this once.
I'm trying to create a text view which height follows number of line in it. I've worked on constraint but here I've a curious issue :
At the beginning all is centered as I want
When there is a break, text is not vertically centered anymore and goes in top left corner
When you delete characters and then come back to previous line, the text is yet vertically centered
Here is the code
func textViewDidChange(textView: UITextView) { //Handle the text changes here
if(textView.text != ""){
self.animateSendButton(true)
}else{
self.animateSendButton(false)
}//the textView parameter is the textView where text was changed
heightTextfieldConstraint.constant = self.textField.contentSize.height + 2
textField.contentInset.top = 1
}
I don't understand why there are these 3 different cases, do you have any idea to solve it ?
You can try and add an inset to the top, bot, left and right, that should keep the text centered even after a second line appears.
textView.textContainerInset = UIEdgeInsetsMake(5, 5, 5, 5)
You might be better off keeping the text view itself vertically centered while ensuring that the text view is always sized to fit the content. You can do this with Auto Layout.
Set the text view to be vertically centered in its container and also add a height constraint to the text view with a low constant value (about the height of 1 line of text). Then set the text view's Content Compression Resistant Priority to a value that is higher than the text view's height constraint (see screenshots).
I've done it in "Main.storyboard" of this demo project of mine if you want to see a working example:
https://github.com/patricklynch/Walkthrough
Perhaps you could call view.layoutIfNeeded() after text has been entered.
I have tried to search online for resize the UITableView(not UITableView cell) so that when I click the button, the tableview will minimise while the contrast of two button get closer.
TableView does provide ".hidden" function to hide itself, but it will leave a big blank space between those 2 buttons in User Interface.
So I plan to minimise the height of tableview while hidden it, but I only can get help to resize "UITableView Cell" and not "UITableView" itself.
Does there have anyway to resize TableView or adjust the UI contrast programatically?
If you views are frame based, you can simply set the TableView as hidden, and move the second button up by setting second button's origin.y like:
origin.y -= TableView.bounds.size.height
If you are using auto layout, simply change TableView's height constraint to 0 and change second button's top layout the same way as frame.
A more simpler way if you are using auto layout is, make the second button's top to TableView's bottom, so when you set the TableView's height constraint to 0, the second button will automatically move up.
Remember, when you are using auto layout, you change the constraints like how you change the frames. They are just different concepts, but internally, auto layout engine will translate the constraints into frame values.
Get the Constraint Of TableView Height from Storyboard.
#IBOutlet weak var tableView_Height: NSLayoutConstraint!
After that set the value of this table view constraint to 0
tableView_Height.constant = 0.0
apply following steps
1) take tableHeight constraint outlet
2) in numberOfRowsInSection.
if rowcount is equal to zero then set tableviewHeight constant to zero before return the rowcount.
3)if you want to set tableheight according its row count then set tableviewheight constant equal to ((totalrowcellheight)+fixsomespace)* in numberOfRowsInSection method. and aply some limit like if (height>300) then put it static height = 300