iOS 页面切换 && 下拉菜单

2018-01-19  本文已影响0人  您079

在 AppDelegate.m 中导入头文件

#import "ViewController.h"

设置导航条更改主窗口

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    
    // 更改主窗口
    self.window.rootViewController = [[UINavigationController alloc] initWithRootViewController:[[ViewController alloc] init]];
    
    return YES;
}

在 ViewController.m中做以下操作
设置tableView和scrollView的协议

<UIScrollViewDelegate, UITableViewDelegate, UITableViewDataSource>
// 定义全局成员变量
{
    UIScrollView *topScrollView; // 顶部滚动视图
    UITableView *smallTableView; // 下拉菜单tableView
    UIButton *plusBtn;  // "+"号按钮
    UIScrollView *mainScrollView; // 内容部分的大滚动视图
}

便于使用,定义两个宏,获取视图的宽度和高度

// 屏幕的宽
#define VIEW_WIDTH [UIScreen mainScreen].bounds.size.width
// 屏幕的高
#define VIEW_HEIGHT [UIScreen mainScreen].bounds.size.height
- (void)viewDidLoad {
    [super viewDidLoad];
    
    // 标题
    self.title = @"列表";
    // 视图的背景颜色
    self.view.backgroundColor = [UIColor whiteColor];
    
    // 调用头部视图方法
    [self createTopView];
    
    // 调用内容部分大滚动视图方法
    [self createMainScrollView];
    
    
    // 创建表格
    smallTableView = [[UITableView alloc] initWithFrame:CGRectMake(VIEW_WIDTH - 20, 64 + 50, 0.1, 0.1) style:UITableViewStylePlain];
    smallTableView.delegate = self;
    smallTableView.dataSource = self;
    smallTableView.rowHeight = 60;
    [self.view addSubview:smallTableView];
    
}

头部视图的自定义方法

