UITextFields keyboard not appearing in UIScrollview - swift

I have 2 textfields as subViews of a contentView and the contentView is a subView of a scrollView. The textfields appear with no issue.But the problem I am having is when I tap or select the textfield to enter text neither a keyboard appears or the blue cursor, the textfields placeholder remains there. Is there something wrong with my constraints? How can I get the keyboard to appear and edit the text?
class SignInViewController: UIViewController {
private let scrollView: UIScrollView = {
let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
return scrollView
}()
private let contentView: UIView = {
let view = UIView()
view.translatesAutoresizingMaskIntoConstraints = false
return view
}()
private let emailOrPhoneTextField: UITextField = {
let textField = UITextField()
textField.translatesAutoresizingMaskIntoConstraints = false
textField.placeholder = "Email or Phone Number"
textField.textAlignment = .center
textField.backgroundColor = .red
return textField
}()
private let passwordTextField: UITextField = {
let textField = UITextField()
textField.translatesAutoresizingMaskIntoConstraints = false
textField.placeholder = "Password"
textField.backgroundColor = .yellow
return textField
}()
override func viewDidLoad() {
super.viewDidLoad()
setupScrollView()
setupTextFields()
}
}
extension SignInViewController{
private func setupScrollView(){
view.addSubview(scrollView)
scrollView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
scrollView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true
scrollView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true
scrollView.addSubview(contentView)
contentView.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor).isActive = true
contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
contentView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
}
private func setupTextFields(){
contentView.addSubview(emailOrPhoneTextField)
contentView.addSubview(passwordTextField)
emailOrPhoneTextField.centerXAnchor.constraint(equalTo: contentView.centerXAnchor).isActive = true
emailOrPhoneTextField.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 25).isActive = true
emailOrPhoneTextField.widthAnchor.constraint(equalTo: contentView.widthAnchor).isActive = true
emailOrPhoneTextField.heightAnchor.constraint(equalToConstant: 44).isActive = true
passwordTextField.centerXAnchor.constraint(equalTo: contentView.centerXAnchor).isActive = true
passwordTextField.topAnchor.constraint(equalTo: emailOrPhoneTextField.bottomAnchor, constant: 25).isActive = true
passwordTextField.widthAnchor.constraint(equalTo: contentView.widthAnchor).isActive = true
passwordTextField.heightAnchor.constraint(equalToConstant: 44).isActive = true
}
}

Try this and check if it works:
extension ViewController{
private func setupScrollView(){
view.addSubview(scrollView)
scrollView.addSubview(contentView)
contentView.addSubview(emailOrPhoneTextField)
contentView.addSubview(passwordTextField)
NSLayoutConstraint.activate([
scrollView.topAnchor.constraint(equalTo: view.topAnchor),
scrollView.rightAnchor.constraint(equalTo: view.rightAnchor),
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
scrollView.leftAnchor.constraint(equalTo: view.leftAnchor)
])
NSLayoutConstraint.activate([
contentView.topAnchor.constraint(equalTo: scrollView.topAnchor),
contentView.rightAnchor.constraint(equalTo: scrollView.rightAnchor),
contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
contentView.leftAnchor.constraint(equalTo: scrollView.leftAnchor),
contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor),
contentView.heightAnchor.constraint(equalTo: scrollView.heightAnchor)
])
NSLayoutConstraint.activate([
emailOrPhoneTextField.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 50),
emailOrPhoneTextField.rightAnchor.constraint(equalTo: contentView.rightAnchor, constant: -20),
emailOrPhoneTextField.leftAnchor.constraint(equalTo: contentView.leftAnchor, constant: 20),
])
NSLayoutConstraint.activate([
passwordTextField.topAnchor.constraint(equalTo: emailOrPhoneTextField.bottomAnchor, constant: 25),
passwordTextField.rightAnchor.constraint(equalTo: contentView.rightAnchor, constant: -20),
passwordTextField.leftAnchor.constraint(equalTo: contentView.leftAnchor, constant: 20),
])
}
}

Related

Scrollview not scrolling / Trying to add view to bottom of content

