Unable to get an image to fit inside the bounds of a UITextField - swift

I'm trying to get the image to scale down to the size of the UITextField and to position itself to the left side of it, but I am only able to get this:
What am I doing wrong?
Here is the relevant code:
//MARK: - Add Left Image to UITextField
func addLeftImageTo(txtField: UITextField, image img: UIImage) {
let leftImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 40, height: 40))
leftImageView.image = img
txtField.addSubview(leftImageView)
txtField.leftView = leftImageView
txtField.leftViewMode = .always
}
let image1 = UIImage(named: "stopwatch")
addLeftImageTo(txtField: timerTextField, image: image1!)
timerTextField.anchor(top: repsTextField.bottomAnchor, leading: view.safeAreaLayoutGuide.leadingAnchor, bottom: notesTextField.topAnchor, trailing: view.safeAreaLayoutGuide.trailingAnchor, padding: .init(top: 50.adjusted, left: 100.adjusted, bottom: 50.adjusted, right: 100.adjusted))

Try wrapping the UIImageView in a UIView
Your code:
func addLeftImageTo(txtField: UITextField, image img: UIImage) {
let leftImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 40, height: 40))
leftImageView.image = img
txtField.addSubview(leftImageView)
txtField.leftView = leftImageView
txtField.leftViewMode = .always
}
Example:
func addLeftImageTo(txtField: UITextField, image img: UIImage) {
let height = txtField.frame.size.height
let wrapView = UIView(frame: CGRect(x: 0, y: 0, width: height, height: height))
let leftImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: height, height: height))
leftImageView.image = img
leftImageView.contentMode = .scaleToFill
wrapView.addSubview(leftImageView)
txtField.addSubview(wrapView)
txtField.leftView = wrapView
txtField.leftViewMode = .always
}
Also, I added some lines including height, contentMode just in case.
I hope it will be helpful for you.

first make below method for adding image in UITextField
func setleftPaddingInTextfieldwithImage(_ textfield : UITextField, padding :
CGFloat, strImgname : String)
{
let imageView = UIImageView(image: UIImage(named: strImgname))
imageView.frame = CGRect(x: 0, y: 0, width: 15 , height: 15)
imageView.contentMode = .scaleAspectFit
let paddingView = UIView.init()
paddingView.frame = CGRect(x: padding, y: 0, width: padding, height: textfield.frame.size.height)
paddingView.addSubview(imageView)
textfield.leftView = paddingView
textfield.leftViewMode = .always
}
call it in your viewcontroller
self.setleftPaddingInTextfieldwithImage(YourTextField, padding: padding, strImgname: "stopwatch")

Related

How to change UITextField RightView size?

