iOS自定義UIButton的實現

本文首發地址html

最近的項目中碰見的自定義的UIButton的狀況出現不少種。有的時候以爲要是放幾個控件一拼接也能夠達到效果。彷佛有點太low!!!因而乎就自定義本身的button了。ios

把title和image位置橫向顯示api

title和image橫向顯示.png

把till和image豎向顯示微信

豎向顯示.png

還有一些其餘的狀況就看本身心情了。(主要看項目需求了) 看自定義的button如何調用 1:效果圖1的代碼調用ide

// 中間按鈕
    TitleButton *titleButton = [TitleButton titleButton];
    
    [titleButton setImage:[UIImage imageNamed:@"navigationbar_arrow_down"] forState:UIControlStateNormal];
    [titleButton setTitle:@"北京有限公司" forState:UIControlStateNormal];
    titleButton.frame = CGRectMake(0, 0, 180, 40);
    [titleButton addTarget:self action:@selector(titleClick:) forControlEvents:UIControlEventTouchUpInside];
    self.navigationItem.titleView = titleButton;
複製代碼

2:效果圖2的代碼調用學習

SelleButton * btn = [SelleButton selleButton];
    btn.frame = CGRectMake(100, 100, 80, 100);
    [btn setTitle:@"張三" forState:UIControlStateNormal];
    //[btn setBackgroundImage:[UIImage imageNamed:@"2bj"] forState:UIControlStateHighlighted];
    [self.view addSubview:btn];
複製代碼

看代碼如何實現: 1:vc的.h文件以下spa

#import <UIKit/UIKit.h>  
@interface MarkButton : UIButton  
+ (instancetype)markButton;  
@end 
複製代碼

2:vc的.m文件以下3d

#define MarkButtonTitleW 40

#import "MarkButton.h"

@implementation MarkButton

+ (instancetype)markButton
{
    return [[self alloc] init];
}

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // 高亮的時候不要自動調整圖標
        self.adjustsImageWhenHighlighted = NO;
        self.titleLabel.font = [UIFont boldSystemFontOfSize:15];
        //self.titleLabel.textColor = [UIColor whiteColor];
        self.imageView.contentMode = UIViewContentModeCenter;
        self.titleLabel.textAlignment = NSTextAlignmentCenter;
        // 背景
        [self setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    }
    return self;
}

- (CGRect)imageRectForContentRect:(CGRect)contentRect
{
    CGFloat imageY = 0;
    CGFloat imageX = 0;
    CGFloat imageW = contentRect.size.width - MarkButtonTitleW;
    CGFloat imageH = contentRect.size.height;
    return CGRectMake(imageX, imageY, imageW, imageH);
}

- (CGRect)titleRectForContentRect:(CGRect)contentRect
{
    CGFloat titleY = 0;
    CGFloat titleW = MarkButtonTitleW;
    CGFloat titleX = contentRect.size.width - titleW;
    CGFloat titleH = contentRect.size.height;
    return CGRectMake(titleX, titleY, titleW, titleH);
}
@end
複製代碼

3:詳細介紹以下 查閱api系統官方給我咱們這幾個方法code

- (CGRect)backgroundRectForBounds:(CGRect)bounds;
- (CGRect)contentRectForBounds:(CGRect)bounds;
- (CGRect)titleRectForContentRect:(CGRect)contentRect;
- (CGRect)imageRectForContentRect:(CGRect)contentRect;
複製代碼

3.1重寫Button的Titleorm

- (CGRect)titleRectForContentRect:(CGRect)contentRect;  
複製代碼

這裏的contentRect就是你當前在使用自定義Button的title 的width和height。咱們重寫這個方法,能夠讓button的title的位置變換位置和改變大小。 3.2 重寫Button的Image

- (CGRect)imageRectForContentRect:(CGRect)contentRect;
複製代碼

這裏的contentRect就是你當前在使用自定義Button的image的width和height。咱們重寫這個方法,能夠讓button的image的位置變換和改變大小。

3.3 剩下的兩個方法就看各位了。 (提升裝逼能力!!!)

若有問題可添加個人QQ:1290925041 還可添加QQ羣:234812704(洲洲哥) 歡迎各位一塊學習,提升逼格! 也能夠添加洲洲哥的微信公衆號 添加微信公衆號最快最好的收聽

qrcode_for_gh_30975e020db5_258.jpg
相關文章
相關標籤/搜索