Swift - Köşe yarıçapı ve alt gölge ile ilgili sorunlar


86

Yuvarlak köşeli ve alt gölgeli bir düğme oluşturmaya çalışıyorum . Nasıl geçiş yaparsam yapayım, düğme düzgün görüntülenmeyecek. Denedim masksToBounds = falseve masksToBounds = trueama ya köşe yarıçapı çalışıyor ve gölge çalışmıyor ya da gölge çalışıyor ve köşe yarıçapı düğmenin köşelerini kırpmıyor.

import UIKit
import QuartzCore

@IBDesignable
class Button : UIButton
{
    @IBInspectable var masksToBounds: Bool    = false                {didSet{updateLayerProperties()}}
    @IBInspectable var cornerRadius : CGFloat = 0                    {didSet{updateLayerProperties()}}
    @IBInspectable var borderWidth  : CGFloat = 0                    {didSet{updateLayerProperties()}}
    @IBInspectable var borderColor  : UIColor = UIColor.clearColor() {didSet{updateLayerProperties()}}
    @IBInspectable var shadowColor  : UIColor = UIColor.clearColor() {didSet{updateLayerProperties()}}
    @IBInspectable var shadowOpacity: CGFloat = 0                    {didSet{updateLayerProperties()}}
    @IBInspectable var shadowRadius : CGFloat = 0                    {didSet{updateLayerProperties()}}
    @IBInspectable var shadowOffset : CGSize  = CGSizeMake(0, 0)     {didSet{updateLayerProperties()}}

    override func drawRect(rect: CGRect)
    {
        updateLayerProperties()
    }

    func updateLayerProperties()
    {
        self.layer.masksToBounds = masksToBounds
        self.layer.cornerRadius = cornerRadius
        self.layer.borderWidth = borderWidth
        self.layer.borderColor = borderColor.CGColor
        self.layer.shadowColor = shadowColor.CGColor
        self.layer.shadowOpacity = CFloat(shadowOpacity)
        self.layer.shadowRadius = shadowRadius
        self.layer.shadowOffset = shadowOffset
    }
}

Gölgeyi ve kırpmayı farklı katmanlara koymak isteyeceksiniz. Ve katman özelliklerini ayarlamak drawRectçok da iyi bir fikir değil. Onları yerleştirmek daha iyi initWithCoder.
David Berry

Sadece Google'da arama yapan herkes için, çok eski sorularda sıklıkla olduğu gibi, buradaki en iyi cevap genel olarak doğru olsa da şimdi bazı kritik hatalar içeriyor . (Düzeltilmiş bir cevap ekledim.) Çoğu insan, özellikle ben, en üstteki SO cevabını körü körüne kopyalayıp yapıştırın - çok eski bir KG ise dikkatli olun ! (Şimdi 2020 - biri 5 yıl içinde cevabımı değiştirecek!)
Şişko

Düğmenizin bir resmi varsa, düğmenin imageView'unu da köşe yarıçapı eklemeniz gerekecektir. Bu en basit yol olacak
Garnik

Yanıtlar:


146

Aşağıdaki Swift 5 / iOS 12 kodu, UIButtonyuvarlatılmış köşeleri ve çevresinde gölgeleri olan örnekler oluşturmaya izin veren bir alt sınıfın nasıl ayarlanacağını gösterir :

import UIKit

final class CustomButton: UIButton {

    private var shadowLayer: CAShapeLayer!

    override func layoutSubviews() {
        super.layoutSubviews()

        if shadowLayer == nil {
            shadowLayer = CAShapeLayer()
            shadowLayer.path = UIBezierPath(roundedRect: bounds, cornerRadius: 12).cgPath
            shadowLayer.fillColor = UIColor.white.cgColor

            shadowLayer.shadowColor = UIColor.darkGray.cgColor
            shadowLayer.shadowPath = shadowLayer.path
            shadowLayer.shadowOffset = CGSize(width: 2.0, height: 2.0)
            shadowLayer.shadowOpacity = 0.8
            shadowLayer.shadowRadius = 2

            layer.insertSublayer(shadowLayer, at: 0)
            //layer.insertSublayer(shadowLayer, below: nil) // also works
        }        
    }

}