// 创建头部视图
-(void)createTopView
{
    // 创建头部滚动视图
    topScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 64, VIEW_WIDTH - 50, 50)];
    topScrollView.backgroundColor = [UIColor colorWithRed:(245/255.0) green:(245/255.0) blue:(245/255.0) alpha:(245/255.0)];
    [self.view addSubview:topScrollView];
    // 设置滚动范围
    topScrollView.contentSize = CGSizeMake(VIEW_WIDTH + VIEW_WIDTH / 5, 0);
    topScrollView.showsHorizontalScrollIndicator = NO;
    
    // 创建按钮数组
    NSArray *topBtnArr = @[@"第一第一",@"第二",@"第三",@"第四",@"第五",@"第六"];
    // for 循环加入按钮
    for (int i = 0; i < topBtnArr.count; i ++) {
        
        UIButton *topBtn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
        topBtn.frame = CGRectMake(VIEW_WIDTH / 5 * i, 0, VIEW_WIDTH / 5, 50);
        [topBtn setTitle:topBtnArr[i] forState:UIControlStateNormal];
        [topBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        topBtn.titleLabel.font = [UIFont systemFontOfSize:18];
        if (i == 0) {
            
            [topBtn setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
        }else{
            [topBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        }
        [topBtn addTarget:self action:@selector(didClickTopBtn:) forControlEvents:UIControlEventTouchUpInside];
        topBtn.tag = 1000 + i;
        [topScrollView addSubview:topBtn];
    }
    
    // 创建 "+" 按钮
    plusBtn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    plusBtn.frame = CGRectMake(VIEW_WIDTH - 50, 64, 50, 50);
    [plusBtn setTitle:@"+" forState:UIControlStateNormal];
    [plusBtn setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
    plusBtn.titleLabel.font = [UIFont systemFontOfSize:20];
    [plusBtn addTarget:self action:@selector(didClickTopPlusBtn:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:plusBtn];
    
}
// 头部按钮的点击事件
-(void)didClickTopBtn:(UIButton *)sender
{
    // 改变按钮的标题颜色
    for (int i = 0; i < 6 ; i ++) {
        
        UIButton *topBtn1 = [self.view viewWithTag:1000 + i];
        if (sender.tag == topBtn1.tag) {
            
            [topBtn1 setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
        }else{
            [topBtn1 setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        }
    }
    
    // 改变滚动视图的位置
    mainScrollView.contentOffset = CGPointMake((sender.tag - 1000) * VIEW_WIDTH, 0);
    
}
// + 点击事件
-(void)didClickTopPlusBtn:(UIButton *)sender
{
    if (sender.selected == NO) {
        
        sender.selected = YES;
        [UIView animateWithDuration:0.3 animations:^{
            smallTableView.frame = CGRectMake(VIEW_WIDTH / 5 * 3, 64 + 50, VIEW_WIDTH / 5 * 2 - 7, 180);
        }];
        
    }else if (sender.selected == YES){
        sender.selected = NO;
        [UIView animateWithDuration:0.3 animations:^{
            smallTableView.frame = CGRectMake(VIEW_WIDTH - 20, 64 + 50, 0.1, 0.1);
        }];

    }
}

创建内容部分的大滚动视图的自定义方法

// 创建内容部分滚动视图方法
-(void)createMainScrollView
{
    // 创建大的滚动视图
    mainScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 64 + 50, VIEW_WIDTH, VIEW_HEIGHT - 64 - 50)];
    mainScrollView.delegate = self;
    mainScrollView.backgroundColor = [UIColor redColor];
    [self.view addSubview:mainScrollView];
    // 设置滚动范围
    mainScrollView.contentSize = CGSizeMake(VIEW_WIDTH * 6, 0);
    mainScrollView.pagingEnabled = YES;
    // for 循环在滚动视图上添加视图
    for (int i = 0; i < 6; i ++) {
        
        // 创建视图
        UIView *mainView = [[UIView alloc] initWithFrame:CGRectMake(VIEW_WIDTH * i, 0, VIEW_WIDTH, VIEW_HEIGHT - 64 - 50)];
        // 设置视图的背景颜色为随机颜色
        mainView.backgroundColor = [UIColor colorWithRed:((float)arc4random_uniform(256) / 255.0)green:((float)arc4random_uniform(256) / 255.0)blue:((float)arc4random_uniform(256) / 255.0)alpha:1.0];
        [mainScrollView addSubview:mainView];
    }
}

表格的数据源方法

// 数据源
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 3;
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *reuseID = @"cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:reuseID];
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:reuseID];
    }
    
    // 创建表格内容数组
    NSArray *cellArr = @[@"确认添加",@"确认删除",@"关闭"];
    cell.textLabel.text = cellArr[indexPath.row];
    cell.backgroundColor = [UIColor grayColor];
    cell.textLabel.textColor = [UIColor whiteColor];
    
    return cell;
}

点击表格单元格

// 表格的点击事件
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (indexPath.row == 0) {
        
        UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"确认添加" message:@"操作已完成" preferredStyle:UIAlertControllerStyleAlert];
        UIAlertAction *action = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
            
        }];
        [alert addAction:action];
        [self presentViewController:alert animated:YES completion:nil];
    }else if (indexPath.row == 2){
        
        plusBtn.selected = NO;
//        smallTableView.hidden = YES;
        [UIView animateWithDuration:0.3 animations:^{
            smallTableView.frame = CGRectMake(VIEW_WIDTH-10, 64 + 50, 0.1, 0.1);
        }];
    }
}

滚动视图的代理方法 - 设置按钮与滚动视图反关联

// 滚动视图的代理方法
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    // 按钮与滚动视图相关联
    for (int i = 0; i < 6; i ++) {
        
        UIButton *topBtn = [self.view viewWithTag:1000 + i];
        if (scrollView.contentOffset.x / VIEW_WIDTH == topBtn.tag - 1000) {
            
            [topBtn setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
        }else{
            [topBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        }
    }
}
上一篇下一篇

猜你喜欢

热点阅读