Unable to change UI of MDCTextField i - ios

I am trying to use the MDCTextField with MDCTextInputControllerOutlined of MaterialComponents in my swift project but I facing a major challenge with design adjustments in it. It's not allowing me to change even the height of the textfield as well to centre the text input part. Not even the fonts of placeholder is changing.
Tried following all possible options provided in sdk.
tptf.placeholder = "Name"
tptf.placeholderLabel.textColor = UIColor.green
tptf.placeholderLabel.font = UIFont(name: "TimesNewRoman", size: 14)
tptf.textColor = UIColor.green
tptf.font = UIFont(name: "TimesNewRoman", size: 14)
tptf.clearButtonMode = .unlessEditing
tptf.delegate = self
self.textController = MDCTextInputControllerOutlined(textInput: tptf)
self.textController.textInsets(UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10))
self.textController.activeColor = UIColor.green
self.textController.floatingPlaceholderActiveColor = UIColor.green
PFA image

Related

Display textView label and make it clickable with dynamic URL

I have a textView which should always have the same text : "Link öffnen". This is what I got so far:
let linkLabel: UITextView = {
let v = UITextView()
v.backgroundColor = .clear
v.textAlignment = .left
v.isSelectable = false
v.isScrollEnabled = false
let padding = v.textContainer.lineFragmentPadding
v.textContainerInset = UIEdgeInsets(top: 0, left: -padding, bottom: 0, right: -padding)
v.attributedText = NSAttributedString(string: "Link öffnen", attributes:
[.underlineStyle: NSUnderlineStyle.single.rawValue,
NSAttributedString.Key.font: UIFont(name: "AvenirNext-Medium", size: 15)!,
NSAttributedString.Key.foregroundColor: UIColor.darkCustom])
v.translatesAutoresizingMaskIntoConstraints = false
return v
}()
It displays the textView exactly how I want it to. What is missing now is the clickable function. This textView is inside a tableViewCell and it should be clickable and each should open a certain url which is saved inside the cell. I know I can use SFSafariViewController for example for that. The problem is to make the textView clickable. What is the easiest/best practice way to do this here?
When you are using NSAttributedString then you can use link attribute. Also in Interface Builder you need to turn on selectable property on your TextView.
For a really clean way to solve this try out ActiveLabel Great for links hashtags and mentions within your textView. Also very easy to customise.

See nothing after adding label to scrollview

I am trying to add label to scrollview in swift but it doesn't works for me, here my code:
let messageLbl: UILabel = UILabel()
messageLbl.frame = CGRect(x: 0, y: 0, width: self.resultsScrollView.frame.size.width-60, height: CGFloat.greatestFiniteMagnitude)
messageLbl.backgroundColor = UIColor.groupTableViewBackground
messageLbl.lineBreakMode = NSLineBreakMode.byWordWrapping
messageLbl.textAlignment = NSTextAlignment.left
messageLbl.numberOfLines = 0
messageLbl.font = UIFont(name: "Helvetica Neuse", size: 17)
messageLbl.textColor = UIColor.black
messageLbl.text = "myTextGoesHere"
messageLbl.sizeToFit()
messageLbl.layer.zPosition = 20
messageLbl.frame.origin.x = (self.resultsScrollView.frame.size.width - self.messageX) - messageLbl.frame.size.width
messageLbl.frame.origin.y = self.messageY
self.resultsScrollView.addSubview(messageLbl)
But I see nothing when I run my app:
If you "see nothing when [you] run [your] app" that doesn't mean it doesn't exist in the hierarchy of your views. Debug your code by printing messageLbl.frame.origin.x and check if you get a value bigger than the width of your screen.
Adjusting the code in this line will do the trick:
messageLbl.frame.origin.x = (self.resultsScrollView.frame.size.width - self.messageX) - messageLbl.frame.size.width

Resizing a background image on UIButton