İhtiyaçlarınıza göre UIButton, Öykü Panonuza bir tane ekleyebilir ve sınıfını olarak ayarlayabilir CustomButtonveya CustomButtonprogramlı olarak bir örnek oluşturabilirsiniz . Aşağıdaki UIViewControlleruygulama, CustomButtonprogramlı olarak bir örneğin nasıl oluşturulacağını ve kullanılacağını gösterir :

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let button = CustomButton(type: .system)
        button.setTitle("Button", for: .normal)
        view.addSubview(button)

        button.translatesAutoresizingMaskIntoConstraints = false
        let horizontalConstraint = button.centerXAnchor.constraint(equalTo: view.centerXAnchor)
        let verticalConstraint = button.centerYAnchor.constraint(equalTo: view.centerYAnchor)        
        let widthConstraint = button.widthAnchor.constraint(equalToConstant: 100)
        let heightConstraint = button.heightAnchor.constraint(equalToConstant: 100)
        NSLayoutConstraint.activate([horizontalConstraint, verticalConstraint, widthConstraint, heightConstraint])
    }

}

Önceki kod, iPhone simülatöründe aşağıdaki görüntüyü oluşturur:

görüntü açıklamasını buraya girin


iOS ile eski uygulamamla ilgili sorunlar yaşadım, şimdi çalışıyor. Teşekkür ederim!
carlodonz

1
Sınıfı ana görünüm denetleyiciniz olan @ POB'dan nasıl çağırırsınız?
Led

1
Yalnızca görünen kısmı koruyarak gölge katmanını kırpmanın bir yolu var mı?
Johan Tingbacke

5
masksToBounds = YESGölge katmanı, düğmenin kendi katmanının yuvarlatılmış köşeleri göstermesi gereken bir alt katmanı olduğundan, gölge de kırpılmayacak mı?
mattsson

3
Bu fin çalışıyor ama artık düğme arka planını değiştiremiyorum. Bu muhtemelen shadowLayer.fillColor nedeniyledir. Sen ne önerirsin? Teşekkürler !
GrayFox

36

Benim özel düğme bazı gölge ve yuvarlatılmış köşeleri , doğrudan içinde kullanmak Storyboardgerek kalmadan dokunmak programlı onu.

Swift 4

class RoundedButtonWithShadow: UIButton {
    override func awakeFromNib() {
        super.awakeFromNib()
        self.layer.masksToBounds = false
        self.layer.cornerRadius = self.frame.height/2
        self.layer.shadowColor = UIColor.black.cgColor
        self.layer.shadowPath = UIBezierPath(roundedRect: self.bounds, cornerRadius: self.layer.cornerRadius).cgPath
        self.layer.shadowOffset = CGSize(width: 0.0, height: 3.0)
        self.layer.shadowOpacity = 0.5
        self.layer.shadowRadius = 1.0
    }
}

görüntü açıklamasını buraya girin


Çabuk ve kolay.
Devbot10

1
Kodu yeniden yerleştirdiğimde benim için hile yaptı layoutSubviews().
Yash Bedi

14

Imanou'nun gönderisini genişletmek için, özel düğme sınıfına programlı olarak gölge katmanını eklemek mümkündür

@IBDesignable class CustomButton: UIButton {
    var shadowAdded: Bool = false

    @IBInspectable var cornerRadius: CGFloat = 0 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = cornerRadius > 0
        }
    }

    override func drawRect(rect: CGRect) {
        super.drawRect(rect)

        if shadowAdded { return }
        shadowAdded = true

        let shadowLayer = UIView(frame: self.frame)
        shadowLayer.backgroundColor = UIColor.clearColor()
        shadowLayer.layer.shadowColor = UIColor.darkGrayColor().CGColor
        shadowLayer.layer.shadowPath = UIBezierPath(roundedRect: bounds, cornerRadius: self.cornerRadius).CGPath
        shadowLayer.layer.shadowOffset = CGSize(width: 1.0, height: 1.0)
        shadowLayer.layer.shadowOpacity = 0.5
        shadowLayer.layer.shadowRadius = 1
        shadowLayer.layer.masksToBounds = true
        shadowLayer.clipsToBounds = false

        self.superview?.addSubview(shadowLayer)
        self.superview?.bringSubviewToFront(self)
    }
}

