iOS 当页面中没有数据的时候出现的一个指向创建按钮的 UIView

来源:互联网 发布:淘宝网div css布局实例 编辑:程序博客网 时间:2024/06/04 19:00

在我们做项目的时候经常会出现页面没有数据这样的情况,一般情况下我们都会在该页面上绘制一个用来提示用户没有数据的UIView,这样当然没有什么问题,但是我们如果能弄出来一个既能显示没有数据又能提示用户如何创建的UIView 来是不是更酷,好的,既然想法有了,那就想想用什么方法做吧,我首先想到的就是 UIPopoverPresentationController ,貌似这东西能帮我们实现我们想要的样式,但是如果用户点击了空白处的话,我们 pop 出来的Controller 就会自动调用 dismiss  方法,那显然不是我们想要的,那我们自己仿照 UIPopoverPresentationController 写一个View肿么样,就是按照上面的想法我去实现的,画出来之后长这样:


是不是还挺酷的,下面我就一步一步的说说这个东西是肿么出现的哈。。。

既然我们要显示一个UIVIew,那么我们就自己创建一个用来显示的 UIVIew 吧,里面只需要放一个UIImageView 和一个UILabel就好了,我创建的 UIVIew 叫做 test ,咱们先看看 h 文件中到底有些什么东西吧,

////  test.h//  testjiantou////  Created by WJHan on 15/12/30.//  Copyright © 2015年 avepoint. All rights reserved.//#import <UIKit/UIKit.h>@protocol WJPopViewDataSource;@interface test : UIView{CGPoint origin;CGSize size;UIFont *font;UILabel *label;NSString *title;UIBezierPath *path;CGRect superRect;CGRect drawFrame;NSArray * constrainsArray;}@property (nonatomic,assign) id<WJPopViewDataSource>dataSource;@property (nonatomic, strong) NSString *title; @property (nonatomic, strong) UIImageView *imageView;@property (nonatomic, assign) CGRect targetRect;@property (nonatomic, strong) UIView *targetView;@property (nonatomic, strong) UIView *popView;@property (nonatomic, assign) CGPoint p;typedef enum{    //枚举成员    ArrowDirectionUpAndAlignAtLeft = 0,    ArrowDirectionUpAndAlignAtRight,    ArrowDirectionDownAndAlignAtLeft,    ArrowDirectionDownAndAlignAtRight,    ArrowDirectionLeftAndAlignAtDown,    ArrowDirectionLeftAndAlignAtUp,    ArrowDirectionRightAndAlignAtDown,    ArrowDirectionRightAndAlignAtUp,    ArrowDirectionAny}ArrowDirection;//枚举名称@property (nonatomic, assign) ArrowDirection arrDir;-(id) init:(UIImage*) image str:(NSString*) str;-(void) set_title:(NSString*) str;@end@protocol WJPopViewDataSource <NSObject>@required-(CGRect)sourceRect:(test*)WJPopView; //指向的控件大小以及位置-(UIView*)sourceView:(test*)WJPopView;// 指向的是哪个控件-(CGSize)WJPopViewSize:(test*)WJpopView;//我们要显示的 WJPopView 的大小-(ArrowDirection)popViewArrowDeriction:(test*)WJpopView;//<span style="font-family: Arial, Helvetica, sans-serif;">WJPopView 的指向方向以及对齐位置</span>@end

WJPopViewDataSource  用来和使用该 View 的Controller 之间传递数据,title 中放的是 UILabel 中显示的内容,UIImageView 用来存放左侧的图片,size 用来存放这个View 的大小,targetView 与 targetRect 是仿照 UIPopoverPresentationController 中的 sourceView 和 sourceRect ,popView 是存放 上面的图片和UILabel 的 UIView,p 是画线的时候我们起始点。

ArrowDirction 这个枚举用来存放我们箭头指向的方向以及控件的对齐方式,我们定义了四个数据源代理来传递数据。。