I am trying to add a "calendar day" image to surround some text on a clickable UI button like so:
let button = UIButton()
let X_Offset : CGFloat = (95 * CGFloat(buttonCount) ) + 10
let scrollHeight = scrollView.bounds.height
button.frame = CGRect(x: X_Offset, y: scrollHeight/6, width: 70, height: 60)
let buttonText = event.startTime.toShortDayOfWeekString() + "\n" + event.startTime.toShortDayOfMonthString()
button.titleLabel!.lineBreakMode = .byWordWrapping
button.titleLabel!.textAlignment = .center
button.setTitle(buttonText, for: .normal)
button.tag = i
button.backgroundColor = CompanyColor.Red.color
let image = UIImage(named: "calendarDay")
button.setBackgroundImage(image, for: .normal)
button.titleLabel?.font = UIFont(name: "Roboto", size: 14)
button.layer.cornerRadius = 8
button.clipsToBounds = true
But the image is encroaching on the text a bit too much:
How can I get the background image to scale up slightly and leave enough gap for the text?
I think what you what you are looking for is setting imageEdgeInsets for UIButton. Setting of these properties lets you move image around besides its default position. You have to play around to get your desired result.
There are two ways you can do this. One is using Interface Builder and other one is programmatically. Interface builder is easiest way to go I guess. Below image shows how can you set those properties for UIButton.
or try using programmatically like this
button.imageEdgeInsets = UIEdgeInsets(top: -10, left: 32, bottom: -10, right: 50)
You can move title like this
button.titleEdgeInsets = UIEdgeInsets(top: 0, left:0, bottom: 0, right: 20)
Note: Setting UIEdgeInsets like this might have different result if you have dynamic size button e.g. for different screen size. Always make sure that it looks as expected for all screen sizes.

How to resize an image inside an UIButton programmatically?

I have this UIButton and an image to fit in.
I don't want that the image take all the space inside the button but just a little part of it right in the center, but if I resize the button it will resize the image too.
How can I do that, is there an option to set whatever dimension I want independently from the size of the UIButton?
Thanks!
This can be done through code in the following way:
let imageSize:CGSize = CGSize(width: 20, height: 20)
let button:UIButton = UIButton(type: UIButton.ButtonType.custom)
button.frame = CGRect(x: 200, y: 200, width: 60, height: 60)
button.backgroundColor = UIColor.yellow
button.setImage(UIImage(named: "chat.png"), for: UIControl.State.normal)
// The below line will give you what you want
button.imageEdgeInsets = UIEdgeInsets(
top: (button.frame.size.height - imageSize.height) / 2,
left: (button.frame.size.width - imageSize.width) / 2,
bottom: (button.frame.size.height - imageSize.height) / 2,
right: (button.frame.size.width - imageSize.width) / 2)
self.view.addSubview(button)
This way, you can achieve what you wanted.
I couldn't get the button's imageView to resize until I used contentHorizontalAlignment and contentVerticalAlignment both set to .fill. Then using imageEdgeInsets I repositioned the image.
let button = UIButton()
let image = UIImage(systemName: "bag.badge.plus")
button.setImage(image, for: .normal)
button.contentHorizontalAlignment = .fill
button.contentVerticalAlignment = .fill
button.imageEdgeInsets = UIEdgeInsets(top: 6, left: 6, bottom: 10, right: 10)
Result:
You can experiment with image view insets. Every UIButton has a property imageView.
In Swift 3 you can do this like so:
//let button = UIButton()
button.imageView?.backgroundColor = UIColor.red
button.imageEdgeInsets = UIEdgeInsetsMake(10, 10, 10, 10)
red background is just so you know what is changing
I would do it this way:
A UIButton is just a UIView. You can simply add a UIImageView with a set image and call addSubview on the UIButton.
Taking into account what KVISH said before i have implemented this and it worked as expected. I posted this because Houman asked for an example.
//grab the image using the name of the pic
var image = UIImage(named: "picture")
//set the size for the image
image = image?.resize(toWidth: 18)
image = image?.resize(toHeight: 18)
//set the image to the button
buttonName.setImage(image, for: UIControlState.normal)
//adjust the position
buttonName.imageEdgeInsets = UIEdgeInsetsMake(8,16,9,0)
As of iOS 13, when using SF Symbols, I prefer this:
let button = UIButton()
let font = UIFont.systemFont(ofSize: 30) // <- make it larger, smaller, whatever you want.
let config = UIImage.SymbolConfiguration(font: font)
let image = UIImage(systemName: "bag.badge.plus", withConfiguration: config)
button.setImage(image, for: .normal)
These can be achieved by adding imageEdgeInsets to a UIButton.
In swift4.2
button.imageEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)

Trouble setting Navigation Bar Font and Size

I know this is very simple but I have looked everywhere and cannot find the answer to this. What I have found tells me to write this code, or similar code. And I have tried everything. I am using a Navigation Controller and I want to change the font and size of the text. I have not been able to change the font or size of text at all. Any help is very much appreciated!
self.navigationController?.navigationBar.titleTextAttributes = [ NSFontAttributeName: UIFont(name: "Apple SD Gothic NEO", size: 20)!]
self.navigationController?.navigationBar.barTintColor = UIColor.whiteColor()
A possible solution is replace the title label with a new one.
Example:
let titleLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 20, height: 50))
titleLabel.text = "Title"
titleLabel.font = UIFont.boldSystemFontOfSize(17)
self.navigationItem.titleView = titleLabel

Resources