I trying put to 2 items in rightView component. for example;`
let label = UILabel(frame: CGRect(x: -80, y: 0, width: 100, height: 50))
let rightView = UIView(frame: CGRect(x: 100, y: 100, width: 200, height: 100))
label.text = String(self.availableBalance) + " ₺"
label.textColor = Colors.INVEST_RED
label.textAlignment = .center
let imageView = UIImageView(frame: CGRect(x: -100, y: 15, width: 20, height: 20))
imageView.image = UIImage(named: "full_balance_button")
rightView.addSubview(imageView)
rightView.addSubview(label)
let tap = UITapGestureRecognizer(target: self, action:#selector(tapGesture))
label.addGestureRecognizer(tap)
label.isUserInteractionEnabled = true
imageView.addGestureRecognizer(tap)
imageView.isUserInteractionEnabled = true
rightView.addGestureRecognizer(tap)
rightView.isUserInteractionEnabled = true
rightView.backgroundColor = .white
textField.rightView = rightView
textField.rightViewMode = .always
But I can't change size rightView.

How to add space and resize image for rightView of UITextField

I need to make this kind of text fields but I don't know how can I make spacing for rightView.
Here is a code where I'm trying to set rightView image
let imageView = UIImageView(frame: CGRect(x: -10, y: -10, width: 22, height: 22))
imageView.image = UIImage(systemName: systemName)
self.rightView = imageView
self.rightViewMode = .always
I've tried to play around CGRect coordinates and size but my rightView looks same every time
Here is how my UITextField looks now
Try using
parentView.layoutMargins = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 8)
on parent textview.
` public override func rightViewRect(forBounds bounds: CGRect) -> CGRect {
return CGRect(x: bounds.width - 30, y: 0, width: 30 , height: bounds.height)
}`

Edit- how can I get UIlabel to get in the middle of the container?

how can i get UIlabel to get in the middle of the container? and that text and view disappear equally and come to the next view.
EDIT: This code is working fine for me now
class TestViewController: UIViewController {
let container = UIView()
let redSquare = UIView()
let blueSquare = UIView()
let label = UILabel()
override func viewDidLoad() {
super.viewDidLoad()
self.label.textColor = UIColor.orange
self.label.font = label.font.withSize(25)
self.label.numberOfLines = 0
self.label.center = self.blueSquare.center
self.label.textAlignment = NSTextAlignment.center
self.label.text =
"sosdihfiosdfhsdhfdisfhsdfhdsoifhsdofhsdifhdsofhdsofhsdohdsfdosdohdfh"
self.blueSquare.addSubview(label)
self.label.frame = CGRect(x: 45, y: 120, width: 300, height: 100)
self.container.frame = CGRect(x: 7, y: 200, width: 400, height: 500)
self.view.addSubview(container)
self.redSquare.frame = CGRect(x: 0, y: 0, width: 400, height: 500)
self.blueSquare.frame = redSquare.frame
self.redSquare.backgroundColor = UIColor.darkGray
self.blueSquare.backgroundColor = UIColor.darkGray
self.container.addSubview(self.redSquare)
}
Define two labels like:
let label = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 30))
let label2 = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 30))
then inside viewDidLoad() before adding redSquare to container fix some labels's property and add label's to blue and red square:
label.center = self.redSquare.center
label.textAlignment = NSTextAlignment.center
label.text = "same text"
label2.textAlignment = NSTextAlignment.center
label2.center = self.blueSquare.center
label2.text = "same text"
self.blueSquare.addSubview(label2)
self.redSquare.addSubview(label)

How to give UIImageView attributes using if/else function?

How can I trim this function down to be as lean as possible? The only difference between the if and else blocks is the height of the UiImageView--if true, height is 300, else 150. I can't seem to figure out the best way to refactor this function without either redundant code (like in the example) or with a really long function that just seems way too long for something that seems rather simple.
I left the example crude to make the intention clear.
class ProfileViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
banner(profileHasCustomBanner: false)
}
// banner
func banner(profileHasCustomBanner: Bool) {
if profileHasCustomBanner == true {
let bannerImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: 300))
bannerImageView.image = #imageLiteral(resourceName: "the-banner")
view.contentMode = .scaleAspectFit
view.addSubview(bannerImageView)
} else {
let bannerImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: 150))
bannerImageView.image = #imageLiteral(resourceName: "the-banner")
view.contentMode = .scaleAspectFit
view.addSubview(bannerImageView)
}
}
}
Define a height variable based on the condition.
func banner(profileHasCustomBanner: Bool) {
let height: CGFloat = profileHasCustomerBanner ? 300 : 150
let bannerImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: height))
bannerImageView.image = #imageLiteral(resourceName: "the-banner")
view.contentMode = .scaleAspectFit
view.addSubview(bannerImageView)
}

Clipping borders to subviews

I'm trying to make a contour of two UIViews but by using the border property I can't seem to achieve what I want. I'm getting the image on the left, and I want the one on the right:
Here's my code:
let main = UIView()
main.frame = CGRect(x: 50, y: 50, width: 200, height: 100)
main.backgroundColor = UIColor.clear
self.view.addSubview(main)
let v1 = UIView()
v1.frame = CGRect(x: 0, y: 0, width: 200, height: 50)
v1.backgroundColor = UIColor.blue
main.addSubview(v1)
let v2 = UIView()
v2.frame = CGRect(x: 0, y: 50, width: 150, height: 50)
v2.backgroundColor = UIColor.red
main.addSubview(v2)
main.clipsToBounds = true
main.layer.borderColor = UIColor.black.cgColor
main.layer.borderWidth = 3
You need to create custom shaped border layer like so:
let main = UIView()
main.frame = CGRect(x: 50, y: 50, width: 200, height: 100)
main.backgroundColor = UIColor.clear
self.view.addSubview(main)
let v1 = UIView()
v1.frame = CGRect(x: 0, y: 0, width: 200, height: 50)
v1.backgroundColor = UIColor.blue
main.addSubview(v1)
let v2 = UIView()
v2.frame = CGRect(x: 0, y: 50, width: 150, height: 50)
v2.backgroundColor = UIColor.red
main.addSubview(v2)
// Custom Shape Layer
let maskLayer = CAShapeLayer()
maskLayer.frame = main.bounds
// Custom CGPath
let resultPath = CGMutablePath()
resultPath.addPath(CGPath(rect: v1.frame, transform: nil))
resultPath.addPath(CGPath(rect: v2.frame, transform: nil))
maskLayer.path = resultPath
// Add border
let borderLayer = CAShapeLayer()
borderLayer.path = maskLayer.path
borderLayer.strokeColor = UIColor.black.cgColor
borderLayer.lineWidth = 5
borderLayer.frame = main.bounds
borderLayer.zPosition = -1
main.layer.addSublayer(borderLayer)