下面来看看我们在 .m 文件中的具体实现:

////  test.m//  testjiantou////  Created by WJHan on 15/12/30.//  Copyright © 2015年 avepoint. All rights reserved.//#import "test.h"#define ArrowHight 18#define ArrowWidth 22#define DistanceWithEdge 35#define Radiu 6@implementation test@synthesize title;@synthesize imageView;@synthesize dataSource;@synthesize targetRect;@synthesize targetView;@synthesize p;@synthesize popView;@synthesize arrDir;-(id) init:(UIImage*) image str:(NSString*) str{    if([super init] == nil)        return nil;        path = [[UIBezierPath alloc] init];    label = [[UILabel alloc] init];    imageView = [[UIImageView alloc]initWithFrame:CGRectZero];    imageView.image = image;    [self setBackgroundColor: [UIColor clearColor]];    [self set_title: str];    return self;}- (void)layoutSubviews{    targetRect = [self.dataSource sourceRect:self];    targetView = [self.dataSource sourceView:self];    size = [dataSource WJPopViewSize:self];    arrDir = [dataSource popViewArrowDeriction:self];    superRect = [targetView superview].bounds;    if(arrDir == ArrowDirectionAny){        arrDir = [self judgeDirection:superRect];    }       switch (arrDir) {        case ArrowDirectionUpAndAlignAtLeft:                        drawFrame = CGRectMake(targetRect.origin.x , targetRect.origin.y + targetRect.size.height, size.width, size.height );            break;                    case ArrowDirectionUpAndAlignAtRight:                        drawFrame = CGRectMake(targetRect.origin.x - size.width + targetRect.size.width, targetRect.origin.y + targetRect.size.height, size.width, size.height );            break;                    case ArrowDirectionLeftAndAlignAtUp:                        drawFrame = CGRectMake(targetRect.origin.x + targetRect.size.width, targetRect.origin.y, size.width, size.height );                       break;                    case ArrowDirectionLeftAndAlignAtDown:                        drawFrame = CGRectMake(targetRect.origin.x + targetRect.size.width, targetRect.origin.y + targetRect.size.height - size.height, size.width, size.height );                      break;        case ArrowDirectionRightAndAlignAtDown:                        drawFrame = CGRectMake(targetRect.origin.x - size.width, targetRect.origin.y + targetRect.size.height - size.height, size.width, size.height );            break;                    case ArrowDirectionRightAndAlignAtUp:                       drawFrame = CGRectMake(targetRect.origin.x - size.width, targetRect.origin.y, size.width, size.height );            break;                    case ArrowDirectionDownAndAlignAtLeft:                        drawFrame = CGRectMake(targetRect.origin.x, targetRect.origin.y - size.height, size.width, size.height );            break;                    case ArrowDirectionDownAndAlignAtRight:                        drawFrame = CGRectMake(targetRect.origin.x + targetRect.size.width - size.width , targetRect.origin.y - size.height, size.width, size.height );            break;                    default:            break;    }        [self setupPopViewWithFrame:drawFrame];    }- (void)setupPopViewWithFrame:(CGRect)frame{    popView = [[UIView alloc]initWithFrame:frame];    [self addSubview:popView];    popView.backgroundColor = [UIColor clearColor];        label.translatesAutoresizingMaskIntoConstraints = NO;    imageView.translatesAutoresizingMaskIntoConstraints = NO;    imageView.backgroundColor = [UIColor blackColor];    label.numberOfLines = 0;    label.textAlignment = NSTextAlignmentCenter;    [label setBackgroundColor: [UIColor clearColor]];    font = [UIFont systemFontOfSize:17.0];    label.textColor = [UIColor colorWithRed:85/255 green:102/255 blue:119/255 alpha:1];    label.font = font;    [popView addSubview: label];    [popView addSubview:imageView];        constrainsArray = @[                        @[ @"H:|-15-[imageView(64)]-10-[label]->=20-|",@"V:|->=28-[imageView(64)]->=10-|",@"V:|-(>=28)-[label]-(>=10)-|" ],                        @[ @"H:|-15-[imageView(64)]-10-[label]->=20-|",@"V:|->=28-[imageView(64)]->=10-|",@"V:|-(>=28)-[label]-(>=10)-|" ],                        @[ @"H:|-28-[imageView(64)]-10-[label]->=20-|",@"V:|->=10-[imageView(64)]->=10-|",@"V:|-(>=10)-[label]-(>=10)-|" ],                        @[ @"H:|-28-[imageView(64)]-10-[label]->=20-|",@"V:|->=10-[imageView(64)]->=10-|",@"V:|-(>=10)-[label]-(>=10)-|" ],                        @[ @"H:|-28-[imageView(64)]-10-[label]->=20-|",@"V:|->=10-[imageView(64)]->=10-|",@"V:|-(>=10)-[label]-(>=10)-|" ],                        @[ @"H:|-28-[imageView(64)]-10-[label]->=20-|",@"V:|->=10-[imageView(64)]->=10-|",@"V:|-(>=10)-[label]-(>=10)-|" ],                        @[ @"H:|-15-[imageView(64)]-10-[label]->=20-|",@"V:|->=10-[imageView(64)]->=280-|",@"V:|-(>=10)-[label]-(>=28)-|" ],                        @[ @"H:|-15-[imageView(64)]-10-[label]->=20-|",@"V:|->=10-[imageView(64)]->=280-|",@"V:|-(>=10)-[label]-(>=28)-|" ]                        ];        [popView addConstraint:[NSLayoutConstraint constraintWithItem:label attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:imageView attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0]];}NSArray *AddHeightConstraints(UIView *target, CGFloat height, UIView *views, ...) {    NSMutableArray *cs = [NSMutableArray array];    va_list ap;    va_start(ap, views);    for (UIView *view = views; view != nil; view = va_arg(ap, UIView *)) {        [cs addObject:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:0 multiplier:1.0 constant:height]];    }    va_end(ap);    [target addConstraints:cs];    return cs;}NSArray *AddCenterYConstraints(UIView *target, UIView *views, ...) {    NSMutableArray *cs = [NSMutableArray array];    va_list ap;    va_start(ap, views);    for (UIView *view = views; view != nil; view = va_arg(ap, UIView *)) {        [cs addObject:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeCenterY relatedBy:0 toItem:target attribute:NSLayoutAttributeCenterY multiplier:1.0 constant:0]];    }    va_end(ap);    [target addConstraints:cs];    return cs;}NSArray *AddConstraints(UIView *target, NSArray *vfls, NSDictionary *metrics, NSDictionary *views) {    return AddConstraintsWithOptions(target, vfls, 0, metrics, views);}NSArray *AddConstraintsWithOptions(UIView *target, NSArray *vfls, NSLayoutFormatOptions options, NSDictionary *metrics, NSDictionary *views) {    NSMutableArray *cs = [NSMutableArray array];    for (NSString *constrain in vfls) {        [cs addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:constrain options:options metrics:metrics views:views]];    }    [target addConstraints:cs];    return cs;}- (void)drawRect:(CGRect)rect {        if (arrDir == ArrowDirectionAny) {                arrDir = [self judgeDirection:superRect];    }    [self drawLineWithDirection:arrDir];    [[UIColor colorWithRed:188/255.0 green:219/255.0 blue:210/255.0 alpha:1.0] setStroke];    [path stroke];}- (ArrowDirection)judgeDirection :(CGRect)targetSuperFrame{    ArrowDirection judgeDirection;    //2(下右左上)    if (targetRect.origin.y + targetRect.size.height + size.height <= targetSuperFrame.size.height && targetRect.origin.x + targetRect.size.width + size.width <= targetSuperFrame.size.width) {        judgeDirection = ArrowDirectionUpAndAlignAtLeft;    } else if (targetRect.origin.x + targetRect.size.width-size.width >= 0 && targetRect.origin.y + targetRect.size.height + size.height <= targetSuperFrame.size.height){       judgeDirection = ArrowDirectionUpAndAlignAtRight;    } else if ( targetRect.origin.y + targetRect.size.height>= size.height && targetSuperFrame.size.width -(targetRect.origin.x + targetRect.size.width) >= size.width) {        judgeDirection = ArrowDirectionLeftAndAlignAtDown;    } else if (targetRect.origin.y + size.height <= targetSuperFrame.size.height && targetSuperFrame.size.width -(targetRect.origin.x + targetRect.size.width) >= size.width){        judgeDirection = ArrowDirectionLeftAndAlignAtUp;    } else if (targetRect.origin.x - (size.width -targetRect.size.width) >= 0 && targetRect.origin.y - size.height >= 0){        judgeDirection = ArrowDirectionDownAndAlignAtRight;            } else if (targetRect.origin.x + size.width <= targetSuperFrame.size.width  && targetRect.origin.y - size.height >= 0){        judgeDirection = ArrowDirectionDownAndAlignAtLeft;    } else if (targetRect.origin.y + size.height <= targetSuperFrame.size.height && targetRect.origin.x - size.width >= 0 ){        judgeDirection = ArrowDirectionRightAndAlignAtDown;    } else if (targetRect.origin.y + targetRect.size.height - size.height >= 0 &&targetRect.origin.x - size.width >= 0){        judgeDirection = ArrowDirectionRightAndAlignAtUp;    }    return judgeDirection;}- (void)set_title:(NSString*)str {    label.text = str;}- (void)drawLineWithDirection:(ArrowDirection)direction {       switch (direction) {        case ArrowDirectionUpAndAlignAtLeft:            p = CGPointMake(targetRect.origin.x,targetRect.origin.y + targetRect.size.height + ArrowHight);            p.x += Radiu;            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI  endAngle:M_PI * 1.5 clockwise:YES];            p.y -= Radiu;            p.x += (DistanceWithEdge - Radiu);            [path addLineToPoint: p];            p.y -= ArrowHight;            [path addLineToPoint: p];            p.y += ArrowHight;            p.x += ArrowWidth;            [path addLineToPoint: p];            p.x += (size.width - p.x + targetRect.origin.x - Radiu);            [path addLineToPoint: p];            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI * 1.5  endAngle:0 clockwise:YES];            p.x += Radiu;            p.y += (size.height - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            p.x -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0  endAngle:M_PI_2 clockwise:YES];            p.y += Radiu;            p.x -= (size.width - 2 * Radiu);            [path addLineToPoint: p];            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2  endAngle:M_PI clockwise:YES];            p.x -= Radiu;            p.y -= (size.height - ArrowHight -2 * Radiu);            [path addLineToPoint: p];            [path closePath];                                AddConstraints(popView, constrainsArray[0], nil, NSDictionaryOfVariableBindings(imageView, label));            break;                    case ArrowDirectionUpAndAlignAtRight:            p = CGPointMake(targetRect.origin.x + targetRect.size.width,targetRect.origin.y + targetRect.size.height + ArrowHight);            p.x -= Radiu;            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0  endAngle:M_PI * 1.5 clockwise:NO];            p.y -= Radiu;            p.x -= (DistanceWithEdge - Radiu);            [path addLineToPoint: p];            p.y -= ArrowHight;            [path addLineToPoint: p];            p.x -= ArrowWidth;            p.y += ArrowHight;            [path addLineToPoint: p];            p.x = (p.x-(size.width-(DistanceWithEdge + ArrowWidth)));            p.x += Radiu;            [path addLineToPoint: p];            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI * 1.5  endAngle:M_PI clockwise:NO];            p.x -= Radiu;            p.y += (size.height - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            p.x += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI  endAngle:M_PI_2 clockwise:NO];            p.y += Radiu;            p.x += (size.width - 2 * Radiu);            [path addLineToPoint: p];            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2  endAngle:0 clockwise:NO];            p.x += Radiu;            p.y -= (size.height - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            [path closePath];                        AddConstraints(popView, constrainsArray[1], nil, NSDictionaryOfVariableBindings(imageView, label));            break;                    case ArrowDirectionLeftAndAlignAtUp:            p = CGPointMake(targetRect.origin.x + targetRect.size.width + ArrowHight,targetRect.origin.y);            p.y += Radiu;            p.x += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2 * 3  endAngle:M_PI clockwise:NO];            p.x -= Radiu;            p.y += (DistanceWithEdge - Radiu);            [path addLineToPoint: p];            p.x -= ArrowHight;            [path addLineToPoint: p];            p.x += ArrowHight;            p.y += ArrowWidth;            [path addLineToPoint: p];            p.y += (size.height - (p.y - targetRect.origin.y));            p.y -= Radiu;            [path addLineToPoint: p];            p.x += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI  endAngle:M_PI_2 clockwise:NO];            p.y += Radiu;            p.x += (size.width - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2  endAngle:0 clockwise:NO];            p.x += Radiu;            p.y -= (size.height - 2 * Radiu);            [path addLineToPoint: p];            p.x -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0  endAngle:M_PI_2 * 3 clockwise:NO];            p.y -= Radiu;            p.x -= (size.width - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            [path closePath];                        AddConstraints(popView, constrainsArray[2], nil, NSDictionaryOfVariableBindings(imageView, label));            break;                    case ArrowDirectionLeftAndAlignAtDown:            p = CGPointMake(targetRect.origin.x + targetRect.size.width + ArrowHight,targetRect.origin.y + targetRect.size.height);            p.x += Radiu;            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2  endAngle:M_PI clockwise:YES];            p.x -= Radiu;            p.y -= (DistanceWithEdge - Radiu);            [path addLineToPoint: p];            p.x -= ArrowHight;            [path addLineToPoint: p];            p.x += ArrowHight;            p.y -= ArrowWidth;            [path addLineToPoint: p];            p.y -= (size.height - (targetRect.origin.y + targetRect.size.height  - p.y));            p.y += Radiu;            [path addLineToPoint: p];            p.x += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI  endAngle:M_PI_2 * 3 clockwise:YES];            p.y -= Radiu;            p.x += (size.width - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI * 1.5  endAngle:0 clockwise:YES];            p.x += Radiu;            p.y += (size.height -2 * Radiu);            [path addLineToPoint: p];            p.x -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0 endAngle:M_PI_2  clockwise:YES];            p.y += Radiu;                        p.x -= (size.width - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            [path closePath];                    AddConstraints(popView, constrainsArray[3], nil, NSDictionaryOfVariableBindings(imageView, label));                        break;        case ArrowDirectionRightAndAlignAtDown:            p = CGPointMake(targetRect.origin.x - ArrowHight,targetRect.origin.y + targetRect.size.height);            p.y -= Radiu;            p.x -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2  endAngle:0 clockwise:NO];            p.x += Radiu;            p.y -= (DistanceWithEdge -Radiu);            [path addLineToPoint: p];            p.x += ArrowHight;            [path addLineToPoint: p];            p.x -= ArrowHight;            p.y -= ArrowWidth;            [path addLineToPoint: p];            p.y -= (size.height - (targetRect.origin.y + targetRect.size.height - p.y));            p.y += Radiu;            [path addLineToPoint: p];            p.x -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0   endAngle:M_PI_2 * 3 clockwise:NO];            p.y -= Radiu;            p.x -= (size.width - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2 * 3   endAngle:M_PI clockwise:NO];            p.x -= Radiu;            p.y += (size.height - 2 * Radiu);            [path addLineToPoint: p];            p.x += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI   endAngle:M_PI_2 clockwise:NO];            p.y += Radiu;            p.x += (size.width - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            [path closePath];                        AddConstraints(popView, constrainsArray[4], nil, NSDictionaryOfVariableBindings(imageView, label));            break;                    case ArrowDirectionRightAndAlignAtUp:            p = CGPointMake(targetRect.origin.x - ArrowHight,targetRect.origin.y);            p.x -= Radiu;            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2 * 3 endAngle:0 clockwise:YES];            p.x += Radiu;            p.y += (DistanceWithEdge - Radiu);            [path addLineToPoint: p];            p.x += ArrowHight;            [path addLineToPoint: p];            p.x -= ArrowHight;            p.y += ArrowWidth;            [path addLineToPoint: p];            p.y += size.height -(ArrowWidth+ DistanceWithEdge);            p.y -= Radiu;            [path addLineToPoint: p];            p.x -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0 endAngle:M_PI_2 clockwise:YES];            p.y += Radiu;            p.x -= (size.width - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2 endAngle:M_PI clockwise:YES];            p.x -= Radiu;            p.y -= (size.height -2 * Radiu);            [path addLineToPoint: p];            p.x += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI endAngle:M_PI_2 * 3 clockwise:YES];            p.y -= Radiu;                        p.x += (size.width- ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            [path closePath];                        AddConstraints(popView, constrainsArray[5], nil, NSDictionaryOfVariableBindings(imageView, label));            break;                    case ArrowDirectionDownAndAlignAtLeft:            p= CGPointMake(targetRect.origin.x,targetRect.origin.y - ArrowHight);            p.x += Radiu;            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI endAngle:M_PI_2 clockwise:NO];            p.y += Radiu;            p.x += (DistanceWithEdge - Radiu);            [path addLineToPoint: p];            p.y += ArrowHight;            [path addLineToPoint: p];            p.x += ArrowWidth;            p.y -= ArrowHight;            [path addLineToPoint: p];            p.x += size.width - (ArrowWidth + DistanceWithEdge + Radiu);            [path addLineToPoint: p];            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2 endAngle:0 clockwise:NO];            p.x += Radiu;            p.y -= (size.height - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];            p.x -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0 endAngle:M_PI * 1.5 clockwise:NO];            p.y -= Radiu;            p.x -= (size.width - 2 * Radiu);            [path addLineToPoint: p];            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI * 1.5  endAngle:M_PI clockwise:NO];            p.x -= Radiu;            p.y += (size.height - ArrowHight - 2 * Radiu);            [path addLineToPoint: p];                        AddConstraints(popView, constrainsArray[6], nil, NSDictionaryOfVariableBindings(imageView, label));            break;                    case ArrowDirectionDownAndAlignAtRight:            p= CGPointMake(targetRect.origin.x + targetRect.size.width,targetRect.origin.y - ArrowHight);            p.x -= Radiu;            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:0 endAngle:M_PI_2 clockwise:YES];            p.y += Radiu;            p.x -= (DistanceWithEdge - Radiu);            [path addLineToPoint: p];            p.y += ArrowHight;            [path addLineToPoint: p];            p.x -= ArrowWidth;            p.y -= ArrowHight;            [path addLineToPoint: p];            p.x -= size.width -(ArrowWidth + DistanceWithEdge + Radiu);            [path addLineToPoint: p];            p.y -= Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2 endAngle:M_PI clockwise:YES];            p.x -= Radiu;            p.y -= (size.height - ArrowHight - Radiu);            [path addLineToPoint: p];            p.x += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI endAngle:M_PI * 1.5 clockwise:YES];            p.y -= Radiu;            p.x += (size.width - 2 * Radiu);            [path addLineToPoint: p];            p.y += Radiu;            [path addArcWithCenter:p radius:Radiu startAngle:M_PI_2 * 3 endAngle:0 clockwise:YES];            p.x += Radiu;            p.y += (size.height- ArrowHight - Radiu);            [path addLineToPoint: p];                AddConstraints(popView, constrainsArray[7], nil, NSDictionaryOfVariableBindings(imageView, label));            break;                    default:            break;                }}@end

