[英]Swift & UILabel : How to add padding and margin in Swift programmatically?
I have created a text programmatically with a grey background using UILabel.我使用 UILabel 以编程方式创建了一个灰色背景的文本。 Now I would like to add
padding
to this paragraph/text.现在我想在这个段落/文本中添加
padding
。 Also, it would be great if you could show me how to add margin
to my UILabel
as well.另外,如果你能告诉我如何为我的
UILabel
添加margin
,那就太好了。
import UIKit
final class SignUpViewController: UIViewController {
public let identifier = "Sign Up"
private let logoImage : UIImageView = {
let imageView = UIImageView()
imageView.layer.masksToBounds = true
imageView.contentMode = .scaleAspectFit
imageView.image = UIImage(named: "MyLogoWithTitle")
imageView.clipsToBounds = true
return imageView
}()
private let instructionText : UILabel = {
let label = UILabel()
label.text = "Please read terms and conditions below carefully before proceeding with the registration."
label.backgroundColor = UIColor().colorFromHex(hex: "#2C333C", opacity: 0.4)
label.numberOfLines = 0
label.tintColor = .white
return label
}()
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
view.addSubview(logoImage)
view.addSubview(instructionText)
view.backgroundColor = UIColor().colorFromHex(hex: "#141920", opacity: 1.0)
}
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
logoImage.frame = CGRect(x: 0,
y: 0,
width: 140,
height: 60)
logoImage.center = CGPoint(x: view.center.x, y: view.height/5)
instructionText.frame = CGRect(
x: 5,
y: 5 + logoImage.bottom,
width: view.width - 20,
height: 50)
.integral
instructionText.layer.cornerRadius = 10
}
}
Notice that I created an extension to UIColor so that I can input hex color in this way - UIColor().colorFromHex(hex: "#2C333C", opacity: 0.4)
.请注意,我创建了 UIColor 的扩展,以便我可以通过这种方式输入十六进制颜色 -
UIColor().colorFromHex(hex: "#2C333C", opacity: 0.4)
。
I am looking forward to hearing from you.我期待着您的回音。 Thank you.
谢谢你。
You can insert this UILabel into the container (any UIView) and set its position inside.您可以将此 UILabel 插入容器(任何 UIView)并将其 position 设置在里面。
But the simplest trick is to use UIButton instead of UILabel.但最简单的技巧是使用 UIButton 而不是 UILabel。 You can configure UIEdgeInsets for padding.
您可以配置 UIEdgeInsets 进行填充。
So that UIButton does not act as a button simply set button.isUserInteractionEnabled = false.这样 UIButton 就不会充当按钮,只需设置 button.isUserInteractionEnabled = false。
By default, text in the button are placed in the center, but its position is easy to change with contentHorizontalAlignment and contentVerticalAlignment默认情况下,按钮中的文本放置在中心,但它的 position 很容易用 contentHorizontalAlignment 和 contentVerticalAlignment 更改
And as a bonus, you can add icons right near to the text.作为奖励,您可以在文本附近添加图标。 :)
:)
UPD. UPD。
Could you give me a simple example?
你能给我一个简单的例子吗? I tried that way but I didn't get the result I expected.
我尝试过这种方式,但没有得到我预期的结果。 – Punreach Rany
– Punreach Rany
let buttonUsedAsLabel = UIButton()
// Your question was about padding
// It's it!
buttonUsedAsLabel.titleEdgeInsets = UIEdgeInsets(top: 5, left: 20, bottom: 5, right: 20)
// Make it not user interactable as UILabel is
buttonUsedAsLabel.isUserInteractionEnabled = false
// set any other properties
buttonUsedAsLabel.setTitleColor(.white, for: .normal)
buttonUsedAsLabel.contentVerticalAlignment = .top
buttonUsedAsLabel.contentHorizontalAlignment = .left
// Set title propeties AFTER it was created with text because it's nullable
// You can use attributed title also
// Never use any (button.titleLabel) before its creation
// for example: (button.titleLabel?.text = "zzz") do nothing here
buttonUsedAsLabel.setTitle("This is the text", for: .normal)
buttonUsedAsLabel.titleLabel?.font = .systemFont(ofSize: 20, weight: .medium)
buttonUsedAsLabel.titleLabel?.numberOfLines = 0
buttonUsedAsLabel.titleLabel?.lineBreakMode = .byWordWrapping
// and so on
// ...
// This is the triсk :)
Of course, you can do it with a storyboard if prefer.当然,如果愿意,您可以使用 storyboard 来完成。
1. Add this class 1.添加这个class
PaddingLabel.swift PaddingLabel.swift
import UIKit
class PaddingLabel: UILabel {
var edgeInset: UIEdgeInsets = .zero
override func drawText(in rect: CGRect) {
let insets = UIEdgeInsets.init(top: edgeInset.top, left: edgeInset.left, bottom: edgeInset.bottom, right: edgeInset.right)
super.drawText(in: rect.inset(by: insets))
}
override var intrinsicContentSize: CGSize {
let size = super.intrinsicContentSize
return CGSize(width: size.width + edgeInset.left + edgeInset.right, height: size.height + edgeInset.top + edgeInset.bottom)
}
}
2. Add this code to your ViewController
2. 将此代码添加到您的
ViewController
let label = PaddingLabel()
override func viewDidLoad() {
super.viewDidLoad()
label.backgroundColor = UIColor().colorFromHex(hex: "#2C333C", opacity: 0.4)
//Setting the padding label
label.edgeInset = UIEdgeInsets(top: 5, left: 10, bottom: 5, right: 10)
}
The answer to the link below is that I wrote the same content based on the storyboard.下面链接的答案是我根据storyboard写了同样的内容。
I use textfield
.我使用
textfield
。 Set padding and text in textfield.在文本字段中设置填充和文本。 And do not allow editing.
并且不允许编辑。
extension UITextField {
func addLeftPadding() {
let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: 12, height: self.frame.height))
self.leftView = paddingView
self.leftViewMode = ViewMode.always
}
}
//ViewController
@IBOutlet weak var myTextField: UITextField!
override func viewDidLoad() {
super.viewDidLoad()
myTextField.addLeftPadding()
myTextField.isUserInteractionEnabled = false
myTextField.text = "your label text"
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.