So I've added a scrollview to my view controller programmatically and added some views.
func setupScrollView() {
view.addSubview(scrollView)
scrollView.addSubview(contentView)
scrollView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
scrollView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true
scrollView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true
contentView.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor).isActive = true
contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
contentView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
scrollView.contentSize = contentView.frame.size
}
func addUserAndFollowView(id: String) {
userAndFollow = UserPfAndFollow(id: id)
if let userAndFollow = userAndFollow {
userAndFollow.view.isUserInteractionEnabled = true
contentView.addSubview(userAndFollow.view)
self.contentView.bringSubviewToFront(userAndFollow.view)
userAndFollow.view.translatesAutoresizingMaskIntoConstraints = false
userAndFollow.view.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
userAndFollow.view.widthAnchor.constraint(equalTo: contentView.widthAnchor).isActive = true
userAndFollow.view.heightAnchor.constraint(equalToConstant: 100).isActive = true
}
}
func setImageViewConstraints() {
imageView.translatesAutoresizingMaskIntoConstraints = false
imageView.heightAnchor.constraint(equalToConstant: 300).isActive = true
imageView.widthAnchor.constraint(equalToConstant: 300).isActive = true
imageView.centerXAnchor.constraint(equalTo: self.contentView.centerXAnchor).isActive = true
if let userAndFollow = userAndFollow?.view {
imageView.topAnchor.constraint(equalTo: userAndFollow.bottomAnchor, constant: 5).isActive = true
}
}
func addLabelConstraints() {
self.albumTitle?.translatesAutoresizingMaskIntoConstraints = false
self.albumDescription?.translatesAutoresizingMaskIntoConstraints = false
albumTitle?.numberOfLines = 2
albumDescription?.numberOfLines = 3
albumDescription?.adjustsFontSizeToFitWidth = false
albumTitle?.topAnchor.constraint(equalTo: imageView.bottomAnchor, constant: 14).isActive = true
albumTitle?.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: 10).isActive = true
albumTitle?.trailingAnchor.constraint(equalTo: self.contentView.trailingAnchor).isActive = true
albumTitle?.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: 10).isActive = true
albumDescription?.lineBreakMode = .byTruncatingTail
albumDescription?.topAnchor.constraint(equalTo: albumTitle!.bottomAnchor, constant: 9).isActive = true
albumDescription?.leadingAnchor.constraint(equalTo: self.contentView.leadingAnchor, constant: 10).isActive = true
albumDescription?.trailingAnchor.constraint(equalTo: self.contentView.trailingAnchor).isActive = true
}
All these views show up the way I want them to with the scrollview not scrolling but when I add this next view (which is a tableview in a view controller) at the bottom of the rest of my views it doesn't show up. Possibly why the scrollview isn't scrolling.
func addViewController() {
if let viewController = viewController {
contentView.addSubview(viewController.view)
setVCConstraints()
}
}
func setVCConstraints() {
viewController?.view.translatesAutoresizingMaskIntoConstraints = false
viewController?.view.bottomAnchor.constraint(equalTo: self.contentView.bottomAnchor).isActive = true
viewController?.view.topAnchor.constraint(equalTo: albumDescription!.bottomAnchor, constant: 7).isActive = true
viewController?.view.widthAnchor.constraint(equalTo: self.contentView.widthAnchor).isActive = true
}
What can I do to make this view appear and have my scrollview scroll all the way down this view controller and it's array content and no more or less?
Before you add the view, you have
contentView.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor).isActive = true
contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
contentView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
scrollView.contentSize = contentView.frame.size
So, of course, the contentView has a size of the scrollView and thus will not scroll. It is the same size.
After you add the view, you have
viewController?.view.bottomAnchor.constraint(equalTo: self.contentView.bottomAnchor).isActive = true
viewController?.view.topAnchor.constraint(equalTo: albumDescription!.bottomAnchor, constant: 7).isActive = true
viewController?.view.widthAnchor.constraint(equalTo: self.contentView.widthAnchor).isActive = true
Note, above, that you define a top bottom and width -- there is no LEFT-TO-RIGHT indication where the viewController.view should start on the horizontal path. This can result in some VERY weird behaviors.
Yet, you STILL don't modify the contentView.contentSize to be any bigger than the scrollView size.
To make something scroll, you need the contentView.contentSize to be bigger than the frame.size.

