Deleting Specific sublayer from UIView - swift

I am trying to remove a specific sub layer from a UIButton view
I tried self.view.layer.sublayer.removeall() but it crashes the application
func setViewState(viewState: StartButton.ViewState) {
switch (viewState) {
case .disabled:
self.backgroundColor = UIColor.clear
self.layer.borderColor = StartButton.disabledButtonColor?.cgColor
self.setTitleColor(StartButton.disabledButtonColor, for: .normal)
self.isEnabled = false
case .enabled:
self.layer.borderWidth = 0
self.setTitleColor(.black, for: .normal)
let buttonGradient = CAGradientLayer()
buttonGradient.frame = CGRect(x: 0, y: 0, width: 311, height: 80)
buttonGradient.colors = [
UIColor.white.cgColor,
UIColor(red:0.94, green:0.94, blue:0.96, alpha:1).cgColor
]
buttonGradient.locations = [0, 1]
buttonGradient.startPoint = CGPoint(x: 0.5, y: 0)
buttonGradient.endPoint = CGPoint(x: 0.5, y: 1)
self.layer.insertSublayer(buttonGradient, at: 0)
self.layer.shadowOffset = CGSize(width: 0, height: 12)
self.layer.shadowColor = UIColor(red:0, green:0, blue:0, alpha:0.15).cgColor
self.layer.shadowOpacity = 1
self.layer.shadowRadius = 34
self.layer.masksToBounds = true
self.isEnabled = true
}
}
I want the gradient layer to be removed when the disabled case is activated

You can set name of the gradient layer while creating and use to filter and remove from the parent layer as below,
let buttonGradient = CAGradientLayer()
buttonGradient.name = "Gradient"
// Removing
self.layer.sublayers?.first(where: { $0.name == "Gradient"})?.removeFromSuperlayer()

Related

How to put a gradient in a background button witch contains a system image?

I have a button with a system image:
#IBOutlet weak var ampouleButton: UIButton!
in the viewdid load, i put this:
let ampouleButtonConfig = UIImage.SymbolConfiguration(
pointSize: 30,
weight: .regular,
scale: .large)
let ampouleButtonImage = UIImage(
systemName: "lightbulb",
withConfiguration: ampouleButtonConfig)
ampouleButton.backgroundColor = Theme.gold03 // i need to put here a gradient
ampouleButton.setImage(ampouleButtonImage, for: .normal)
ampouleButton.tintColor = Theme.blanc
ampouleButton.layer.cornerRadius = ampouleButton.frame.height / 2
ampouleButton.layer.shadowOpacity = 0.4
ampouleButton.layer.shadowRadius = 3
ampouleButton.layer.shadowOffset =
CGSize(width: 0, height: 5)
ampouleButton.alpha = 1
instead of the background color, i need to put a gradient.
i tested this but it didn't work:
let gradientLayer = CAGradientLayer()
gradientLayer.frame = self.ampouleButton.bounds
gradientLayer.colors = [UIColor.yellow.cgColor, UIColor.white.cgColor]
ampouleButton.layer.insertSublayer(gradientLayer, at: 0)
Actually, the button image goes behind the layer. Try this:
extension UIButton {
func applyGradient(colors: [CGColor], radius: CGFloat = 0, startGradient: CGPoint = .init(x: 0.5, y: 0), endGradient: CGPoint = .init(x: 0.5, y: 1)) {
// check first if there is already a gradient layer to avoid adding more than one
let gradientLayer = CAGradientLayer()
gradientLayer.cornerRadius = radius
gradientLayer.colors = colors
gradientLayer.startPoint = startGradient
gradientLayer.endPoint = endGradient
gradientLayer.frame = bounds
layer.insertSublayer(gradientLayer, at: 0)
}
}
And in the viewDidLoad put:
ampouleButton.applyGradient(colors: [Theme.bleu!.cgColor, Theme.softBlue!.cgColor], radius: self.ampouleButton.frame.height / 2, startGradient: CGPoint(x: 0, y: 0.5), endGradient: CGPoint(x: 1, y: 0))
if let imgView = ampouleButton.imageView { ampouleButton.bringSubviewToFront(imgView) }
Find applyGradient function from here : https://stackoverflow.com/a/62093932/2303865