2
Katmanın gölgesini maskeliyorsunuz ve gölge görünümünü düğmenin gözetimine koymanızı gerçekten önermem.
mattsson

13

Daha kullanışlı ve tutarlı düğme elde etmenin alternatif bir yolu.

Swift 2:

func getImageWithColor(color: UIColor, size: CGSize, cornerRadius:CGFloat) -> UIImage {
    let rect = CGRectMake(0, 0, size.width, size.height)
    UIGraphicsBeginImageContextWithOptions(size, false, 1)
    UIBezierPath(
        roundedRect: rect,
        cornerRadius: cornerRadius
        ).addClip()
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return image
}

let button = UIButton(type: .Custom)
button.frame = CGRectMake(20, 20, 200, 50)
button.setTitle("My Button", forState: UIControlState.Normal)
button.setTitleColor(UIColor.blackColor(), forState: UIControlState.Normal)
self.addSubview(button)

let image = getImageWithColor(UIColor.whiteColor(), size: button.frame.size, cornerRadius: 5)
button.setBackgroundImage(image, forState: UIControlState.Normal)

button.layer.shadowRadius = 5
button.layer.shadowColor = UIColor.blackColor().CGColor
button.layer.shadowOpacity = 0.5
button.layer.shadowOffset = CGSizeMake(0, 1)
button.layer.masksToBounds = false

Swift 3:

func getImageWithColor(_ color: UIColor, size: CGSize, cornerRadius:CGFloat) -> UIImage? {
    let rect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
    UIGraphicsBeginImageContextWithOptions(size, false, 0)
    color.setFill()
    UIBezierPath(roundedRect: rect, cornerRadius: cornerRadius).addClip()
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return image
}

let button = UIButton(type: .custom)
button.frame = CGRect(x:20, y:20, width:200, height:50)
button.setTitle("My Button", for: .normal)
button.setTitleColor(UIColor.black, for: .normal)
self.addSubview(button)

if let image = getImageWithColor(UIColor.white, size: button.frame.size, cornerRadius: 5) {
    button.setBackgroundImage(image, for: .normal)
}

button.layer.shadowRadius = 5
button.layer.shadowColor = UIColor.black.cgColor
button.layer.shadowOpacity = 0.5
button.layer.shadowOffset = CGSize(width:0, height:1)
button.layer.masksToBounds = false

1
Normal ve vurgulanmış için farklı bir arka plan rengine sahip olabileceğiniz için bu yöntem en iyisidir
Ryan Heitner

1
Güzel. Düğmelerimde arka plan rengi, köşe yarıçapı ve gölgeler elde etmek için birçok farklı yöntem denedim, ancak işe yarayan tek yol buydu! Teşekkürler!
Harry Bloom

Bu mükemmel çözüm, bunun için teşekkürler! Bir not, UITableViewCell içinde UIButton kullanılıyorsa, programatik olarak bunun layoutSubviews () içine yerleştirilmesi gerekir.
bra.Scene

6

Swift 5 & "UIBezierPath" gerek yok

    view.layer.cornerRadius = 15
    view.clipsToBounds = true
    view.layer.masksToBounds = false
    view.layer.shadowRadius = 7
    view.layer.shadowOpacity = 0.6
    view.layer.shadowOffset = CGSize(width: 0, height: 5)
    view.layer.shadowColor = UIColor.red.cgColor

1
Görünüme hiçbir zaman herhangi bir köşe yarıçapı eklemez ve ihtiyaç duymanızın UIBezierPathnedeni, söz konusu görünümü yeniden kullanmanız gerekmesi durumunda performans nedenleridir.
Sharkes Monken

