模拟底部弹出小菜单

本文介绍了在iOS中实现底部弹出菜单的步骤,包括创建触发事件的按钮、定义全局弹出视图、自定义视图内容以及添加取消按钮并实现动画效果。通过自定义模型方法,动态创建按钮和标签,当点击取消按钮时,使用动画效果让菜单平滑移出屏幕。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

大体思路:1、创建一个可以触发弹出事件的控件(我用的是按钮)
2、定义一个全局的视图,作为弹出视图
3、在按钮的Action中,调用创建弹出视图的方法,再调用创建按钮和文字label的方法。(我这里是把按钮和Label各自创建了模型,所以,每次创建都只需要在文件中调用它们的自定义初始化方法),然后将返回的按钮和label添加到弹出视图上显示即可。
4、创建视图中的取消按钮,调用创建取消按钮的方法,在取消按钮的Action中把弹出视图的frame改动,是移出窗口,而不是从父视图里移除,加上[UIView AnimatewithDuration: animations:{]}];会有动画的效果,效果会好看一点。
大部分代码都给出来了,前面的触发事件按钮自己创建(^__^)

#pragma mark - 创建弹出视图
- (void) createAlertView {

    //1.创建创建出视图
    _AlertView = [[UIView alloc] initWithFrame:CGRectMake(0, kScreenHeight, kScreenWidth, 170)];
    //2.设置弹出视图的动画效果
    [UIView animateWithDuration:0.3 animations:^{

        //a) 设置背景颜色
        _AlertView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"bgImage"]];
        //b) 设置frame
        _AlertView.frame = CGRectMake(0, kScreenHeight-170, kScreenWidth, 170);
        //c) 添加到视图
        [self.view addSubview:_AlertView];
    }];
}
#pragma mark - 创建按钮和标签
- (void) createButtonAndLabel {

    //1.创建图片名数组
    NSArray *imageNames = @[@"tabbar_compose_idea",@"tabbar_compose_camera",@"tabbar_compose_review",@"tabbar_compose_photo",@"tabbar_compose_lbs",@"tabbar_compose_more"];
    //2.创建标题名数组
    NSArray *titles = @[@"文字",@"相机",@"头条",@"照片",@"签到",@"更多"];
    //3.计算按钮宽度
    CGFloat width = kScreenWidth/6;
    //4.利用循环,创建按钮
    for (int i = 0; i< titles.count; i++) {

        //a) 计算按钮的frame
        CGRect frame = CGRectMake(i*width, 10, width, width);
        //b) 调用方法,按钮按钮
        showButton *button = [[showButton alloc] initWithFrame:frame withImageName:imageNames[i]];
        //c) 设置tag
        button.tag = 1000+i;
        //d) 设置圆角效果
        button.layer.cornerRadius = 30;
        //e) 设置裁剪效果
        button.layer.masksToBounds = YES;
        //f) 添加到视图
        [_AlertView addSubview:button];

        //g) 计算标签的frame
        CGRect labelFrame = CGRectMake(i*width, button.frame.size.height+5, width, 20);
        //h) 调用方法,返回按钮
        titleLabel *label = [[titleLabel alloc] initWithFrame:labelFrame withTitle:titles[i]];
        //i) 添加到视图
        [_AlertView addSubview:label];
    }
}

——按钮和标签的模型代码

@implementation showButton

-(instancetype) initWithFrame:(CGRect)frame withImageName:(NSString *)imageName {

    self = [super initWithFrame:frame];
    if (self) {

        //1.创建图片视图
        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 60, 60)];
        //2.添加图片
        imageView.image = [UIImage imageNamed:imageName];
        //3.添加到视图上
        [self addSubview:imageView];
    }

    //返回
    return self;
}

//1.自定义初始化方法
- (instancetype) initWithFrame:(CGRect)frame withTitle:title {

    self = [super initWithFrame:frame];
    if (self) {

        //a) 设置frame
        self.frame = frame;
        //b) 设置内容
        self.text = title;
        //c) 设置文字颜色
        self.textColor = [UIColor whiteColor];
        //d) 设置文字对齐方式
        self.textAlignment = NSTextAlignmentCenter;
        //e) 设置字体大小
        self.font = [UIFont systemFontOfSize:15];

    }
    return self;
}
#pragma mark - 取消按钮点击事件
- (void) cancelAction:(UIButton *) button {

    //1.移出弹窗视图
    [UIView animateWithDuration:0.3 animations:^{
        _AlertView.frame = CGRectMake(0, kScreenHeight, kScreenWidth, 170);
    }];

}

效果图:
这里写图片描述
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值