EmitterCells not showing in CAEmitterLayer

I can't seem to get the CAEmitterLayer display CAEmitterCells. I add the ConfettiEmitterView in Storyboard and the view is being displayed with a red background as intended. But the cells are not showing. No Errors or warinings either.
The code:
import UIKit
class ConfettiEmitterView: UIView {
override class var layerClass:AnyClass {
return CAEmitterLayer.self
}
func makeEmmiterCell(color:UIColor, velocity:CGFloat, scale:CGFloat)-> CAEmitterCell {
let cell = CAEmitterCell()
cell.birthRate = 10
cell.lifetime = 20.0
cell.lifetimeRange = 0
cell.velocity = velocity
cell.velocityRange = velocity / 4
cell.emissionLongitude = .pi
cell.emissionRange = .pi / 8
cell.scale = scale
cell.scaleRange = scale / 3
cell.contents = roundImage(with: .yellow)
return cell
}
override func layoutSubviews() {
let emitter = self.layer as! CAEmitterLayer
emitter.frame = self.bounds
emitter.masksToBounds = true
emitter.emitterShape = .line
emitter.emitterPosition = CGPoint(x: bounds.midX, y: 0)
emitter.emitterSize = CGSize(width: bounds.size.width, height: 1)
emitter.backgroundColor = UIColor.red.cgColor // Setting the background to red
let near = makeEmmiterCell(color: UIColor(white: 1, alpha: 1), velocity: 100, scale: 0.3)
let middle = makeEmmiterCell(color: UIColor(white: 1, alpha: 0.66), velocity: 80, scale: 0.2)
let far = makeEmmiterCell(color: UIColor(white: 1, alpha: 0.33), velocity: 60, scale: 0.1)
emitter.emitterCells = [near, middle, far]
}
func roundImage(with color: UIColor) -> UIImage {
let rect = CGRect(origin: .zero, size: CGSize(width: 12.0, height: 12.0))
return UIGraphicsImageRenderer(size: rect.size).image { context in
context.cgContext.setFillColor(color.cgColor)
context.cgContext.addPath(UIBezierPath(ovalIn: rect).cgPath)
context.cgContext.fillPath()
}
}
}
Adding a view of type ConfettiEmitterView to the UIViewController in Storyboard should be enough to recreate the issue.
Change
cell.contents = roundImage(with: .yellow)
To
cell.contents = roundImage(with: .yellow).cgImage

Swift make UIView border into Gradient Color