1
@SharkesMonken "ASLA" gerçekten !!!! ? Lütfen bir kez daha kontrol edin. Bu yöntemi projemin her yerinde kullanıyorum. Ve herhangi bir şüpheniz varsa, lütfen bu videoyu kontrol edin youtu.be/5qdF5ocDU7w
Hari R Krishna

lütfen videoyu kontrol edin
Hari R Krishna

Düğme için bir arka plan resminiz varsa çalışmaz. Görüntülerin köşe yarıçapı ayarlanmıyor
varoons

4

Herhangi bir görünümü desteklemek için bunu yeniden düzenledim . Görüşünüzü bundan alt sınıflara ayırın ve köşeleri yuvarlatılmış olmalıdır. Bu görünüme bir alt görünüm olarak UIVisualEffectView gibi bir şey eklerseniz, muhtemelen o UIVisualEffectView'da aynı yuvarlatılmış köşeleri kullanmanız gerekir, aksi takdirde yuvarlatılmış köşeleri olmaz.

UIView için gölgeli yuvarlatılmış köşeler - ekran görüntüsü aynı zamanda yuvarlatılmış köşelere sahip normal bir UIVisualEffectView olan bir bulanıklık kullanır

/// Inspiration: https://stackoverflow.com/a/25475536/129202
class ViewWithRoundedcornersAndShadow: UIView {
    private var theShadowLayer: CAShapeLayer?

    override func layoutSubviews() {
        super.layoutSubviews()

        if self.theShadowLayer == nil {
            let rounding = CGFloat.init(22.0)

            let shadowLayer = CAShapeLayer.init()
            self.theShadowLayer = shadowLayer
            shadowLayer.path = UIBezierPath.init(roundedRect: bounds, cornerRadius: rounding).cgPath
            shadowLayer.fillColor = UIColor.clear.cgColor

            shadowLayer.shadowPath = shadowLayer.path
            shadowLayer.shadowColor = UIColor.black.cgColor
            shadowLayer.shadowRadius = CGFloat.init(3.0)
            shadowLayer.shadowOpacity = Float.init(0.2)
            shadowLayer.shadowOffset = CGSize.init(width: 0.0, height: 4.0)

            self.layer.insertSublayer(shadowLayer, at: 0)
        }
    }
}

2

PiterPan'ın yanıtını iyileştirmek ve Swift 3'te dairesel bir düğme ile gerçek bir gölge (sadece bulanık olmayan bir arka plan değil) göstermek için:

override func viewDidLoad() {
    super.viewDidLoad()
    myButton.layer.masksToBounds = false
    myButton.layer.cornerRadius = myButton.frame.height/2
    myButton.clipsToBounds = true
}

override func viewDidLayoutSubviews() {
    addShadowForRoundedButton(view: self.view, button: myButton, opacity: 0.5)
}

func addShadowForRoundedButton(view: UIView, button: UIButton, opacity: Float = 1) {
    let shadowView = UIView()
    shadowView.backgroundColor = UIColor.black
    shadowView.layer.opacity = opacity
    shadowView.layer.shadowRadius = 5
    shadowView.layer.shadowOpacity = 0.35
    shadowView.layer.shadowOffset = CGSize(width: 0, height: 0)
    shadowView.layer.cornerRadius = button.bounds.size.width / 2
    shadowView.frame = CGRect(origin: CGPoint(x: button.frame.origin.x, y: button.frame.origin.y), size: CGSize(width: button.bounds.width, height: button.bounds.height))
    self.view.addSubview(shadowView)
    view.bringSubview(toFront: button)
}

1

İşte işe yarayacak çözüm!


extension UIView {

