Сянка отляво и отдясно на UIView

Здравейте, обичам да добавя CALayer Shadow към изглед, където сянката беше отляво и отдясно на изгледа, най-простият начин беше:

someView.layer.shadowColor = [[UIColor blackColor] CGColor];
someView.layer.shadowOffset = CGSizeMake(0.0f,0.0f);
someView.layer.shadowOpacity = 1.0f;
someView.layer.shadowRadius = 10.0f;
someView.layer.shadowPath = [[UIBezierPath bezierPathWithRect:someView.bounds] CGPath];

но ще добавя по-голяма сянка, тъй като като сянка, когато увелича shadowRadius, не изглежда добре. Как мога да направя сянка, която изглежда добре отляво и отдясно.


person Zeropointer    schedule 08.01.2013    source източник


Отговори (4)


Мисля, че 10 е доста голям радиус на сянка, опитайте вместо това 3 или 4, също и непрозрачност, обикновено използвам 0,7:

someView.layer.shadowColor = [[UIColor blackColor] CGColor];
someView.layer.shadowOffset = CGSizeMake(0.0f,0.0f);
someView.layer.shadowOpacity = 0.7f;
someView.layer.shadowRadius = 4.0f;

Ако искате сянката само отляво и отдясно, тогава вмъкнете правоъгълника отгоре и отдолу, така че горната и долната сянка да са скрити зад вашия изглед:

CGRect shadowRect = CGRectInset(someView.bounds, 0, 4);  // inset top/bottom
someView.layer.shadowPath = [[UIBezierPath bezierPathWithRect:shadowRect] CGPath];

Не съм много сигурен дали това е, което искахте.

person progrmr    schedule 08.01.2013
comment
Говорих с моя дизайнер, че тази сянка е твърде малка. Имам нужда от различни x отмествания отляво и отдясно. - person Zeropointer; 08.01.2013
comment
Невероятен отговор, но момчета някой е внедрил това със заоблени ъгли (по-гладки), тъй като тази правоподобна сянка изглежда зле. Някакви прозрения? Благодаря предварително ! :) - person l.vasilev; 16.05.2016
comment
Вместо това използвайте bezierPathWithRoundedRect - person progrmr; 17.05.2016
comment
Не съм сигурен защо това има толкова много гласове. В моята реализация, както се очакваше, това предотвратява страничните сенки да стигнат чак до горната и долната част на страните. - person mattsson; 07.02.2017
comment
@progrmr Искам вътрешна сянка със специфична страна, например само отгоре или отгоре/вдясно. Някакви предположения ? - person Mitesh Dobareeya; 27.03.2018

Swift 3.0 версия

imageView.layer.shadowOpacity = 0.8
imageView.layer.shadowOffset = CGSize(width: 0, height: 3)
imageView.layer.shadowRadius = 4.0

let shadowRect: CGRect = imageView.bounds.insetBy(dx: 0, dy: 4)
imageView.layer.shadowPath = UIBezierPath(rect: shadowRect).cgPath
person Fangming    schedule 06.07.2017

отговорът на progrmr беше много полезен, наздраве!

Направих плъзгащо се меню и имах проблем със сянката, заобикаляща моя VC и прекъсваща лентата за навигация. Оказа се, че трябва да вмъкна слоя със сянка.

Ето моето решение с помощта на swift:

rightViewController!.view.layer.shadowOpacity = 0.8
rightViewController!.view.layer.shadowOffset = CGSizeMake(0, 3)
rightViewController!.view.layer.shadowRadius = 4.0

let shadowRect: CGRect = CGRectInset(rightViewController!.view.bounds, 0, 4);  // inset top/bottom
rightViewController!.view.layer.shadowPath = UIBezierPath(rect: shadowRect).CGPath
person Johan Tingbacke    schedule 27.06.2016

Създадох сянка, която може да се използва отгоре/отдолу или отляво/отдясно, без никакви предубеждения. Няма да се появи сянка вляво/вдясно, ако изберете отгоре/отдолу и т.н. Дано съм помогнал. Ето кода:


import UIKit

class ViewController: UIViewController {
  
    
     override func viewDidLoad() {
        super.viewDidLoad()
        
        let imgView = UIImageView(frame: CGRect(x: self.view.bounds.midX - 150, y: self.view.bounds.midY - 150, width: 300, height: 300))
            
        imgView.contentMode = .scaleToFill
        imgView.image = UIImage(named: "name image")

        self.view.addSubview(imgView)
        //You can put left/right or top/bottom
        imgView.addShadow(sides: .leftRight, constant: 10, alpha: 5)

        
     }

}

extension UIView{
    
    func addShadow(sides: Sides, constant: Int, alpha: Int){
        if(constant > 0 && alpha > 0){
        switch sides {
            case .leftRight:
   
                let view = UIView(frame: CGRect(x: -CGFloat(constant), y: 0, width: self.bounds.width + CGFloat((constant * 2)), height: self.bounds.height))
                self.addSubview(view)

                addMask(sides: .leftRight, view: view, constant: constant, shadowRadius: alpha)
                
            case .topBottom:

                let view = UIView(frame: CGRect(x: 0, y: -CGFloat(constant), width: self.bounds.width , height: self.bounds.height + CGFloat(constant * 2)))
                self.addSubview(view)

                addMask(sides: .topBottom, view: view, constant: constant, shadowRadius: alpha)

            }
        }
    }
    
    private func addMask(sides:Sides, view: UIView, constant: Int, shadowRadius:Int){
        let mutablePath = CGMutablePath()
        let mask = CAShapeLayer()

        switch sides {
        case .leftRight:
            
            mutablePath.addRect(CGRect(x: -CGFloat(constant), y: 0, width: view.bounds.width, height: view.bounds.height))

            mutablePath.addRect(CGRect(x: CGFloat(constant) , y: 0, width: view.bounds.width , height: view.bounds.height))

            
        case .topBottom:
            
            mutablePath.addRect(CGRect(x: 0, y: -CGFloat(constant), width: view.bounds.width, height: view.bounds.height))

            mutablePath.addRect(CGRect(x: 0, y: CGFloat(constant) , width: view.bounds.width , height: view.bounds.height))
        }

        mask.path = mutablePath

        mask.fillRule = CAShapeLayerFillRule.evenOdd
        mask.fillColor  = UIColor(white:1.0, alpha: 0.2).cgColor
        view.layer.mask = mask
        view.layer.addSublayer(mask)
        mask.shadowColor = UIColor.black.cgColor
        mask.shadowRadius = CGFloat(shadowRadius)
        mask.shadowOpacity = 1.0
        mask.shadowOffset = CGSize(width: 0, height: 0)

    }
}

enum Sides{
    case leftRight
    case topBottom
}

Просто трябва да извикате разширението UIView, което има функцията addShadow() и да подадете желаните от вас параметри.

въведете описание на изображението тук

въведете описание на изображението тук

person GuimarãesGabrielG    schedule 05.05.2021