美团外卖弹框实现
效果图:
先创建一个弹窗view和一个挡板view
//构造方法传入购物车数据和初始的高度
+(instancetype)show:(NSMutableArray*)foodArray
{
PopView*menu = [[PopViewalloc]init];
menu.userInteractionEnabled=YES;
//传递数据
menu.foodArray= foodArray;
menu.backgroundColor= [UIColorclearColor];
//给一个初始的位置(屏幕下面)
menu.frame=CGRectMake(0,kScreenSize.height,kScreenSize.width,300);
//根据购物车数据给出初始的弹框高度。(在viewHeight的set方法中写动画方法)
menu.viewHeight= foodArray.count*40+140;
return menu;
}
viewHeight的set方法
-(void)setViewHeight:(CGFloat)viewHeight
{
[UIViewanimateWithDuration:0.25animations:^{
self.frame=CGRectMake(0,kScreenSize.height-viewHeight-50,kScreenSize.width, viewHeight+40);
}completion:^(BOOLfinished) {
_viewHeight= viewHeight;
}];
}
弹窗放到keyWindow上所以可以写一个类方法来移除弹窗
+(void)hideAll
{
for(UIView*viewinkWindow.subviews) {
if([viewisKindOfClass:[STANCoverViewclass]]) {
[viewremoveFromSuperview];
}
if([viewisKindOfClass:[PopViewclass]]) {
[UIViewanimateWithDuration:0.25animations:^{
view.frame=CGRectMake(0,kScreenSize.height,kScreenSize.width, view.height);
}completion:^(BOOLfinished) {
[viewremoveFromSuperview];
}];
}
}
}
弹窗View的内容
-(void)contentViewWithCV:(UIView*)contextView
{
[_contentView removeFromSuperview];
_contentView= contextView;
_contentView.backgroundColor= [UIColorclearColor];
[selfaddSubview:_contentView];
}
-(void)layoutSubviews
{
[_contentView mas_makeConstraints:^(MASConstraintMaker*make) {
make.top.left.equalTo(self);
make.right.bottom.equalTo(self);
}];
}
挡板View构造方法
+(instancetype)show
{
STANCoverView*coverView = [[STANCoverViewalloc]initWithFrame:[UIScreenmainScreen].bounds];
coverView.backgroundColor= [UIColorclearColor];
returncoverView;
}
挡板的点击事件
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent*)event
{
[selfremoveFromSuperview];
if([_delegaterespondsToSelector:@selector(coverDidClick:)]) {
[_delegatecoverDidClick:self];
}
}
让PopView遵守挡板的代理,使得挡板被点击的时候,隐藏PopView
-(void)coverDidClick:(STANCoverView*)coverView
{
[PopViewhideAll];
}
自定义tableview和cell
数据传值逻辑
功能点1:点击加号或者减号更新数据
点击按钮后发送一个通知告知需要刷新的view进行刷新操作
在自定义的tableview中接受通知并更新tableview
在商家控制器中接收通知并更新RightTableview和购物车数据
功能点2:购物车动画
在购物车View中写一个BOOL属性并实现其set方法
每次弹框或者收回时,给该属性赋值就可以了
功能点3:商品数量减少到0时,控制器高度减小并且往下移
在点击加号减号按钮的代理方法中实现:当模型中的count减为0的时候,需要让自身控制器的高度下降,所以发送一个通知。
在弹框view中接收通知并且改变自身的高度
功能点4:点击清空按钮,清空数据并让控制器收回
在自定义headerView中加一个清空的按钮