    func applyShadowWithCornerRadius(color:UIColor, opacity:Float, radius: CGFloat, edge:AIEdge, shadowSpace:CGFloat)    {

        var sizeOffset:CGSize = CGSize.zero
        switch edge {
        case .Top:
            sizeOffset = CGSize(width: 0, height: -shadowSpace)
        case .Left:
            sizeOffset = CGSize(width: -shadowSpace, height: 0)
        case .Bottom:
            sizeOffset = CGSize(width: 0, height: shadowSpace)
        case .Right:
            sizeOffset = CGSize(width: shadowSpace, height: 0)


        case .Top_Left:
            sizeOffset = CGSize(width: -shadowSpace, height: -shadowSpace)
        case .Top_Right:
            sizeOffset = CGSize(width: shadowSpace, height: -shadowSpace)
        case .Bottom_Left:
            sizeOffset = CGSize(width: -shadowSpace, height: shadowSpace)
        case .Bottom_Right:
            sizeOffset = CGSize(width: shadowSpace, height: shadowSpace)


        case .All:
            sizeOffset = CGSize(width: 0, height: 0)
        case .None:
            sizeOffset = CGSize.zero
        }

        self.layer.cornerRadius = self.frame.size.height / 2
        self.layer.masksToBounds = true;

        self.layer.shadowColor = color.cgColor
        self.layer.shadowOpacity = opacity
        self.layer.shadowOffset = sizeOffset
        self.layer.shadowRadius = radius
        self.layer.masksToBounds = false

        self.layer.shadowPath = UIBezierPath(roundedRect:self.bounds, cornerRadius:self.layer.cornerRadius).cgPath
    }
}

enum AIEdge:Int {
    case
    Top,
    Left,
    Bottom,
    Right,
    Top_Left,
    Top_Right,
    Bottom_Left,
    Bottom_Right,
    All,
    None
}

Son olarak, aşağıdaki gibi köşe yarıçapı çağrısı ile gölge uygulamak için:

viewRounded.applyShadowWithCornerRadius(color: .gray, opacity: 1, radius: 15, edge: AIEdge.All, shadowSpace: 15)

Sonuç Resmi

görüntü açıklamasını buraya girin

GÜNCELLEME : Beklenen çıktıyı görmüyorsanız, ana iş parçacığından uzantı yöntemini çağırmayı deneyin , bu kesinlikle işe yarayacaktır!

DispatchQueue.main.async {
    viewRounded.applyShadowWithCornerRadius(color: .gray, opacity: 1, radius: 15, edge: AIEdge.All, shadowSpace: 15)
}

0

Birinin Swift 3.0'da yuvarlak düğmelere gölge eklemesi gerekiyorsa , işte bunu yapmak için iyi bir yöntem.

func addShadowForRoundedButton(view: UIView, button: UIButton, shadowColor: UIColor, shadowOffset: CGSize, opacity: Float = 1) {
    let shadowView = UIView()
    shadowView.backgroundColor = shadowColor
    shadowView.layer.opacity = opacity
    shadowView.layer.cornerRadius = button.bounds.size.width / 2
    shadowView.frame = CGRect(origin: CGPoint(x: button.frame.origin.x + shadowOffset.width, y: button.frame.origin.y + shadowOffset.height), size: CGSize(width: button.bouds.width, height: button.bounds.height))
    self.view.addSubview(shadowView)
    view.bringSubview(toFront: button)
}

Bu yöntemi aşağıdaki func viewDidLayoutSubviews()gibi kullanın :

override func viewDidLayoutSubviews() {
    addShadowForRoundedButton(view: self.view, button: button, shadowColor: .black, shadowOffset: CGSize(width: 2, height: 2), opacity: 0.5)
}

Bu yöntemin etkisi: görüntü açıklamasını buraya girin


0

Alt gölge ve köşe yarıçapı için uzantı

extension UIView {

func dropShadow(color: UIColor, opacity: Float = 0.5, offSet: CGSize, shadowRadius: CGFloat = 1, scale: Bool = true, cornerRadius: CGFloat) {
    let shadowLayer = CAShapeLayer()
    shadowLayer.path = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRadius).cgPath
    shadowLayer.fillColor = UIColor.white.cgColor
    shadowLayer.shadowColor = color.cgColor
    shadowLayer.shadowPath = shadowLayer.path
    shadowLayer.shadowOffset = offSet
    shadowLayer.shadowOpacity = opacity
    shadowLayer.shadowRadius = shadowRadius
    layer.insertSublayer(shadowLayer, at: 0)
}

}

