IOS - shadow propagation on UILabel

I want to increase the shadow distribution in my UILabel, but I cannot find a property for this. I have added a photo below to illustrate this problem.

An example of the desired shadow of the label and the current one.

The top shortcut is the desired effect that I can create in Photoshop. The bottom label illustrates the properties that I could find in iOS. Here is the code I used for the bottom label.

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 

I found a suggestion to use the second mark as a shadow, but this did not give the desired result. Here is the code for this tag.

 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 
+12
ios uilabel swift shadow
source share
3 answers

It seems to work for me in the playground. You just need to increase the radius of the shadow so that it looks the way you want it.

This is the exact code that I used

 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) 

Or, if you use it against a blur background, you can use vibration to achieve a better effect.

enter image description here

+22
source share
 //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 

As an extension:

 extension UILabel { func setTextWithShadow(_ string: String) { let shadow = NSShadow() shadow.shadowBlurRadius = 5 shadow.shadowOffset = CGSize(width: 0, height: 0) shadow.shadowColor = UIColor.black.withAlphaComponent(0.3) let attributes = [ NSAttributedString.Key.shadow: shadow ] let attributedString = NSAttributedString(string: string, attributes: attributes) self.attributedText = attributedString } } 
+7
source share

Ricola will respond as 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) 

Click the small “eye” when you hover over the print view.addSubview(bottomLabel) in the right pane to visually represent the label.

+1
source share

All Articles