【问题标题】:Shadow UIview and clipsToBounds阴影 UIview 和 clipsToBounds
【发布时间】:2014-07-08 18:44:50
【问题描述】:

我想为我的容器 UIView 设置阴影。 我用这段代码来制作它:

- (id)initWithCoder:(NSCoder*)aDecoder
{
    self = [super initWithCoder:aDecoder];
    if (self) {

        //-> drop shadow
        [self.layer setShadowColor:[UIColor blackColor].CGColor];
        [self.layer setShadowOpacity:0.6];
        [self.layer setShadowRadius:2.0];
        [self.layer setShadowOffset:CGSizeMake(2.0, 2.0)];
    }

    return self;
}

这很好用。但是,当我在这个容器 UIView 上使用 _containerView.clipsToBounds = YES; 时,我看不到我的影子。为什么?

【问题讨论】:

标签: ios objective-c uiview uikit


【解决方案1】:

如果您必须使用clipsToBounds = true,因为您不希望子视图超出视图的边界,但同时您需要在视图上添加阴影,我建议在视图后面添加一个额外的视图并在额外视图上设置阴影属性。

//run this in viewDidLoad() or your initialisation code
private func setupShadowContainer() {
    let containerShadow = UIView()
    parentView.addSubview(containerShadow)
    containerShadow.dropShadow()
    //using SnapKit here, you can use NSLayoutConstraint in a similar way to constraint the containerShadow behind your View
    containerShadow.snp.makeConstraints { (make) in
        make.edges.equalTo(yourView.snp.edges)
    }
}

//dropShadow method
extension UIView {
    func dropShadow() {
        self.translatesAutoresizingMaskIntoConstraints = false
        self.layer.shadowRadius = 3
        self.layer.shadowColor = UIColor.black.cgColor
        self.layer.shadowOffset = CGSize(width: 1.0, height: 1.0)
        self.layer.shadowOpacity = 0.5
        self.layer.masksToBounds = false
    }
}

【讨论】:

  • 如果没有显示阴影,您可能还需要在 containerShadow 上设置随机背景颜色
【解决方案2】:

这是 UIView 扩展。

extension UIView {
    func addShadowAndRoundCorner(cornerRadius : CGFloat) {
        self.layer.shadowOffset = .zero
        self.layer.shadowOpacity = 0.5
        self.layer.shadowRadius = 3
        self.layer.shadowColor = UIColor.black.cgColor
        self.layer.masksToBounds = false
        self.layer.cornerRadius = cornerRadius
    }
}

创建视图后调用该函数如下:

let roundView = UIView()
roundView.frame = CGRect.init(x: 0, y: 0, width: 100, height: 100)
roundView.addShadowAndRoundCorner(cornerRadius: 100/2)

【讨论】:

    【解决方案3】:
    - (void)layoutSubviews
    {
        [super layoutSubviews];
    
        CAGradientLayer *l = [CAGradientLayer layer];
        l.frame = self.bounds;
        l.colors = [NSArray arrayWithObjects:(id)[UIColor clearColor].CGColor, (id)[UIColor whiteColor].CGColor, (id)[UIColor whiteColor].CGColor,(id)[UIColor whiteColor].CGColor,(id)[UIColor whiteColor].CGColor,(id)[UIColor whiteColor].CGColor, (id)[UIColor clearColor].CGColor,(id)[UIColor clearColor].CGColor, nil];
        l.startPoint = CGPointMake(0.0f, 1.0f);
        l.endPoint = CGPointMake(1.0f, 1.0f);
        self.layer.mask = l;
    }
    

    【讨论】:

    • 连一句简短的话都无法解释?
    【解决方案4】:

    clipsToBounds 也会剪掉你的影子。为了防止这种情况,您可以添加 _containerView.layer.masksToBounds = NO 以禁用子图层的剪辑(请参阅更多 here)。

    【讨论】:

    • 感谢masksToBounds
    猜你喜欢
    • 2011-11-21
    • 2014-09-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-06-12
    相关资源
    最近更新 更多