需求如下图
实现思路:先设置一个view,设置渐变色,在上面叠加一个view,画弧线,挡住边缘部分,实现弧线效果。
创建HomeNavStrokeView.h文件,加入以下代码:
#import
NS_ASSUME_NONNULL_BEGIN
@interface HomeNavStrokeView : UIView
@end
@interface CHNavBgView : UIView
@end
NS_ASSUME_NONNULL_END
在HomeNavStrokeView.m文件中实现:
#define kWidth_bg [UIScreen mainScreen].bounds.size.width
#define kHeight_bg [UIScreen mainScreen].bounds.size.height
#define kHeight_NavStatus ([UIApplication sharedApplication].statusBarFrame.size.height +44)
#import "HomeNavStrokeView.h"
@implementation HomeNavStrokeView
- (instancetype)initWithFrame:(CGRect)frame {
if(self== [superinitWithFrame:frame]) {
[selfaddSubViews];
}
return self;
}
- (void)awakeFromNib {
[super awakeFromNib];
[self addSubViews];
}
- (void)addSubViews {
UIView*navViewBg = [[UIViewalloc]initWithFrame:CGRectMake(0,0,kWidth_bg,kHeight_NavStatus+80)];
CGRectgradientFrame =CGRectMake(0,0,kWidth_bg,kHeight_NavStatus+80);
[navViewBgsetGradientLayerWithGradientFrame:gradientFrame
originalColor:[UIColorpurpleColor]
finishColor:[UIColorblueColor]
startPoint:CGPointMake(0,0.7)
endPoint:CGPointMake(1,0.3)
withCornerRadii:0
borderColor:[UIColorclearColor]
borderWidth:0];
[selfaddSubview:navViewBg];
CHNavBgView *strokeView = [[CHNavBgView alloc] initWithFrame:CGRectMake(0, kHeight_NavStatus + 20, kWidth_bg, kHeight_bg - (kHeight_NavStatus + 20))];
[selfaddSubview:strokeView];
}
@end
@implementation CHNavBgView
- (instancetype)initWithFrame:(CGRect)frame {
if(self== [superinitWithFrame:frame]) {
[self setBackgroundColor:[UIColor clearColor]];
[self setUserInteractionEnabled:NO];
}
return self;
}
- (void)awakeFromNib {
[super awakeFromNib];
[self setBackgroundColor:[UIColor clearColor]];
[self setUserInteractionEnabled:NO];
}
- (void)drawRect:(CGRect)rect {
floatx = rect.origin.x;
floaty = rect.origin.y;
floatw = rect.size.width;
floath = rect.size.height;
// 一个不透明类型的Quartz 2D绘画环境,相当于一个画布,你可以在上面任意绘画
CGContextRef context = UIGraphicsGetCurrentContext();
// 画笔线的颜色
CGContextSetRGBStrokeColor(context,0,0,0,0);
// 线的宽度
CGContextSetLineWidth(context, 1.0);
// 填充颜色
UIColor*fullColor =kColorWith(245,245,245,1);
CGContextSetFillColorWithColor(context, fullColor.CGColor);
// 绘制路径
CGContextMoveToPoint(context,x,y);
CGContextAddLineToPoint(context,x,h);
CGContextAddLineToPoint(context,w,h);
CGContextAddLineToPoint(context,w,y);
CGContextAddArcToPoint(context,w/2.0,30,x,y,w*2);
CGContextAddLineToPoint(context,x,y);
// CGContextStrokePath(context);
// 绘制路径加填充
CGContextDrawPath(context, kCGPathFillStroke);
}
@end
使用时候,在对应的view controller中,
#import "HomeNavStrokeView.h"
创建
HomeNavStrokeView *_viewNavStroke;
初始化
_viewNavStroke = [[HomeNavStrokeView alloc] initWithFrame:CGRectMake(0, 0, kScreenWidth, kScreenHeight - k_tabbar_height)];
[self.view addSubview:_viewNavStroke];
注:也可以使用xib,直接拖一个view上来,把对应的class设置成HomeNavStrokeView就可以了,不用在view controller.m中加任何代码。