I want to create a gradient border on a UIView.
The following code can produce a solid for the view Box1.
nothing I have found allows me to change the frameColor to a gradient.
var frameColor = UIColor.red.cgColor
var leftBorder = CALayer()
leftBorder.frame = CGRect(x: 0.0, y: 0, width: 1, height: box1.frame.size.height )
leftBorder.backgroundColor = frameColor
I am using Swift 5 and Xcode 11.
Thank you.
Try with below extension
public extension UIView {
private static let kLayerNameGradientBorder = "GradientBorderLayer"
func setGradientBorder(
width: CGFloat,
colors: [UIColor],
startPoint: CGPoint = CGPoint(x: 0.5, y: 0),
endPoint: CGPoint = CGPoint(x: 0.5, y: 1)
) {
let existedBorder = gradientBorderLayer()
let border = existedBorder ?? CAGradientLayer()
border.frame = bounds
border.colors = colors.map { return $0.cgColor }
border.startPoint = startPoint
border.endPoint = endPoint
let mask = CAShapeLayer()
mask.path = UIBezierPath(roundedRect: bounds, cornerRadius: 0).cgPath
mask.fillColor = UIColor.clear.cgColor
mask.strokeColor = UIColor.white.cgColor
mask.lineWidth = width
border.mask = mask
let exists = existedBorder != nil
if !exists {
layer.addSublayer(border)
}
}
func removeGradientBorder() {
self.gradientBorderLayer()?.removeFromSuperlayer()
}
private func gradientBorderLayer() -> CAGradientLayer? {
let borderLayers = layer.sublayers?.filter { return $0.name == UIView.kLayerNameGradientBorder }
if borderLayers?.count ?? 0 > 1 {
fatalError()
}
return borderLayers?.first as? CAGradientLayer
}
}
Usage
self.borderView.setGradientBorder(width: 5.0, colors: [UIColor.red , UIColor.blue])
I hope this will reach your requirement.
https://medium.com/#kushal0409/gradient-button-3dc8ef763039
There is no off-the-shelf way to do this, but you could build it yourself.
Off the top of my head, the approach might look like this:
Create a CAGradientLayer and set it up to draw your gradient as
desired.
Create a CAShapeLayer that contains an empty rectangle that is your
frame.
Add your shape layer as the mask of your gradient layer.
Add the gradient layer to your view as a sub-layer of the view's
content layer.
Swift 5 extension (works with corner radius)
extension UIView {
func gradientBorder(colors: [UIColor], isVertical: Bool){
self.layer.masksToBounds = true
//Create gradient layer
let gradient = CAGradientLayer()
gradient.frame = CGRect(origin: CGPoint.zero, size: self.bounds.size)
gradient.colors = colors.map({ (color) -> CGColor in
color.cgColor
})
//Set gradient direction
if(isVertical){
gradient.startPoint = CGPoint(x: 0.5, y: 0)
gradient.endPoint = CGPoint(x: 0.5, y: 1)
}
else {
gradient.startPoint = CGPoint(x: 0, y: 0.5)
gradient.endPoint = CGPoint(x: 1, y: 0.5)
}
//Create shape layer
let shape = CAShapeLayer()
shape.lineWidth = 1
shape.path = UIBezierPath(roundedRect: gradient.frame.insetBy(dx: 1, dy: 1), cornerRadius: self.layer.cornerRadius).cgPath
shape.strokeColor = UIColor.black.cgColor
shape.fillColor = UIColor.clear.cgColor
gradient.mask = shape
//Add layer to view
self.layer.addSublayer(gradient)
gradient.zPosition = 0
}
}

Circular crop for photos from photo library when using UIImagePickerController

I am trying to change the square crop tool to circular one for the images selected from Photo Library in Swift 4. I tried many old codes available in here with no luck. Can somebody please help me.
There are mainly 2 issues in this code.
It doesn't hide the already existing square cropping area.
It shows the choose and cancel buttons under the old overlay, so cant tap on it.
Any help would be appreciated.
My code:
private func hideDefaultEditOverlay(view: UIView)
{
for subview in view.subviews
{
if let cropOverlay = NSClassFromString("PLCropOverlayCropView")
{
if subview.isKind(of: cropOverlay) {
subview.isHidden = true
break
}
else {
hideDefaultEditOverlay(view: subview)
}
}
}
}
private func addCircleOverlayToImageViewer(viewController: UIViewController) {
let circleColor = UIColor.clear
let maskColor = UIColor.black.withAlphaComponent(0.8)
let screenHeight = UIScreen.main.bounds.size.height
let screenWidth = UIScreen.main.bounds.size.width
hideDefaultEditOverlay(view: viewController.view)
let circleLayer = CAShapeLayer()
let circlePath = UIBezierPath(ovalIn: CGRect(x: 0, y: screenHeight - screenWidth, width: screenWidth, height: screenWidth))
circlePath.usesEvenOddFillRule = true
circleLayer.path = circlePath.cgPath
circleLayer.fillColor = circleColor.cgColor
let maskPath = UIBezierPath(roundedRect: CGRect(x: 0, y: 0, width: screenWidth, height: screenHeight), cornerRadius: 0)
maskPath.append(circlePath)
maskPath.usesEvenOddFillRule = true
let maskLayer = CAShapeLayer()
maskLayer.path = maskPath.cgPath
maskLayer.fillRule = kCAFillRuleEvenOdd
maskLayer.fillColor = maskColor.cgColor
viewController.view.layer.addSublayer(maskLayer)
// Move and Scale label
let label = UILabel(frame: CGRect(x: 0, y: 20, width: view.frame.width, height: 50))
label.text = "Move and Scale"
label.textAlignment = .center
label.textColor = UIColor.white
viewController.view.addSubview(label)
}

