【问题标题】:iOS label in a circleiOS标签圈成一圈
【发布时间】:2016-11-16 12:28:05
【问题描述】:

您好,我正在尝试使用 UILabel 图层绘制一个圆圈,但是,我的标签仅显示数字,而不是我为标签创建的背景颜色或边框。为什么是这样 ? 这是我的代码:

let countLabel = UILabel()
countLabel.text = "5"
let size:CGFloat = 55.0
countLabel.textColor = UIColor.white
countLabel.textAlignment = .center
countLabel.font = UIFont.systemFont(ofSize: 14.0)
countLabel.bounds = CGRect(x : 0.0,y : 0.0,width : size, height :  size)
countLabel.layer.cornerRadius = size / 2
countLabel.layer.borderWidth = 3.0
//countLabel.layer.masksToBounds = true
countLabel.layer.backgroundColor = UIColor.orange.cgColor
countLabel.layer.borderColor = UIColor.orange.cgColor

countLabel.center = CGPoint(x:200.0,y: 200.0)
countLabel.translatesAutoresizingMaskIntoConstraints = false
self.topContainer.addSubview(countLabel)
countLabel.topAnchor.constraint(equalTo: profileImage.topAnchor).isActive = true
countLabel.trailingAnchor.constraint(equalTo: profileImage.trailingAnchor, constant: 10).isActive = true        

我想要这样的东西。

但是上面没有输出橙色。为什么?

【问题讨论】:

  • 你试过将clipsToBound设置成true吗?
  • 我试过 clipstobound,我的标签根本不显示
  • 取消注释countLabel.layer.masksToBounds = true并使用countLabel.backgroundColor = .orange设置标签的backgroundColor

标签: ios swift swift3


【解决方案1】:

尝试添加以下代码:

countLabel.layer.cornerRadius = 0.5 * countLabel.bounds.size.width

代替:

// remove the below code of line from your code 
countLabel.layer.cornerRadius = size / 2

【讨论】:

  • 标签的框架是使用size 创建的。这两个代码是相同的。
  • 我尊重你的话,但幸运的是,这里的返回值会产生差异。
【解决方案2】:

我猜你在这里偶然发现了一个错误。

如果我将基于您的代码的代码库添加到 Playground 中,它会输出“空图像”而不是显示视图。

但如果我用框架创建标签,它就可以工作。

不工作:

let countLabel = UILabel()
countLabel.frame = CGRect(x : 0.0,y : 0.0,width : size, height :  size)

不工作:

let countLabel = UILabel()
countLabel.bounds = CGRect(x : 0.0,y : 0.0,width : size, height :  size)

不工作:

let countLabel = UILabel()
countLabel.sizeToFit()

工作:

let size:CGFloat = 55.0
let countLabel = UILabel(frame: CGRect(x : 0.0,y : 0.0,width : size, height :  size))

来自我的游乐场的完整代码:

import UIKit
let size:CGFloat = 55.0

let countLabel = UILabel(frame: CGRect(x : 0.0,y : 0.0,width : size, height :  size))
countLabel.text = "5"
countLabel.textColor = UIColor.white
countLabel.textAlignment = .center

countLabel.font = UIFont.systemFont(ofSize: 24.0)
countLabel.layer.cornerRadius = size / 2
countLabel.layer.borderWidth = 3.0
countLabel.layer.masksToBounds = true
countLabel.layer.backgroundColor = UIColor.orange.cgColor
countLabel.layer.borderColor = UIColor.orange.cgColor

countLabel.translatesAutoresizingMaskIntoConstraints = false

结果:

【讨论】:

  • 如何在堆栈视图中做同样的事情标签?
  • "this solution not working" 一句无用的话,因为我在代码中展示了几个不起作用的解决方案。此外,这描述了一个明显错误的解决方法——它可能不再存在或已经演变成其他东西。 @RatneshShukla:我不是你个人的错误猎人。你的反对票是不公正的。
  • @vikingosegundo 可能这个bug已经解决了,但是我尝试了你提到的所有解决方案,但都没有奏效,也许你也可以试试。
  • 当然,正如你问得这么好——不是。创建一个新问题并解释“不起作用”的含义。
【解决方案3】:

使用该代码:

let countLabel = UILabel()
countLabel.text = "5"
let size:CGFloat = 55.0
countLabel.textColor = UIColor.white
countLabel.textAlignment = .center
countLabel.font = UIFont.systemFont(ofSize: 14.0)
countLabel.frame = CGRect(x : 50.0,y : 50.0,width : size, height :  size)
countLabel.layer.cornerRadius = size / 2
countLabel.layer.borderWidth = 3.0
countLabel.layer.backgroundColor = UIColor.orange.cgColor
countLabel.layer.borderColor = UIColor.orange.cgColor


self.view.addSubview(countLabel)

我得到了这个结果:

【讨论】:

  • 在 Xcode 8.1 中,我在操场上使用此代码得到“空图像”。
  • 但没有涉及图像?!
【解决方案4】:

删除约束并将countLabel.center设置为您的容器视图中心。在 Playground 中测试:

import UIKit
import PlaygroundSupport

let container = UIView(frame: CGRect(x: 0.0, y: 0.0, width: 100.0, height: 100.0))

let countLabel = UILabel()
countLabel.text = "5"
let size:CGFloat = 55.0
countLabel.textColor = UIColor.white
countLabel.textAlignment = .center
countLabel.font = UIFont.systemFont(ofSize: 14.0)
countLabel.bounds = CGRect(x : 0.0,y : 0.0,width : size, height :  size)
countLabel.layer.cornerRadius = size / 2
countLabel.layer.borderWidth = 3.0
countLabel.layer.masksToBounds = true
countLabel.layer.backgroundColor = UIColor.orange.cgColor
countLabel.layer.borderColor = UIColor.orange.cgColor

countLabel.center = container.center
countLabel.translatesAutoresizingMaskIntoConstraints = false
container.addSubview(countLabel)
//countLabel.topAnchor.constraint(equalTo: countLabel.topAnchor).isActive = true
//countLabel.trailingAnchor.constraint(equalTo: countLabel.trailingAnchor, constant: 10).isActive = true

PlaygroundPage.current.liveView = container

【讨论】:

    【解决方案5】:

    试试这个

    countLabel.layer.masksToBounds = YES;
    countLabel.layer.cornerRadius = 17.5;//this should half of you laber layer
    countLabel.backgroundColor = [ViewController colorFromHexString:@"#f36f34"];
    countLabel.text = [NSString stringWithFormat:@"%d",CartItemCount];
    countLabel.font = [UIFont fontWithName:@"Lato-Black" size:15.0];
    countLabel.textColor = [ViewController colorFromHexString:@"#ffffff"];
    

    【讨论】:

    • sagar 它是一个Swift 标记的问题。
    • 您可以使用在线转换器进行转换。
    【解决方案6】:

    创建了一个视图并将其制成一个圆圈,然后在里面添加了标签。这是代码:

    let size:CGFloat = 36
            let someView = UIView()
            someView.translatesAutoresizingMaskIntoConstraints = false
            someView.layer.cornerRadius = size/2
            someView.backgroundColor = .orange
            someView.layer.borderColor = UIColor.white.cgColor
            someView.layer.borderWidth = 2
    
            self.topContainer.addSubview(someView)
    
            someView.topAnchor.constraint(equalTo: profileImage.topAnchor).isActive = true
            someView.trailingAnchor.constraint(equalTo: profileImage.trailingAnchor, constant: 10).isActive = true
            someView.heightAnchor.constraint(equalToConstant: size).isActive = true
            someView.widthAnchor.constraint(equalToConstant: size).isActive = true
    
            let countLabel = UILabel()
            countLabel.text = "5"
            countLabel.textColor = UIColor.white
            countLabel.textAlignment = .center
            countLabel.font = UIFont.systemFont(ofSize: 14.0)
    
            countLabel.translatesAutoresizingMaskIntoConstraints = false
            someView.addSubview(countLabel)
    
            countLabel.centerXAnchor.constraint(equalTo: someView.centerXAnchor).isActive = true
            countLabel.centerYAnchor.constraint(equalTo: someView.centerYAnchor).isActive = true
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-06-28
      • 2014-10-11
      • 1970-01-01
      相关资源
      最近更新 更多