0

2020 sözdizimi için kesin çözüm

import UIKit
class ColorAndShadowButton: UIButton {
    override init(frame: CGRect) { super.init(frame: frame), common() }
    required init?(coder aDecoder: NSCoder) { super.init(coder: aDecoder), common() }
    private func common() {
        // UIButton is tricky: you MUST set the clear bg in bringup;  NOT in layout
        backgroundColor = .clear
        clipsToBounds = false
        self.layer.insertSublayer(backgroundAndShadow, below: layer)
    }
    
   lazy var colorAndShadow: CAShapeLayer = {
        let s = CAShapeLayer()
        // set your button color HERE (NOT on storyboard)
        s.fillColor = UIColor.black.cgColor
        // now set your shadow color/values
        s.shadowColor = UIColor.red.cgColor
        s.shadowOffset = CGSize(width: 0, height: 10)
        s.shadowOpacity = 1
        s.shadowRadius = 10
        // now add the shadow
        layer.insertSublayer(s, at: 0)
        return s
    }()
    
    override func layoutSubviews() {
        super.layoutSubviews()
        // you MUST layout these two EVERY layout cycle:
        colorAndShadow = bounds
        colorAndShadow = UIBezierPath(roundedRect: bounds, cornerRadius: 12).cgPath
    }
}

görüntü açıklamasını buraya girin

  • Buradaki en eski en iyi cevabın doğru olduğunu ancak kritik bir hata içerdiğini unutmayın.

Bunun UIButtonne yazık ki iOS'dakinden oldukça farklı olduğunu unutmayın UIView.

  • İOS'taki garip bir davranış nedeniyle , mizanpajda değil başlatmada arka plan rengini (bu durumda tabii ki net olmalıdır) ayarlamalısınız . Film şeridinde net bir şekilde ayarlayabilirsiniz (ancak genellikle düz renk olması için tıklarsınız, böylece film şeridinde çalışırken görebilirsiniz.)

Genel olarak, gölgeler / yuvarlama kombinasyonları iOS'ta gerçek bir acıdır. Benzer çözümler:

https://stackoverflow.com/a/57465440/294884 - görüntü + yuvarlak + gölgeler
https://stackoverflow.com/a/41553784/294884 - iki köşe sorunu
https://stackoverflow.com/a/59092828/294884 - "gölgeler + delik" veya "kızdırma kutusu" sorunu
https://stackoverflow.com/a/57400842/294884 - "sınır VE boşluk" sorunu
https://stackoverflow.com/a/57514286/294884 - temel "ekleme" Beziers


-1

Bir protokol oluşturabilir ve onu UIView, UIButton, Cell veya bunun gibi istediğiniz her şeye uydurabilirsiniz:

protocol RoundedShadowable: class {
    var shadowLayer: CAShapeLayer? { get set }
    var layer: CALayer { get }
    var bounds: CGRect { get }
}
​
extension RoundedShadowable {
    func applyShadowOnce(withCornerRadius cornerRadius: CGFloat, andFillColor fillColor: UIColor) {
        if self.shadowLayer == nil {
            let shadowLayer = CAShapeLayer()
            shadowLayer.path = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRadius).cgPath
            shadowLayer.fillColor = fillColor.cgColor
            shadowLayer.shadowColor = UIColor.black.cgColor
            shadowLayer.shadowPath = shadowLayer.path
            shadowLayer.shadowOffset = CGSize(width: 0.0, height: 2.0)
            shadowLayer.shadowOpacity = 0.2
            shadowLayer.shadowRadius = 3
            self.layer.insertSublayer(shadowLayer, at: 0)
            self.shadowLayer = shadowLayer
        }
    }
}
​
class RoundShadowView: UIView, RoundedShadowable {

    var shadowLayer: CAShapeLayer?
    private let cornerRadius: CGFloat
    private let fillColor: UIColor