UITextField inside UIScrollView freeze the app when click on the textfield to edit

swifters!
I am trying to add a many textfields inside a scrollview , and its working fine and the scrollview is scrolling just fine, but when I click on the any textfield to type any text he app freezing.
and I got this message on debug area XPC connection interrupted
can anyone help me!
here is my code for creating the scrollview and for the dynamic textfields
func setupScrollView() {
scrollView.translatesAutoresizingMaskIntoConstraints = false
contentView.translatesAutoresizingMaskIntoConstraints = false
container.addSubview(scrollView)
scrollView.addSubview(contentView)
scrollView.centerXAnchor.constraint(equalTo: container.centerXAnchor).isActive = true
scrollView.widthAnchor.constraint(equalTo: container.widthAnchor).isActive = true
scrollView.topAnchor.constraint(equalTo: container.topAnchor).isActive = true
scrollView.bottomAnchor.constraint(equalTo: container.bottomAnchor).isActive = true
contentView.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor).isActive = true
contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor , multiplier: 0.75).isActive = true
contentView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
}
this is how I am adding the textfields :
let questionContainer = UIView()
questionContainer.translatesAutoresizingMaskIntoConstraints = false
contentView.addSubview(questionContainer)
if latestView == nil {
questionContainer.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
}
else {
questionContainer.topAnchor.constraint(equalTo: latestView!.bottomAnchor, constant: 32).isActive = true
}
questionContainer.centerXAnchor.constraint(equalTo: contentView.centerXAnchor).isActive = true
questionContainer.widthAnchor.constraint(equalTo: contentView.widthAnchor).isActive = true
questionContainer.heightAnchor.constraint(equalToConstant: 100).isActive = true
questionContainer.backgroundColor = .red
let question = UITextField()
question.translatesAutoresizingMaskIntoConstraints = false
questionContainer.addSubview(question)
question.text = "Test Test Test"
question.topAnchor.constraint(equalTo: questionContainer.topAnchor, constant: 8).isActive = true
question.trailingAnchor.constraint(equalTo: questionContainer.trailingAnchor, constant: -8).isActive = true
question.bottomAnchor.constraint(equalTo: questionContainer.bottomAnchor, constant: -8).isActive = true
question.leadingAnchor.constraint(equalTo: questionContainer.leadingAnchor, constant: 8).isActive = true

Button is showing on screen but textField is not appearing every time. what is the error in my code?

I am setting textfied and a button programmatically. The button is showing when we run the code but not textfield. is there any problem with constraints or any other please help.
let submitButton: UIButton = {
let btn = UIButton(type:.system)
btn.backgroundColor = .blue
btn.setTitle("Login", for: .normal)
btn.tintColor = .white
btn.layer.cornerRadius = 5
btn.clipsToBounds = true
btn.translatesAutoresizingMaskIntoConstraints = false
return btn
}()
let textBox: UITextView = {
let textView = UITextView()
textView.text = "we are learning iOs"
textView.font = UIFont.boldSystemFont(ofSize: 18)
textView.textAlignment = .center
textView.translatesAutoresizingMaskIntoConstraints = false
return textView
}()
override func viewDidLoad() {
super.viewDidLoad()
view.addSubview(textBox)
setupTexBoxLayout()
view.addSubview(submitButton)
setupSubmitBUttonLayout()
}
private func setupTexBoxLayout(){
textBox.topAnchor.constraint(equalTo: view.topAnchor, constant: 100).isActive = true
textBox.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 20).isActive = true
textBox.widthAnchor.constraint(equalToConstant: 100).isActive = true
}
private func setupSubmitBUttonLayout(){
submitButton.topAnchor.constraint(equalTo: textBox.bottomAnchor, constant: 100).isActive = true
submitButton.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 100).isActive = true
}
}
I have checked your code and debug it.
You have not specified height for textview so it is not showing it.
You can check the below code. I have added height constraint to it and it is displaying your textfield.
If you do not specify a height for textfield then it will take 0 height by default.
private func setupTexBoxLayout(){
textBox.topAnchor.constraint(equalTo: view.topAnchor, constant: 100).isActive = true
textBox.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 20).isActive = true
textBox.widthAnchor.constraint(equalToConstant: 300).isActive = true
textBox.heightAnchor.constraint(equalToConstant: 40).isActive = true
}

