[英]Quality of scaled-down UILabels
I'm using Swift 3 to create an iOS interface where some UIView
s containing (amongst other things) UILabel
s are scaled up and down based on where they're being positioned on the screen. 我正在使用Swift 3创建一个iOS界面,其中包含
UILabel
的一些UIView
根据它们在屏幕上的位置进行缩放。 My first approach was to create and populate the views at a comfortably large size (say 100x100) and then scale them as needed using CGAffineTransform(scaleX:y:)
, however I've noticed that the downscaling of the text in the labels isn't graceful at all, and the text becomes pixelated and close to unreadable at small scales. 我的第一种方法是以合适的大尺寸(例如100x100)创建并填充视图,然后使用
CGAffineTransform(scaleX:y:)
按需缩放它们,但是我注意到标签中文本的缩小是“ t完全优美,并且文本变得像素化并且在小范围内几乎无法读取。 As a comparison (see example below), changing the font size directly gives much better results, however the structure within my views is somewhat complex and having to redraw everything based on some size factor would be a hassle. 作为比较(请参见下面的示例),直接更改字体大小会带来更好的结果,但是在我的视图中,结构有些复杂,必须根据某些大小因素重新绘制所有内容会很麻烦。 Is there a better and smoother way to approach this problem?
有没有更好,更流畅的方法来解决此问题?
Here's an example project I've created to illustrate the problem, as well as the output in the simulator (same as on the iPhone itself), downscaled views are on the left (red) and changed font sizes are the right (green). 这是我创建的一个示例项目,用于说明问题,以及模拟器中的输出(与iPhone本身相同),缩小的视图在左侧(红色)和更改的字体大小在右侧(绿色)。
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
for i in 1...10 {
let f = CGFloat(1.0) / CGFloat(i)
let view1 = UIView(frame: CGRect(x: 0, y: 0, width: 150, height: 50))
view1.backgroundColor = UIColor.red
let label1 = UILabel(frame: CGRect(x: 0, y: 0, width: 150, height: 50))
label1.text = "\(100 / i)%"
label1.font = UIFont(name: "Verdana", size: 24.0)
label1.textAlignment = .right
view1.addSubview(label1)
view1.transform = CGAffineTransform(scaleX: f, y: f)
view1.center = CGPoint(x: 160 - 75.0 * f, y: CGFloat(60 * i) + 25.0 * f)
self.view.addSubview(view1)
let view2 = UIView(frame: CGRect(x: CGFloat(170), y: CGFloat(60 * i), width: 150 * f, height: 50 * f))
view2.backgroundColor = UIColor.green
let label2 = UILabel(frame: CGRect(x: 0, y: 0, width: 150 * f, height: 50 * f))
label2.text = "\(100 / i)%"
label2.font = UIFont(name: "Verdana", size: 24.0 * f)
view2.addSubview(label2)
self.view.addSubview(view2)
}
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
This might be an answer - but not really suitable for a comment, so... 这可能是一个答案-但并不真正适合发表评论,所以...
Give this a try - it creates a 3rd "column" of yellow-background views, using .adjustsFontSizeToFitWidth
. 尝试一下-使用
.adjustsFontSizeToFitWidth
创建一个黄色背景视图的第三个“列”。 The font size will auto-adjust based on the size of the views that contain the labels. 字体大小将根据包含标签的视图的大小自动调整。
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
for i in 1...10 {
let f = CGFloat(1.0) / CGFloat(i)
let view1 = UIView(frame: CGRect(x: 0, y: 0, width: 150, height: 50))
view1.backgroundColor = UIColor.red
let label1 = UILabel(frame: CGRect(x: 0, y: 0, width: 150, height: 50))
label1.text = "\(100 / i)%"
label1.font = UIFont(name: "Verdana", size: 24.0)
label1.textAlignment = .right
view1.addSubview(label1)
view1.transform = CGAffineTransform(scaleX: f, y: f)
view1.center = CGPoint(x: 160 - 75.0 * f, y: CGFloat(60 * i) + 25.0 * f)
self.view.addSubview(view1)
let view2 = UIView(frame: CGRect(x: CGFloat(170), y: CGFloat(60 * i), width: 150 * f, height: 50 * f))
view2.backgroundColor = UIColor.green
let label2 = UILabel(frame: CGRect(x: 0, y: 0, width: 150 * f, height: 50 * f))
label2.text = "\(100 / i)%"
label2.font = UIFont(name: "Verdana", size: 24.0 * f)
view2.addSubview(label2)
self.view.addSubview(view2)
let view3 = UIView(frame: CGRect(x: CGFloat(270), y: CGFloat(60 * i), width: 150 * f, height: 50 * f))
view3.backgroundColor = UIColor.yellow
let label3 = UILabel(frame: view3.bounds)
label3.text = "\(100 / i)%"
label3.font = UIFont(name: "Verdana", size: 24.0)
label3.adjustsFontSizeToFitWidth = true
label3.minimumScaleFactor = 0.05
label3.numberOfLines = 0
// we want the label to resize with the view, if the view frame changes
label3.autoresizingMask = [.flexibleWidth, .flexibleHeight]
view3.autoresizesSubviews = true
view3.addSubview(label3)
self.view.addSubview(view3)
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.