So I am currently trying to add some space before my text in a text field. So when I type, it starts with four spaces instead of none. So I did some research and I came across something that seems really good (as indicated by all the votes), i.e., Create space at the beginning of a UITextField. One problem is that I do not know how to actually implement this in my other classes (assuming that's what the post is intending the reader to do).
This is what I think I'm supposed to do. I think I'm supposed to instantiate an object of that class and use the methods in the class to add spaces in front of my text field. But I don't actually know what that looks like in code. Could anyone give me an example of how to actually implement the code on this post? Create space at the beginning of a UITextField
Here is the code that I have so far:
import UIKit
class SignUpViewController: UIViewController {
#IBOutlet weak var facebookButton: UIButton!
#IBOutlet weak var googleplusButton: UIButton!
#IBOutlet weak var fullNameTextField: UITextField!
#IBOutlet weak var emailAddressTextField: UITextField!
#IBOutlet weak var passwordTextField: UITextField!
override func viewDidLoad() {
super.viewDidLoad()
facebookButton.layer.cornerRadius = 5
googleplusButton.layer.cornerRadius = 5
fullNameTextField.layer.borderColor = UIColor.lightGrayColor().CGColor
fullNameTextField.layer.borderWidth = 1.0
emailAddressTextField.layer.borderColor = UIColor.lightGrayColor().CGColor
emailAddressTextField.layer.borderWidth = 1.0
passwordTextField.layer.borderColor = UIColor.lightGrayColor().CGColor
passwordTextField.layer.borderWidth = 1.0
}
}
You need to create subclass of UITextField. Then add this code in its implementation
static CGFloat leftMargin = 10;
- (CGRect)textRectForBounds:(CGRect)bounds
{
bounds.origin.x += leftMargin;
bounds.size.width -= (leftMargin + 20);
return bounds;
}
- (CGRect)editingRectForBounds:(CGRect)bounds
{
bounds.origin.x += leftMargin;
bounds.size.width -= (leftMargin + 20);
return bounds;
}
After that, set custom class to your UITextField.
You should create a class from #ScareCrow answer. After that go to the storyboard and change the class of the UITextField. Such as:
After that create an IBOutlet of the textfield. That outlet will be instance of the TextField class.
Related
I need textfield like below image
so i am using material-components-ios framework, for that i have added textfield in storyboard and given its class name to MDCTextField and code
import UIKit
import MaterialComponents
class LoginVC: UIViewController {
#IBOutlet weak var emailTF: MDCTextField!
var textFieldControllerFloating: MDCTextInputControllerOutlined?
override func viewDidLoad() {
super.viewDidLoad()
// setupEditText()
textFieldControllerFloating = MDCTextInputControllerOutlined(textInput: emailTF)
textFieldControllerFloating?.activeColor = UIColor.lightGray
textFieldControllerFloating?.floatingPlaceholderActiveColor = UIColor.green
textFieldControllerFloating?.normalColor = UIColor.lightGray
textFieldControllerFloating?.inlinePlaceholderColor = UIColor.lightGray
}
with this code o/p coming perfect but showing warning
warning:
'MDCTextField' is deprecated: MDCTextField and its associated classes are deprecated. Please use TextControls instead.
so i have added another framework TextControls here i have added pod 'MaterialComponents/TextControls+OutlinedTextFields' and added textfield in stroyboard and given its class to MDCOutlinedTextField and added below code
import UIKit
import MaterialComponents.MaterialTextControls_OutlinedTextFields
class LoginVC: UIViewController {
#IBOutlet weak var emailTF: MDCOutlinedTextField!
#IBOutlet weak var passwordTF: MDCOutlinedTextField!
}
}
but o/p like below: no floating placeholder text and small height as well why?, where am i wrong.. how to get textfield with height 50 and floating placeholder border like above image, please do help.
EDIT: i need eye button for password textfield like this how to do with MDCOutlinedTextField?
As per example try to set label.text property like that
textField.label.text = "Phone number"
As for text field height you can set it for instance with a constraint in Interface Builder
I'm using Material Design Component i.e. MDCTextField but facing some issues while making its corners more rounded like a capsule.
I tried to set the border radius but it doesn't work for me.
Connection outlet:
#IBOutlet weak var userNameTextField: MDCTextField!
#IBOutlet weak var passwordTextField: MDCTextField!
#IBOutlet weak var mobileNumberTextField: MDCTextField!
var userNameController: MDCTextInputControllerOutlined?
var passwordController: MDCTextInputControllerOutlined?
var mobileNumberController: MDCTextInputControllerOutlined?
ViewDidLoad():
override func viewDidLoad() {
super.viewDidLoad()
userNameController = MDCTextInputControllerOutlined(textInput: userNameTextField)
passwordController = MDCTextInputControllerOutlined(textInput: passwordTextField)
mobileNumberController = MDCTextInputControllerOutlined(textInput: mobileNumberTextField)
userNameController?.borderRadius = 50
}
Scenarios:
Text field with round corner showing perfectly when there is no input or text
Text field distorted when we try to enter something
Please let me know, what I'm doing wrong.
Thanks.
Use pod 'MaterialComponents/TextFields'
This will solve the issue and make your MDCTextField rounded.
I started coding about 2 weeks ago and chose Swift for iOS development purposes and I am having quite a struggle with debugging. This project is a simple Tic Tac Toe app and everything runs fine except for when I tap on one of my UILabels for an X to appear.
I keep getting this Thread 1: EXC_BAD_ACCESS (code=2, address=0x1134ca968) error on my canTap and I don't know how to fix it.
#IBAction func onTappedGridLabel(_ sender: UITapGestureRecognizer) {
if gameOver {
return
}
var canPlay = false
for label in labels {
let selectedPoint = sender.location(in: background)
if label.frame.contains(selectedPoint) {
if label.canTap {
if(xTurn) {
label.text = "X"
}
else {
label.text = "O"
}
xTurn = !xTurn
label.canTap = false
checkForWinner()
}
}
if label.canTap {
canPlay = true
https://www.dropbox.com/s/amokuept1crt8i0/Tic%20Tac%20Toe%202.0.zip?dl=0
Here's a link with the entire project if anyone is interested. I think it's pretty short.
The problem is that a UILabel has no canTap property. Your label subclass GridLabel has that property, but you have not designated that your labels in the storyboard are instances of your label subclass, so they are just ordinary labels.
In other words, you have this code:
#IBOutlet weak var gridLabel0: GridLabel!
#IBOutlet weak var gridLabel1: GridLabel!
#IBOutlet weak var gridLabel2: GridLabel!
#IBOutlet weak var gridLabel3: GridLabel!
#IBOutlet weak var gridLabel4: GridLabel!
#IBOutlet weak var gridLabel5: GridLabel!
#IBOutlet weak var gridLabel6: GridLabel!
#IBOutlet weak var gridLabel7: GridLabel!
#IBOutlet weak var gridLabel8: GridLabel!
var labels = [GridLabel]()
But you are lying in every one of those lines. None of your labels is a GridLabel. They are all ordinary UILabels. Hence, as soon as you try to access the canTap of one of them, you crash.
In the storyboard, select the nine grid labels and, in the Identity inspector, change their class to GridLabel. Problem solved.
I'm currently having problems for my label to read the addition of 3 textfield values automatically, without a button function action. As such i only want my textfield to be an Int input only. There's a screenshot attached below for better reference. Appreciate those who can help me with this. Thanks!
ViewController
import UIKit
class TryingoutController: UIViewController {
#IBOutlet var impact: UITextField!
#IBOutlet var rigour: UITextField!
#IBOutlet var response: UITextField!
#IBOutlet var total: UILabel!
One way is to add self as the target to the text fields, for the control event .editingChanged
impact.addTarget(self, action: #selector(textChanged), for: .editingChanged)
// do the same for other textfields
Then declare a textChanged method. This should handle what happens when the texts in the text fields change. One implementation would be to add up all the values in the text fields (if any, and is valid) and display it in the label.
func textChanged() {
let impactValue = Int(impact.text!)
let rigourValue = Int(rigour.text!)
let responseValue = Int(response.text!)
total.text = String(describing:
(impactValue ?? 0) + (rigourValue ?? 0) + (responseValue ?? 0)
)
}
Optionally, you can conform to UITextFieldDelegate:
class TryingoutController: UIViewController, UITextFieldDelegate {
}
and implement shouldChange according to this answer by Thuggish Nuggets. Then, set the delegates of the text fields to self:
impact.delegate = self
// do the same for other text fields.
I am trying to visually depict the guides used in a font. This include the descender, ascender, median, baseline and capheight.
I am getting all the data using the font property of majorLabel. I have checked SO and have found something similar to mine concept from Cocoanetics (Thanks SO for this).
// Labels
#IBOutlet weak var majorLabel: UILabel!
#IBOutlet weak var minorLabel: UILabel!
// Font guide lines
#IBOutlet weak var ascender: UIView!
#IBOutlet weak var capHeight: UIView!
#IBOutlet weak var xHeight: UIView!
#IBOutlet weak var baseLine: UIView!
#IBOutlet weak var descender: UIView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
/* This part sets up the baseline of two different fonts */
majorLabel.sizeToFit()
minorLabel.sizeToFit()
var changedFrame = minorLabel.frame
changedFrame.origin.y = CGFloat(ceilf(
Float(majorLabel.frame.origin.y) + Float(majorLabel.font.ascender - minorLabel.font.ascender)
))
minorLabel.frame = changedFrame
//minorLabel.center.x = majorLabel.center.x
//print(majorLabel.center.x)
//print(minorLabel.center.x)
/* This section handles about capturing the font specific properties. */
//baseLine.frame.origin.y = changedFrame.origin.y
let baseLineLocation = majorLabel.frame.origin.y + majorLabel.font.ascender
let medianLocation = majorLabel.frame.origin.y + majorLabel.font.xHeight
let capHeightLocation = baseLineLocation - majorLabel.font.capHeight
let descenderLocation = baseLineLocation - majorLabel.font.descender
let ascenderLocation = baseLineLocation - majorLabel.font.ascender
print("Ascender: \(majorLabel.font.ascender)")
print("Cap height: \(majorLabel.font.capHeight)")
print("Median: \(majorLabel.font.xHeight)")
print("Descender: \(majorLabel.font.descender)")
baseLine.frame.origin.y = baseLineLocation
xHeight.frame.origin.y = medianLocation
capHeight.frame.origin.y = capHeightLocation
descender.frame.origin.y = descenderLocation
ascender.frame.origin.y = ascenderLocation
}
In the above code the five UIViews have fullscreen width and height of just 1 to draw a small crisp line.
I would like to get a similar result as the image below to display the line.
I am already getting proper results and would like it to be as accurate as possible. Is the code above is the proper way to render the lines?