ViewControlling full of textEdits not scrolling down with scrollview

I have a view controller with 8 to 9 textEdits where user has to fill them out to save to a database but it is taking a lot of my screen and some TE is not being shown because of the size of the iphones screen.I then decide to add a UIScrollView like this :
lazy var myScrollView : UIScrollView = {
let scrol = UIScrollView()
scrol.contentSize.height = 10000
scrol.backgroundColor = appBackgroundColor
scrol.translatesAutoresizingMaskIntoConstraints = false
return scrol
}()
...
view.addSubview(myScrollView)
myScrollView.addSubview(labelYear)
myScrollView.addSubview(labelAppTitle)
// then I added the constraints
NSLayoutConstraint.activate([
myScrollView.topAnchor.constraint(equalTo: view.topAnchor),
myScrollView.leftAnchor.constraint(equalTo: view.leftAnchor),
myScrollView.rightAnchor.constraint(equalTo: view.rightAnchor),
//enter code here
myScrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
labelAppTitle.leftAnchor.constraint(equalTo: myScrollView.leftAnchor,constant: 40),
labelAppTitle.topAnchor.constraint(equalTo: myScrollView.safeAreaLayoutGuide.topAnchor, constant: 10),
labelAppTitle.rightAnchor.constraint(equalTo:myScrollView.rightAnchor, constant: -40),
labelAppTitle.heightAnchor.constraint(equalToConstant: 90)
])
I have a lot more textEdits but I am not posting for sake of saving space.The problem is that it is not scrolling down like I wanted . How do I do this?
thank you
import UIKit
class TestController: UIViewController, UITextFieldDelegate {
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = .white
initUI()
}
func initUI() {
let scrollView = UIScrollView()
scrollView.translatesAutoresizingMaskIntoConstraints = false
scrollView.isUserInteractionEnabled = true
view.addSubview(scrollView)
let contentView = UIView()
contentView.translatesAutoresizingMaskIntoConstraints = false
contentView.isUserInteractionEnabled = true
contentView.isMultipleTouchEnabled = true
scrollView.addSubview(contentView)
let titleText = UITextField(frame: CGRect.zero)
titleText.translatesAutoresizingMaskIntoConstraints = false
titleText.borderStyle = .roundedRect
titleText.isEnabled = true
titleText.isUserInteractionEnabled = true
titleText.placeholder = "Constants.Messages.titlePlaceholder"
titleText.isUserInteractionEnabled = true
titleText.delegate = self
contentView.addSubview(titleText)
// scroll view
NSLayoutConstraint.activate([
scrollView.topAnchor.constraint(equalTo: view.topAnchor, constant: 100),
scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 8.0),
scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -8.0),
scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -8.0)
])
// content view
NSLayoutConstraint.activate([
contentView.topAnchor.constraint(equalTo: scrollView.topAnchor),
contentView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
contentView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor)
])
// title text field
NSLayoutConstraint.activate([
titleText.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 20.0),
titleText.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 8.0),
titleText.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -8.0),
titleText.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: 0)
])
}
}
This is an exmaple of using scrollView. When you create a scrollView, apple recommends to put a contentView in it and put it inside in scrollView and don't forget to use bottomAnchor. If you forgot to use that then it'll not scroll.

UIImage Aspect Fill and clipsToBounds