Saving NSUserDefaults with UISwitch in Swift 2

I have posted all my code below to fully demonstrate what I am trying to accomplish. I have a UI Switch, that I would like to save a NSUserDefault on what game mode they would like. I am not sure why this is not working correctly, as it currently does not save- as the switch doesn't work.
import SpriteKit
class ModeScene: SKScene {
var modeSwitch = UISwitch()
var motionLabel = UILabel()
var touchLabel = UILabel()
override func didMoveToView(view: SKView) {
let MotionMode = NSUserDefaults.standardUserDefaults()
let TouchMode = NSUserDefaults.standardUserDefaults()
modeSwitch.center = CGPoint(x: view.center.x, y: view.frame.size.height / 1.3)
modeSwitch.addTarget(self, action: Selector("updateMode"), forControlEvents: UIControlEvents.ValueChanged)
if TouchMode {
modeSwitch.on = false
}
else{
modeSwitch.on = true
}
self.view?.addSubview(modeSwitch)
motionLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 700, height: 200))
motionLabel.center = CGPoint(x: view.center.x * 3.4, y: view.frame.size.height / 1.3)
motionLabel.text = "Accelerometer"
motionLabel.textColor = UIColor.whiteColor()
motionLabel.font = UIFont(name:"ArialRoundedMTBold", size: 16)
self.view?.addSubview(motionLabel)
touchLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 700, height: 200))
touchLabel.center = CGPoint(x: view.center.x * 2.25, y: view.frame.size.height / 1.3)
touchLabel.text = "Touch To Move"
touchLabel.textColor = UIColor.whiteColor()
touchLabel.font = UIFont(name:"ArialRoundedMTBold", size: 16)
self.view?.addSubview(touchLabel)
DoneBtn = UIButton(frame: CGRect(x: 0, y: 0, width: 400, height: 30))
DoneBtn.center = CGPoint(x: view.center.x * 1.7, y: view.frame.size.height / 14)
DoneBtn.setTitle("Done", forState: UIControlState.Normal)
DoneBtn.setTitleColor(UIColor.whiteColor(), forState: UIControlState.Normal)
DoneBtn.addTarget(self, action: Selector("done"), forControlEvents: UIControlEvents.TouchUpInside)
self.view?.addSubview(DoneBtn)
updateMode()
}
func updateMode(){
if modeSwitch.on {
// mode is accel
let MotionMode = NSUserDefaults.standardUserDefaults()
MotionMode.setValue(true, forKey: "MotionMode")
NSLog("Mode is accel")
}
else{
// mode is touch
let TouchMode = NSUserDefaults.standardUserDefaults()
TouchMode.setObject(true, forKey: "TouchMode")
NSLog("Mode is touch")
}
}
func done(){
self.scene?.view?.presentScene(StartScene(size: self.scene!.size), transition: SKTransition.fadeWithColor(UIColor.blackColor(), duration: 1))
headerLabel.removeFromSuperview()
DoneBtn.removeFromSuperview()
modeSwitch.removeFromSuperview()
touchLabel.removeFromSuperview()
motionLabel.removeFromSuperview()
}
}
Code Update:
import SpriteKit
class ModeScene: SKScene {
var modeSwitch = UISwitch()
var motionLabel = UILabel()
var touchLabel = UILabel()
var DoneBtn : UIButton!
override func didMoveToView(view: SKView) {
backgroundColor = SKColor.blackColor()
modeSwitch.center = CGPoint(x: view.center.x, y: view.frame.size.height / 1.3)
modeSwitch.addTarget(self, action: Selector("updateMode"), forControlEvents: UIControlEvents.ValueChanged)
self.view?.addSubview(modeSwitch)
motionLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 700, height: 200))
motionLabel.center = CGPoint(x: view.center.x * 3.4, y: view.frame.size.height / 1.3)
motionLabel.text = "Accelerometer"
motionLabel.textColor = UIColor.whiteColor()
motionLabel.font = UIFont(name:"ArialRoundedMTBold", size: 16)
self.view?.addSubview(motionLabel)
touchLabel = UILabel(frame: CGRect(x: 0, y: 0, width: 700, height: 200))
touchLabel.center = CGPoint(x: view.center.x * 2.25, y: view.frame.size.height / 1.3)
touchLabel.text = "Touch To Move"
touchLabel.textColor = UIColor.whiteColor()
touchLabel.font = UIFont(name:"ArialRoundedMTBold", size: 16)
self.view?.addSubview(touchLabel)
DoneBtn = UIButton(frame: CGRect(x: 0, y: 0, width: 400, height: 30))
DoneBtn.center = CGPoint(x: view.center.x * 1.7, y: view.frame.size.height / 14)
DoneBtn.setTitle("Done", forState: UIControlState.Normal)
DoneBtn.setTitleColor(UIColor.whiteColor(), forState: UIControlState.Normal)
DoneBtn.addTarget(self, action: Selector("done"), forControlEvents: UIControlEvents.TouchUpInside)
self.view?.addSubview(DoneBtn)
let defaults = NSUserDefaults.standardUserDefaults()
if let motionMode = defaults.objectForKey("motionMode") as? Bool {
if motionMode {
// true
modeSwitch.on = true
} else {
// false
modeSwitch.on = false
}
}
updateMode()
}
func updateMode(){
let defaults = NSUserDefaults.standardUserDefaults()
if modeSwitch.on {
// mode is accel
defaults.setBool(true, forKey: "motionMode")
NSLog("Mode is accel")
}
else{
// mode is touch
defaults.setBool(true, forKey: "touchMode")
NSLog("Mode is touch")
}
}
func done(){
self.scene?.view?.presentScene(StartScene(size: self.scene!.size), transition: SKTransition.fadeWithColor(UIColor.blackColor(), duration: 1))
headerLabel.removeFromSuperview()
DoneBtn.removeFromSuperview()
modeSwitch.removeFromSuperview()
touchLabel.removeFromSuperview()
motionLabel.removeFromSuperview()
}
}
You forgot to actually load the values from NSUserDefaults.
You set them with setValue and setObject, but you never load them back.
Use the valueForKey or objectForKey methods to retrieve your values.
let defaults = NSUserDefaults.standardUserDefaults()
let MotionMode = defaults.objectForKey("MotionMode") as! Bool
if MotionMode {
// true
} else {
// false
}
Even better with safe unwrapping:
let defaults = NSUserDefaults.standardUserDefaults()
if let MotionMode = defaults.objectForKey("MotionMode") as? Bool {
if MotionMode {
// true
} else {
// false
}
}
A few notes: variables should begin with a lowercase letter, so "MotionMode" should be "motionMode", etc. You could use the specialized object getters like boolForKey instead of the generic objectForKey which forces you to typecast to Bool. Of course it goes with setBool on the other side. Last: the variable you call "MotionMode" actually holds NSUserDefaults.standardUserDefaults(), so I called it "defaults" instead in my example.
Your question has several parts, but it's better to make a single post for a single question. So I've focused about the failing NSUserDefaults part because it was the most important. Using my answer, if your code still doesn't work because of the UI parts, then you should post a new different question about it to keep things clear.