Need to change size of a textField when keyboardWillShow notification is received - ios

I want the text field to do the next when the keyboard appears on the screen:
Move above the clave
Stretch to the width of the screen
The first item works, but the second one - doesn't.
When opening the application, the text field is attached with snap kit constructs
My code:
#objc private func keyboardWillShow (notification: NSNotification) {
guard let keyboardSize = (notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? NSValue)?.cgRectValue else { return }
UIView.animate(withDuration: 0.2) {
self.textField.widthAnchor.constraint(equalToConstant: self.view.frame.width).isActive = true
self.textField.frame.origin.y = keyboardSize.origin.y - self.textField.frame.height
}
}

You cannot change the weight of the text field with rounded corners.
Consider to use the UITextView or change text field border style to:
textField.borderStyle = UITextBorderStyleRoundedRect;
UPD:
I'm really sorry, I made mistake and read the question incorrectly.
In this case, you need to check the logs for autolayout errors. This issue can appear because you have conflicting constraints:
You have added the width constraint using a storyboard or xib it may conflict with the constraint you are setting in the keyboardWillShow method.
You have added trailing constraint and getting the next conflict. Thus, the trailing constraint trying to make the width smaller than you set to the width constraint:
Solutions:
If you are using storyboard constraints create an outlet of the constraint from the storyboard and change it in the next way:
self.widthConstraint.constant = self.view.frame.width;
Make trailing constraint less than or equal rather than equal. In this way, the width will be changed but the trailing constraint will prevent the text fields to be bigger than the desired paddings. Another way will be to update the trailing constraint instead of the width constraint, but you will need more calculations.

Related

Re-position uilabel

I wanted the "number" & "status" to display on the left if there is not QRCode display (constraints has been set for image & labels.)
Result without QRCode:
.
The result with QRCode will be:
IT IS very easy just make width Constraint of QRcode image, if QR code is not available than make widht constant = 0,
#IBOutlet weak var width: NSLayoutConstraint!
if (your condition)
{
width.constant = 0
}
else
{
width.constant = 30
}
You can do that with a second pair of constraints attached to left side of a view.
Add outlets to that constraints and set constant value to desired offset(from code), if there is no QRCode View.
Another way is to add MoreThanOrEquel constraint to left side (e.g >= 10)
Than another constraint with constant value 10, but with lower priority.
When you remove QRCode view, it will destroy it constraints and constraints to left side will affects and move yours labels to left.
You could make constraint for labels that way:
I.e. make constraint for image leading to left side + image width, both labels also have leading to left side. Then if there is no QR Code adjust labels leading constraints to value you need.
Or you could make both labels leading to image view and set the image view width constraint to 0.
This Problem is very simple , can achieve using UIStackView just making hide/Show.
For Ex: If QR-code is present show or else hide QR-Code.
Label (Number and status and image) will automatically get adjust. Following is the screen short for better understanding.
IBOutlet UIView *qr_view; // Image or View
Case 1 :QR Present
qr_view.hidden = NO;// Show
Case 2: QR Not Present
qr_view.hidden = YES;// hide

How to modify view controller after pressing a button?

Let's say that if you press the button from the bottom of the screen after typing something in the account text field, you would be required to also enter the password like in the second image.
How should I do this? I don't think that creating a new view controller would be good. So, should I somehow modify the same view controller?
How could I add the new password text field under the account text field?
Keep in mind that they are still centered. Hiding and unhiding wouldn't work in this case and I also need to modify more things than only adding that text field.
First, create a UIView with everything you need on them. in this example I will have only two text fields and they are all color coded.
The view needs to be centered both horizontally and vertically, with width and height. Set identifiler for the height constraint to be updated later. Set the clip to board to true so that when we redeuce the height of the view, text fields below will hide. The settings for the view will be like this
For your text fields, they must have a constant padding to top. In my example, they are set to be in center horizontally, having a constant height, width and padding to opp.
Now, all you need to do is to get the height of the view from code and set the height to show or hide the text fields.
var flag = true
#IBAction func click(_ sender: Any) {
if flag {
flag = false
let filteredConstraints = theView.constraints.filter { $0.identifier == "viewHeight" }
if let heightConstraint = filteredConstraints.first {
heightConstraint.constant = 60
}
} else {
flag = true
let filteredConstraints = theView.constraints.filter { $0.identifier == "viewHeight" }
if let heightConstraint = filteredConstraints.first {
heightConstraint.constant = 128
}
}
}
Here is the code running in simulater.
another option is you can make tableView at Center, you need to create tableview height constraint outlet,
then you can maintain a counter how many time you want to add View, the counter should be return in tableView numberOfRowsInSection,
and you can make this view in Prototype Cell or using NIB, then just adjust header label text, textField placeholder and text on specific cell index,
when you increase or decrease counter update tableView Constraint, example you have a cell height as 50, in first case when you have on cell in tableView, you can set your tableView height constraint's constant as 50, when cells are two the 100 and so on.....
I think it's a simple logic

Change View Position based on ImageView size

