欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

iOS开发-UI高级 选中按钮的实现方法总结

程序员文章站 2022-04-27 19:16:14
方法一: UIView的类目:   -(void)setCenterX:(CGFloat)centerX{ CGPoint center = self...

方法一:

UIView的类目:

 

-(void)setCenterX:(CGFloat)centerX{
    CGPoint center = self.center;
    center.x = centerX;
    self.center = center;
}

-(void)setCenterY:(CGFloat)centerY{
    CGPoint center = self.center;
    center.y = centerY;
    self.center = center;
}

-(CGFloat)centerX{
    return self.center.x;
}

-(CGFloat)centerY{
    return self.center.y;
}


设置按钮:

 

 

#import "ViewController.h"

@interface ViewController ()
// 下标指示视图属性
@property(nonatomic,strong)UIView *suffixView;
// 选中按钮属性
@property(nonatomic,strong)UIButton *selectedBtn;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // 数组的设置
    NSArray *titleArray = @[@"全部",@"视频",@"娱乐",@"图片",@"新闻"];
    CGFloat titleBtnX = self.view.frame.size.width/5;
    CGFloat titleBtnY = 64;
    CGFloat titleBtnWidth = self.view.frame.size.width/5;
    CGFloat titleBtnHeight = 35;
    for (int i = 0; i < 5; i++) {
        // titleBtn的初始化
        UIButton *titleBtn = [UIButton buttonWithType:UIButtonTypeCustom];
        // titleBtn的frame设置
        titleBtn.frame = CGRectMake(titleBtnX * i, titleBtnY, titleBtnWidth, titleBtnHeight);
        // 设置titleBtn按钮的标题
        [titleBtn setTitle:titleArray[i] forState:UIControlStateNormal];
        // 正常状态的标题颜色
        [titleBtn setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];
        // 不能使用(选中)状态的标题颜色
        [titleBtn setTitleColor:[UIColor redColor] forState:UIControlStateDisabled];
        // 按钮的字体大小设置
        titleBtn.titleLabel.font = [UIFont systemFontOfSize:14];
        [titleBtn addTarget:self action:@selector(titleBtnAction:) forControlEvents:UIControlEventTouchUpInside];
        // 添加到self.view
        [self.view addSubview:titleBtn];
        
        // 默认选中第一个按钮
        if (i == 0) {
        
            titleBtn.enabled = NO;
            self.selectedBtn = titleBtn;
            // 按钮大小自适应
            [titleBtn.titleLabel sizeToFit];
            // 下标视图的中心点和按钮的中心点一样
            self.suffixView.width = titleBtn.titleLabel.width;
            self.suffixView.frame.center.x = titleBtn.center.x;
        }
    }  
}

 

// 标题按钮的响应事件
#pragma mark - 标题按钮的响应事件
-(void)titleBtnAction:(UIButton *)button{
    // 切换按钮的选中状态
    self.selectedBtn.enabled = YES;
    button.enabled = NO;
    self.selectedBtn = button;
    // 下标指示视图的移动
    [UIView animateWithDuration:0.2 animations:^{
        self.suffixView.width = button.titleLabel.width;
        self.suffixView.center = button.center;
    }];
    
}

方法二:

 

 

- (void)customTabBar{
    // 标题数组
    NSArray *titles = @[@"首页",@"新闻",@"Top",@"影院",@"更多"];
    // 图片数组
    NSArray *imageNames =@[@"movie_home",@"msg_new",@"start_top250",@"icon_cinema",@"more_setting"];
    // 按钮的宽度
    float buttonWidth = [UIScreen mainScreen].bounds.size.width/titles.count;
    // 选中图片初始化
    selectImageV = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 50, 50)];
    selectImageV.image = [UIImage imageNamed:@"selectTabbar_bg_all"];
    // 添加到self.tabBar
    [self.tabBar addSubview:selectImageV];
    // 循环添加按钮标题和图片
    for (int i = 0; i < titles.count; i++) {
        NSString *title = titles[i];
        NSString *imageName = imageNames[i];
        CGRect frame = CGRectMake(i*buttonWidth, 0, buttonWidth, 49);
        // 初始化按钮
        TabBarButton *button = [[TabBarButton alloc] initWithFrame:frame withImageName:imageName withTitle:title];
        // 设置tag值
        button.tag = 1000 + i;
        // 按钮的响应事件
        [button addTarget:self
                   action:@selector(buttonAction:)
         forControlEvents:UIControlEventTouchUpInside];
        // 默认选中第一个按钮
        if (i == 0) {
            selectImageV.center = button.center;
        }
        // 添加到self.tabBar
        [self.tabBar addSubview:button];
        
    }
}

#pragma mark - 按钮的响应事件
- (void) buttonAction: (UIButton *)btn {
    // 选中按钮的下标
    self.selectedIndex = btn.tag - 1000;
    // 选中图片的中心点等于选中按钮的中心点
    [UIView animateWithDuration:0.3 animations:^{
        selectImageV.center = btn.center;
    }];
}

注意:这里只总结了两种常用方法