    init(cornerRadius: CGFloat, fillColor: UIColor) {
        self.cornerRadius = cornerRadius
        self.fillColor = fillColor
        super.init(frame: .zero)
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        self.applyShadowOnce(withCornerRadius: self.cornerRadius, andFillColor: self.fillColor)
    }
}
​
class RoundShadowButton: UIButton, RoundedShadowable {

    var shadowLayer: CAShapeLayer?
    private let cornerRadius: CGFloat
    private let fillColor: UIColor

    init(cornerRadius: CGFloat, fillColor: UIColor) {
        self.cornerRadius = cornerRadius
        self.fillColor = fillColor
        super.init(frame: .zero)
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        self.applyShadowOnce(withCornerRadius: self.cornerRadius, andFillColor: self.fillColor)
    }
}

-1

CAShapeLayer ve UIBezierPath kullanarak, UIView'a ve UIButton, UIImageView, UILabel vb. Gibi ondan türetilen sınıflara gölge ve köşe yarıçapını kolayca ekleyebiliriz.

UIView Uzantısı ekleyeceğiz ve bunun iyi yanı, bunu başarmak için yalnızca bir satır kod yazmanız yeterli.

Belirli bir köşeyi de yuvarlayabilirsiniz Projenize UIView Uzantısının altına eklemeniz yeterlidir:

 extension UIView {

  func addShadow(shadowColor: UIColor, offSet: CGSize, opacity: Float, shadowRadius: 
  CGFloat, cornerRadius: CGFloat, corners: UIRectCorner, fillColor: UIColor = .white) {

    let shadowLayer = CAShapeLayer()
    let size = CGSize(width: cornerRadius, height: cornerRadius)
    let cgPath = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii: size).cgPath //1
    shadowLayer.path = cgPath //2
    shadowLayer.fillColor = fillColor.cgColor //3
    shadowLayer.shadowColor = shadowColor.cgColor //4
    shadowLayer.shadowPath = cgPath
    shadowLayer.shadowOffset = offSet //5
    shadowLayer.shadowOpacity = opacity
    shadowLayer.shadowRadius = shadowRadius
    self.layer.addSublayer(shadowLayer)
  }
}

Şimdi gölge ve köşe yarıçapı eklemek için aşağıdaki kodu yazmanız yeterli

  self.myView.addShadow(shadowColor: .black, offSet: CGSize(width: 2.6, height: 2.6), 
  opacity: 0.8, shadowRadius: 5.0, cornerRadius: 20.0, corners: [.topRight, .topLeft], 
  fillColor: .red)

-1

Gölgeli Köşe Yarıçapı

Kısa ve basit yol !!!!!

extension CALayer {
    func applyCornerRadiusShadow(
        color: UIColor = .black,
        alpha: Float = 0.5,
        x: CGFloat = 0,
        y: CGFloat = 2,
        blur: CGFloat = 4,
        spread: CGFloat = 0,
        cornerRadiusValue: CGFloat = 0)
    {
        cornerRadius = cornerRadiusValue
        shadowColor = color.cgColor
        shadowOpacity = alpha
        shadowOffset = CGSize(width: x, height: y)
        shadowRadius = blur / 2.0
        if spread == 0 {
            shadowPath = nil
        } else {
            let dx = -spread
            let rect = bounds.insetBy(dx: dx, dy: dx)
            shadowPath = UIBezierPath(rect: rect).cgPath
        }
    }

Kod kullanımı

btn.layer.applyCornerRadiusShadow(color: .black, 
                            alpha: 0.38, 
                            x: 0, y: 3, 
                            blur: 10, 
                            spread: 0, 
                            cornerRadiusValue: 24)

MaskToBound'a gerek yok

Lütfen clipsToBounds'un yanlış olduğunu doğrulayın.

ÇIKTI

görüntü açıklamasını buraya girin


Kod için teşekkürler ama benim için çalışmıyor, neden? Lütfen resmi kontrol edin: imgur.com/dY5M3BL
Mc.Lover

@ Mc.Lover maskToBound kullandınız mı? veya clipsToBounds?
Pankaj Bhalala
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.