iOS点击下拉菜单的实现（利用UITableView + UIButton）

我们在学习的过程中，可能会遇到，需要添加下拉菜单功能的时候，有的小伙伴可能一时半会想不出来怎样实现，那么我今天就来给大家分享一下我的思路。补充一句：我是利用UIButton和UITableView来实现的

先看一下效果图

左边是一个UIButton，点击前是如下效果
这里写图片描述

这是点击button后的效果
这里写图片描述

这样，就实现了点击下拉菜单的实现

我们先直接上代码，之后我在说明一下原理

ViewController.h

//
//  ViewController.h
//  下拉菜单的实现
//
//  Created by 开朗的男子 on 2018/8/10.
//  Copyright © 2018年 开朗的男子. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property(nonatomic, strong)UITableView * tableView;

@end

ViewController.m

//
//  ViewController.m
//  下拉菜单的实现
//
//  Created by 开朗的男子 on 2018/8/10.
//  Copyright © 2018年 开朗的男子. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()
<UITableViewDelegate, UITableViewDataSource>

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    //设置位置以及尺寸
    _tableView = [[UITableView alloc] initWithFrame:CGRectMake(100, 100, 130, 120) style:UITableViewStylePlain];
    //设置代理
    _tableView.delegate = self;
    _tableView.dataSource = self;
    //_tableView.backgroundColor = [UIColor redColor];
    [self.view addSubview:_tableView];

    //添加button
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    button.frame = CGRectMake(70, 100, 30, 30);
    button.backgroundColor = [UIColor yellowColor];
    [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [button setTitleColor:[UIColor blackColor] forState:UIControlStateSelected];
    [button setTitle:@"弹" forState:UIControlStateNormal];
    [button setTitle:@"收" forState:UIControlStateSelected];

    //添点击事件
    [button addTarget:self action:@selector(clickToBounce:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:button];

}

//这是按钮的点击事件
- (void)clickToBounce:(UIButton *)btn
{
    btn.selected = !btn.selected;
    if (btn.selected == YES) {
        _tableView.frame = CGRectMake(100, 100, 130, 1);
    }
    else {
        _tableView.frame = CGRectMake(100, 100, 130, 120);
    }
}
//四个分区
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 4;
}
//每个分区一个row
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 1;
}
//设置cell
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"ID"];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"ID"];
    }
    cell.backgroundColor = [UIColor orangeColor];
    cell.textLabel.font = [UIFont systemFontOfSize:12];
    cell.textLabel.text = @"UITableView";
    return cell;
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

现在我讲一下实现的思路。敲黑板，duang！duang！duang！

我们需要先设置一下tableView的尺寸，然后在它旁边添加一个按钮，在按钮被点击后，将tableView的高度设置为0或者1，这样就实现了下拉菜单的隐藏。
在再次点击之后，将高度又设置为原来的高度，这样效果又会回弹出来。是不是很简单呢？

iOS点击下拉菜单的实现（利用UITableView + UIButton）

猜你喜欢