I have Imageview and UIView on View Controller. If Imageview is nil or image is not available then UIView replace its postion.Do any know how is it possible using auto layout?
For trying purpose, I have fixed height and width of both(Imageview and UIView). Imageview have "top 8 pixel" and "Horizontally in container" margin. UIView have "top 0 from Imageview" and "Horizontally in container" margin. Set Imageview to nil but it doesn't work.
A good suggestion would be to add both of the image view and the view in a stackView and follow the steps mentioned in: UIStackView Distribution Fill Equally.
However, you can achieve what are you asking for by adding additional constraint between the bottom view and the top layout guide:
and then, set its priority value to be less than the default (1000) -in my example I set it to 500- and the its constant value to 0:
Its appearance should be displayed as dotted line, meaning that there is another constraint -with a higher priority value- deciding the x axis of the view, if this constraint has been removed/deactivated the dotted one should be activated.
Finally, make sure that if there is no available image you have to remove image view from its super view (call imageView.removeFromSuperview()), setting it as hidden or setting its alpha to 0.0 doesn't activate the dotted constraint:
class ViewController: UIViewController {
//...
#IBOutlet weak var imageView: UIImageView!
// I'm checking in 'viewDidLoad' method just for describing purposes,
// of course, you can do the check when needed...
override func viewDidLoad() {
// if there is something wrong, you should call:
imageView.removeFromSuperview()
}
//...
}
The output would be:
Take the outlet of height constraint of UIImageView and do below code
if (imageview == nil){
imageViewHeightConstraint.constant = 0
}
else{
imageViewHeightConstraint.constant = 60
}
And other query you can ask.
You can manage this by giving priority to the constraints using auto layout. Give your UIView top space from ImageView and the TopLayout. Assign a lower priority to the constraint (any value less than 1000) where you have given top space from top layout guide. If your image is nil , remove the image view from the view using imageview.RemoveFromSuperView(), the UIView will automatically take the next constraint i.e. from TopLayout guide. I am attaching a screenshot where to find the priority of the constraint on storyBoard.

Swift: Views not adjusting to programmatic constraints

I have a view that I am making hidden at the bottom of the screen, and want the scrollView above it to adjust and fill the void space.
The view at the bottom of the screen is a GADBannerView and has a fixed height of 50 (bannerHeight). The scroll view above it has a constraint to the bottom of the container that equals 50 (scrollConstraint). See photo.
In viewDidLoad is am setting these constraints to the following:
bannerHeight.constant = 0
scrollConstraint.constant = 0
This is causing the bannerView did disappear but the scroll view is staying in it's original position and not filling the void space.
You can force the superview to take into account the change of the constraint because this does not happen automatically. Add your code to viewDidLayoutSubviews() instead or simply call view.layoutIfNeeded() after you set the constants to 0 in the viewDidLoad().
If this does not work, you can try this alternative approach:
Go to your Storyboard and click on the scroll view's bottom constraint (the blue line that gives the scroll view its bottom constraint of 50). In the Attributes Inspector you should be able to see details about your constraint, it should look something like this
In the field that asks for an Identifier, give it the name "ScrollViewBottom" or whatever name you like.
Now loop over all the constraints that make up your scroll view and use the identifier name to find the correct one and change it's constant as follows
for constraint in yourScrollView.superview!.constraints {
if constraint.identifier == "ScrollViewBottom" {
constraint.constant = 0
}
}
Finally, force the view to take into account of this change by calling the following straight after
view.layoutIfNeeded()

Updating constraints programmatically

Situation is like I have a view with four buttons
There comes a condition when button with text Search Community should be hidden and width of Options button should get increased
Using Constraints for the first time in my project, I am not getting how to achieve this. Set of constraints added on both these buttons would be clear from the following two images.
The problem I see with your setup is that you have this constraint between the 2 buttons of equal width. This is true in the first case but when you want to hide one of them, it is not anymore.
So, you will need to rethink your constraints a bit. Maybe instead of the equal width constraint, you could use a static width constraint one the first button(the left one, that you want to hide). Then the second one, will just have a horizontal space constraint to the first one, and a trailing space to the superView.
Then you make an outlet in the VC for the width constraint of the first button and when you want to hide it you do something like this:
self.searchButtonWidthConstraint.constant = 0
UIView.animateWithDuration(0.3, animations: { () -> Void in
self.view.layoutIfNeeded() // if you want to animate the constraint change
})
Let me know if you have questions. Good luck and hope it works out!
Update
For the landscape use case, you could listen to the orientation change notification, to update the width constraint of the button
-(void) willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {
self.searchButtonWidthConstraint.constant = LANDSCAPE_WIDTH
UIView.animateWithDuration(duration, animations: { () -> Void in
self.view.layoutIfNeeded() // if you want to animate the constraint change
})
}
Add constraint to 1st Button
Leading Space To NewView(gray colored)
Bottom space to NewView
Top Space to Topbutton (blue colored in your 1st and 2nd image)
Width (from Bottom - Right portion )
Add Constraint to 2nd Button
Trailing Space to NEwView
Bottom space to NewView
Top Space to Topbutton (blue colored in your 1st and 2nd image)
Horizontal space FirstButton ( Search Community )
Width

Resources