I want to set an image to a UIImage, but as soon as I set it it the UIImageView gets bigger and goes over other elements.
There is a solution provided here:
Crop UIImage to fit a frame image
But I can not get it to work, I set the properties like in the solution provided.
Maybe somebody can have a look and help me:
Without setting the image:
After setting the image:
class Cell: UICollectionViewCell, CollectionViewCellConfigurable {
var image = UIImageView()
var dateDay = UILabel()
var dateMonth = UILabel()
var title = UILabel()
lazy private var dateContainer: UIView = {
let v = UIView()
v.sv(dateDay, dateMonth)
dateDay.heightAnchor.constraint(equalTo: self.dateMonth.heightAnchor, multiplier: 1).isActive = true
dateDay.leadingAnchor.constraint(equalTo: v.leadingAnchor, constant: 5).isActive = true
dateDay.trailingAnchor.constraint(equalTo: v.trailingAnchor, constant: -5).isActive = true
dateDay.topAnchor.constraint(equalTo: v.topAnchor, constant: 15).isActive = true
dateDay.bottomAnchor.constraint(equalTo: dateMonth.topAnchor, constant: -5).isActive = true
dateMonth.heightAnchor.constraint(equalTo: self.dateDay.heightAnchor, multiplier: 1).isActive = true
dateMonth.leadingAnchor.constraint(equalTo: v.leadingAnchor, constant: 5).isActive = true
dateMonth.trailingAnchor.constraint(equalTo: v.trailingAnchor, constant: -5).isActive = true
dateMonth.topAnchor.constraint(equalTo: dateDay.bottomAnchor, constant: 5).isActive = true
// dateMonth.bottomAnchor.constraint(greaterThanOrEqualTo: v.bottomAnchor, constant: -5).isActive = true
return v
}()
lazy private var container: UIView = {
return UIView()
}()
func configureCellAtIndexPath(item: Journaling) {
self.image.image = UIImage.baliBeach
self.image.backgroundColor = .green
self.dateDay.text = "16"
self.dateMonth.text = "May"
self.title.text = "Text visible"
}
override init(frame: CGRect) {
super.init(frame:frame)
setUpLayout()
additionalSetUp()
}
required init(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func additionalSetUp() {
backgroundColor = .clear
let colorText: UIColor = .grau
dateDay.textColor = colorText
dateMonth.textColor = colorText
title.textColor = colorText
dateDay.textAlignment = .center
dateMonth.textAlignment = .center
title.textAlignment = .center
image.contentMode = .scaleAspectFill
image.clipsToBounds = true
image.autoresizesSubviews = true
}
func setUpLayout() {
sv(dateContainer, container)
container.sv(image,title)
dateContainer.widthAnchor.constraint(equalToConstant: 45).isActive = true
// dateContainer.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 0.15).isActive = true
dateContainer.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: 0).isActive = true
dateContainer.trailingAnchor.constraint(equalTo: container.leadingAnchor, constant: 0).isActive = true
dateContainer.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
dateContainer.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true
// container.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 0.5).isActive = true
container.leadingAnchor.constraint(equalTo: dateContainer.trailingAnchor, constant: 0).isActive = true
container.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: 0).isActive = true
container.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
container.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true
image.leadingAnchor.constraint(equalTo: container.leadingAnchor, constant: 5).isActive = true
image.trailingAnchor.constraint(equalTo: container.trailingAnchor, constant: -5).isActive = true
image.topAnchor.constraint(equalTo: self.topAnchor, constant: 15).isActive = true
image.bottomAnchor.constraint(equalTo: title.topAnchor, constant: -5).isActive = true
title.leadingAnchor.constraint(equalTo: container.leadingAnchor, constant: 0).isActive = true
title.trailingAnchor.constraint(equalTo: container.trailingAnchor, constant: 0).isActive = true
title.topAnchor.constraint(equalTo: image.bottomAnchor, constant: 5).isActive = true
title.bottomAnchor.constraint(equalTo: container.bottomAnchor, constant: 0).isActive = true
}
}
You need to higher vertical compression priority of the title label as the imageView is equal it = 750 , so it occupies the space
title.setContentCompressionResistancePriority(UILayoutPriority(rawValue: 751), for: .vertical)