iOS视图边框的简单做法

我们绘制UI界面的时候，一般我们做边框是用layer，然后再给它上面添加阴影什么的，我比较喜欢用下面这个方法，

UI弄几张边框的图片，用代码给图片拉伸

- (UIImage *)changeBorderImage:(UIImage *)borderImage {
    UIImage *image = borderImage;
    CGFloat top = 2; // 顶端盖高度
    CGFloat bottom = 2 ; // 底端盖高度
    CGFloat left = 2; // 左端盖宽度
    CGFloat right = 2; // 右端盖宽度
    UIEdgeInsets insets = UIEdgeInsetsMake(top, left, bottom, right);
    // 指定为拉伸模式，伸缩后重新赋值
    image = [image resizableImageWithCapInsets:insets resizingMode:UIImageResizingModeStretch];
    return image;
}

自定义一个边框视图或者在你的视图下面添加一个带有拉伸后的UIImage的UIImageView就行了

全部代码:

BorderView.h

//
//  BorderView.h
//  border_creat
//
//  Created by 谭启宏 on 15/12/15.
//  Copyright © 2015年 谭启宏. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface BorderView : UIImageView

@property (nonatomic,strong)UIImage *borderImage;

- (instancetype)initWithFrame:(CGRect)frame borderImage:(UIImage *)borderImage;

@end

BorderView.m

//
//  BorderView.m
//  border_creat
//
//  Created by 谭启宏 on 15/12/15.
//  Copyright © 2015年 谭启宏. All rights reserved.
//

#import "BorderView.h"

@implementation BorderView

- (instancetype)initWithFrame:(CGRect)frame borderImage:(UIImage *)borderImage {
    self  =[super initWithFrame:frame];
    if (self) {
        self.image = [self changeBorderImage:borderImage];
        
    }
    return self;
}


- (void)setBorderImage:(UIImage *)borderImage {
    self.borderImage = [self changeBorderImage:borderImage];
}

- (UIImage *)changeBorderImage:(UIImage *)borderImage {
    UIImage *image = borderImage;
    CGFloat top = 2; // 顶端盖高度
    CGFloat bottom = 2 ; // 底端盖高度
    CGFloat left = 2; // 左端盖宽度
    CGFloat right = 2; // 右端盖宽度
    UIEdgeInsets insets = UIEdgeInsetsMake(top, left, bottom, right);
    // 指定为拉伸模式，伸缩后重新赋值
    image = [image resizableImageWithCapInsets:insets resizingMode:UIImageResizingModeStretch];
    return image;
}

@end

ViewController.m

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    BorderView *borderView = [[BorderView alloc]initWithFrame:CGRectMake(100, 100, 100, 50) borderImage:[UIImage imageNamed:@"tool_biankuang2"]];
    [self.view addSubview:borderView];
    
    
    BorderView *borderView1 = [[BorderView alloc]initWithFrame:CGRectMake(100, 200, 150, 100) borderImage:[UIImage imageNamed:@"tool_biankuang2"]];
    [self.view addSubview:borderView1];
    
    BorderView *borderView2 = [[BorderView alloc]initWithFrame:CGRectMake(100, 350, 30, 100) borderImage:[UIImage imageNamed:@"tool_biankuang"]];
    [self.view addSubview:borderView2];
    
}

效果图:

demo地址：http://pan.baidu.com/s/1dEpedBr

tips:图片只需要上下左右距离边部有几象数，中间空一部分就行了