【问题标题】:iOS - Shadow spread on UILabeliOS - UILabel 上的阴影蔓延
【发布时间】:2016-05-09 03:26:02
【问题描述】:

我想在我的 UILabel 中增加阴影的传播,但我找不到这样做的属性。我在下面添加了一张照片来说明问题。

顶部标签是我能够在 Photoshop 中创建的所需效果。底部标签说明了我能够在 iOS 中找到的属性。这是我用于底部标签的代码。

let bottomLabel = UILabel(frame: CGRectMake(0, 0, maxWidth, 18))
bottomLabel.backgroundColor = UIColor.clearColor()
bottomLabel.textColor = UIColor.whiteColor()
bottomLabel.font = UIFont.boldSystemFontOfSize(16)
bottomLabel.text = title
bottomLabel.textAlignment = .Center
bottomLabel.numberOfLines = 1
bottomLabel.layer.shadowOffset = CGSize(width: 0, height: 0)
bottomLabel.layer.shadowOpacity = 1
bottomLabel.layer.shadowRadius = 2

我确实找到了使用第二个标签作为阴影的建议,但这并没有给出预期的结果。这是该标签的代码。

let bottomLabelShadow = UILabel(frame: CGRectMake(0, 1, maxWidth, 18)) 
bottomLabelShadow.backgroundColor = UIColor.clearColor()
bottomLabelShadow.textColor = UIColor.blackColor()
bottomLabelShadow.font = UIFont.boldSystemFontOfSize(16)
bottomLabelShadow.text = title
bottomLabelShadow.textAlignment = .Center
bottomLabelShadow.numberOfLines = 1
bottomLabelShadow.layer.shadowOffset = CGSize(width: 0, height: 0)
bottomLabelShadow.layer.shadowOpacity = 1
bottomLabelShadow.layer.shadowRadius = 2

【问题讨论】:

  • 其实有一篇关于阴影的好文章makeapppie.com/2015/05/19/…
  • 嗨蒂姆,你得到解决方案了吗,我正在寻找相同的解决方案

标签: ios swift uilabel shadow


【解决方案1】:

在操场上似乎对我有用。您只需要增加阴影半径以使其显示为您想要的。

这是我使用的确切 Playground 代码

let view = UIView(frame: CGRectMake(0,0,100,20))
view.backgroundColor = UIColor.yellowColor()

let bottomLabel = UILabel(frame: CGRectMake(0, 0, 100, 20))
bottomLabel.backgroundColor = UIColor.clearColor()
bottomLabel.textColor = UIColor.whiteColor()
bottomLabel.font = UIFont.boldSystemFontOfSize(18)
bottomLabel.text = "Testing"
bottomLabel.textAlignment = .Center
bottomLabel.numberOfLines = 1
bottomLabel.layer.shadowOffset = CGSize(width: 0, height: 0)
bottomLabel.layer.shadowOpacity = 1
bottomLabel.layer.shadowRadius = 6

view.addSubview(bottomLabel)

或者,如果您在模糊视图背景上使用它,您可以使用活力来获得更好的外观效果。

【讨论】:

  • darnit,你打败了我。哈哈。好久没用 Playground,想弄清楚怎么用……
  • 感谢您的快速响应!我调查了它,但它不是我正在寻找的结果。我更新了图片以更好地匹配您的 Playground 示例。
【解决方案2】:

Rikola 作为 Swift 3 的回答:

import UIKit

let view = UIView(frame: CGRect.init(x: 0, y: 0, width: 100, height: 20))
view.backgroundColor = UIColor.yellow

let bottomLabel = UILabel(frame: CGRect.init(x: 0, y: 0, width: 100, height: 20))
bottomLabel.backgroundColor = UIColor.clear
bottomLabel.textColor = UIColor.white
bottomLabel.font = UIFont.boldSystemFont(ofSize: 18)
bottomLabel.text = "Testing"
bottomLabel.textAlignment = .center
bottomLabel.numberOfLines = 1
bottomLabel.layer.shadowOffset = CGSize(width: 0, height: 0)
bottomLabel.layer.shadowOpacity = 1
bottomLabel.layer.shadowRadius = 6

view.addSubview(bottomLabel)

将鼠标悬停在右侧栏中的 view.addSubview(bottomLabel) 打印上时按下小“眼睛”,可以直观地显示标签。

【讨论】:

    【解决方案3】:
    //Try This! Hope this helps!!
    
    // Create a string
    let myString = "Shadow"
    
    // Create a shadow
    let myShadow = NSShadow()
    myShadow.shadowBlurRadius = 3
    myShadow.shadowOffset = CGSize(width: 3, height: 3)
    myShadow.shadowColor = UIColor.gray
    
    // Create an attribute from the shadow
    let myAttribute = [ NSShadowAttributeName: myShadow ]
    
    // Add the attribute to the string
    let myAttrString = NSAttributedString(string: myString, attributes: myAttribute)
    
    // set the attributed text on a label
    myLabel.attributedText = myAttrString
    

    作为扩展:

    extension UILabel {
    
        func setTextWithShadow(_ string: String) {
    
            let shadow = NSShadow()
            shadow.shadowBlurRadius = 3
            shadow.shadowOffset = CGSize(width: 3, height: 3)
            shadow.shadowColor = UIColor.black.withAlphaComponent(0.5)
    
            let attributes = [ NSAttributedString.Key.shadow: shadow ]
            let attributedString = NSAttributedString(string: string, attributes: attributes)
    
            self.attributedText = attributedString
        }
    
    }
    

    【讨论】:

    • 你评论了我的生日! :D
    猜你喜欢
    • 2021-10-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多