add "shadow+border+corner" specially for UIView

来源:互联网 发布:unity3d 液体流动 编辑:程序博客网 时间:2024/05/22 03:25


1. Add corners for UIView. Normally it's very easy, just setup the cornerRadius for the UIView's layer.

    Specially, if you want to specify some corners of the UIView. You can find some solutions on the Stackoverflow. I will list on of it here, which I thins it's the best and simple one.


UIView *view = [[UIView alloc] initWithFrame:CGRectMake(80, 80, 120, 120)];view.backgroundColor = [UIColor redColor];[self.view addSubview:view];    UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:view.bounds byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight cornerRadii:CGSizeMake(10, 10)];CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];maskLayer.frame = view.bounds;maskLayer.path = maskPath.CGPath;view.layer.mask = maskLayer;

Obviously, you can setup the parameter "byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight", to specify the corners. 

This parameter is UIRectCorner type, the it includes:

* UIRectCornerTopLeft* UIRectCornerTopRight* UIRectCornerBottomLeft* UIRectCornerBottomRight* UIRectCornerAllCorners

You can combine them together, with "|".


2. Add border for UIView. You can setup the border width and border colour for UIView's layer simply, and this will effect all 4 edges of this UIView.

    Simply, if you want to specify some edges of the UIView to add the border, you can a layer for the each specified edge.

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(80, 80, 120, 120)];view.backgroundColor = [UIColor redColor];[self.view addSubview:view];CGRect rect = view.frame;CALayer *border1 = [CALayer layer];border1.backgroundColor = [UIColor lightGrayColor].CGColor;border1.frame = CGRectMake(0, rect.size.height-1, rect.size.width, 1);  // the bottom border[view.layer addSublayer:border1];CALayer *border2 = [CALayer layer];border2.backgroundColor = [UIColor lightGrayColor].CGColor;border2.frame = CGRectMake(0, 0, rect.size.width, 1);  // the top border[view.layer addSublayer:border2];.... // add other two side border


3. Add shadow for UIView. You can setup the "shadowOffset", "shadowOpacity", "shadowColor" for UIView's layer simply.

    If you want to add some special shadow for this UIView, you should use the UIBezierPath category.

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, 300.0, 225.0)];  view.backgroundColor = [UIColor redColor];  view.layer.shadowOffset = CGSizeMake(0, 3);  view.layer.shadowOpacity = 0.8;   view.layer.shouldRasterize = YES;       // shadow  UIBezierPath *path = [UIBezierPath bezierPath];      CGPoint topLeft      = view.bounds.origin;  CGPoint bottomLeft   = CGPointMake(0.0, CGRectGetHeight(view.bounds) + 10);  CGPoint bottomMiddle = CGPointMake(CGRectGetWidth(view.bounds) / 2, CGRectGetHeight(view.bounds) - 5);    CGPoint bottomRight  = CGPointMake(CGRectGetWidth(view.bounds), CGRectGetHeight(view.bounds) + 10);  CGPoint topRight     = CGPointMake(CGRectGetWidth(view.bounds), 0.0);    [path moveToPoint:topLeft];  [path addLineToPoint:bottomLeft];  [path addQuadCurveToPoint:bottomRight               controlPoint:bottomMiddle];  [path addLineToPoint:topRight];  [path addLineToPoint:topLeft];  [path closePath];    view.layer.shadowPath = path.CGPath;        [self.view addSubview:view]; 




0 0
原创粉丝点击