-(id) init:(UIImage*) image str:(NSString*) str   初始化该View 的时候让使用者传入图片以及字符串;

- (void)layoutSubviews   在这个方法中调用自己的代理来接收Controller 中传过来的数据,并且根据这些数据来计算处我们自己的UIView 的大小以及位置,并把里面的控件填进去,并用AutoLayout 来规划UIView 里面的布局;

- (void)drawRect:(CGRect)rect 在这个方法里面根据 targetView 的SuperView 的空间分布,对使用者选择 ArrowDirectionAny 的时候 控件应该在的位置进行确定;

- (ArrowDirection)judgeDirection :(CGRect)targetSuperFrame 传给该方法一个 Tar个rView 父控件的大小,该方法会返回使用者选择 ArrowDirectionAny 的时候 控件应该在的位置;

- (void)drawLineWithDirection:(ArrowDirection)direction 这是该 .m 文件中最重要的一个方法,我们在这里根据UIView 的大小以及位置进行绘制各个边,圆角以及箭头,在绘制各个圆角的时候要对角度进行计算,这里要特别注意的就是各个角的度数以及位置分布如下图:

下面我们就来看看如何在一个UIViewController 中使用我们自己定义的View 吧

 

////  ViewController.m//  testjiantou////  Created by WJHan on 15/12/30.//  Copyright © 2015年 avepoint. All rights reserved.//#import "ViewController.h"#import "test.h"@interface ViewController ()<WJPopViewDataSource>@end@implementation ViewController@synthesize bt;- (void)viewDidLoad {    [super viewDidLoad];    UIImage *image = [UIImage imageNamed:@"22222.png"];    test *tt = [[test alloc]init:image str:@"Please create an agenda."];    bt = [[UIButton alloc]initWithFrame:CGRectMake(200, 450, 150, 60)];    bt.backgroundColor = [UIColor greenColor];    [bt setTitle:@"创建新数据的按钮" forState:UIControlStateNormal];//    bt.translatesAutoresizingMaskIntoConstraints = NO;    tt.translatesAutoresizingMaskIntoConstraints = NO;    [self.view addSubview:tt];    tt.dataSource = self;    [self.view addSubview:bt];    AddConstraints1(self.view, @[ @"H:|[tt]|",@"V:|[tt]|"], nil, NSDictionaryOfVariableBindings(tt));    }NSArray *AddConstraints1(UIView *target, NSArray *vfls, NSDictionary *metrics, NSDictionary *views) {    return AddConstraintsWithOptions1(target, vfls, 0, metrics, views);}NSArray *AddConstraintsWithOptions1(UIView *target, NSArray *vfls, NSLayoutFormatOptions options, NSDictionary *metrics, NSDictionary *views) {    NSMutableArray *cs = [NSMutableArray array];    for (NSString *constrain in vfls) {        [cs addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:constrain options:options metrics:metrics views:views]];    }    [target addConstraints:cs];    return cs;}//#mark --dataSource-(CGRect)sourceRect:(test *)WJPopView{    return bt.frame;}-(UIView*)sourceView:(test *)WJPopView{    return bt;}-(CGSize)WJPopViewSize:(test *)WJpopView{    return CGSizeMake(395, 105);}-(ArrowDirection)popViewArrowDeriction:(test *)WJpopView{    return ArrowDirectionAny;}@end
使用就简单多了没什么可多说的,哈哈 ,下面我们看一下效果:

指向左与按钮的下边缘对齐:


指向左与按钮上边缘对齐


指向上与按钮的左边缘对齐:


指向下与按钮的左边缘对齐:


还有几种指向与对齐方式,在这里我就不一一列举了,喜欢的欢迎留言哦~


0 0
原创粉丝点击