iOS之商城应用中物品属性选择+购物车功能+订单确认

本实例直接从当前项目中拉出来,实现的功能简单,但是在自己实现的时候用的代码老多多,而且当前只接收两组属性,不过属性实现了自动向下布局,超出屏幕可以上下滑动,但封装性不强,希望得到牛人指点。
下面简单介绍实现方法。


1.购物车属性选择功能

购物属性选择.gif
  • 获取物品属性信息,并将数据直接转换为模型数据。
/**
 *  获取 商品属性 数据
 */
- (void)getGoodAttrData {
    NSString *URL = [NSString stringWithFormat:@"%@/App/Sylm/yclist",SERVERURL];
    NSMutableDictionary *paramas = [NSMutableDictionary dictionary];
    paramas[@"method"] = @"goods_attr";
    paramas[@"goods_id"] = @"11";
    [LXHttpTool post:URL params:paramas success:^(id json) {
        NSLog(@"%@", json);
        NSInteger status = [json[@"status"] integerValue];
        if (status == 1) {
            NSArray *goodAttrsArr = [GoodAttrModel mj_objectArrayWithKeyValuesArray:json[@"data"]];
            self.goodAttrsArr = goodAttrsArr;      
        } else {
            [SVProgressHUD showErrorWithStatus:@"暂无商品属性" maskType:SVProgressHUDMaskTypeGradient];
        }
    } failure:^(NSError *error) {
        [SVProgressHUD showErrorWithStatus:@"请重新加载" maskType:SVProgressHUDMaskTypeGradient];
        NSLog(@"%@", error);
    }];
}
  • 传递数据模型,生成相应的物品属性按钮,其中主要用到的是for循环实现对按钮的布局。代码如下:
NSArray *attrValueArr0 = ((GoodAttrModel *)goodAttrsArr[0]).attr_value;
CGFloat one_btnsX = kBigMargin;
CGFloat one_btnY = CGRectGetMaxY(_firstAttributeLbl.frame) + kSmallMargin;
for (int i = 0; i < attrValueArr0.count ; i++) {
    NSString *btnTittle = ((GoodAttrValueModel *)attrValueArr0[i]).attr_value;
    CGSize size = [btnTittle sizeWithAttributes:[NSDictionary dictionaryWithObjectsAndKeys:kButtonTextFont, NSFontAttributeName, nil]];
    UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
    [btn setTitle:btnTittle forState:UIControlStateNormal];
    btn.titleLabel.font=[UIFont boldSystemFontOfSize:13];
    btn.tag = i;
    [btn addTarget:self action:@selector(attrs1BtnClick:) forControlEvents:UIControlEventTouchUpInside];
    btn.frame = CGRectMake(one_btnsX, one_btnY, size.width + 30, 35);
    one_btnsX += kBigMargin + size.width + kBigMargin;

    while (one_btnsX  > kScreenW) {
        one_btnsX = kBigMargin;
        one_btnY += 45;
        if ((one_btnsX + size.width + 30) > kScreenW) {
            one_btnsX = kBigMargin;
            break;
        }
        btn.frame = CGRectMake(one_btnsX, one_btnY, size.width + 30, 35);
        one_btnsX += 15 + size.width + kBigMargin;
    }
    [btn defaultStyleWithNormalTitleColor:HX_RGB(136, 137, 138) andHighTitleColor:kWhiteColor andBorderColor:LXBorderColor andBackgroundColor:kWhiteColor andHighBgColor:kMAINCOLOR andSelectedBgColor:kMAINCOLOR withcornerRadius:2];
    [self.scrollView addSubview:btn];
    [self.firstBtnsArr addObject:btn];
}
  • 通过Block来传递选中的属性,如下:
@property (nonatomic, copy) void (^sureBtnsClick)(NSString *num, NSString *attr_id, NSString *goods_attr_value_1, NSString *goods_attr_value_2);

#pragma mark - 按钮点击事件
- (void)sureBtnClick {
    // 购买数量
    NSString *num = self.buyNumsLbl.text;
    // 属性ID str
    NSString *attr_id1 = [NSString stringWithFormat:@"%@-%@", _goods_attr_1, _goods_attr_value_1];
    NSString *attr_id2 = [NSString stringWithFormat:@"%@-%@", _goods_attr_2, _goods_attr_value_2];
    NSString *attr_id = [NSString stringWithFormat:@"%@|%@", attr_id1, attr_id2];
    if (self.sureBtnsClick) {
        self.sureBtnsClick(num, attr_id, self.goods_attr_value_1, self.goods_attr_value_2);
    }
    [self removeView];
}

2.购物车功能

  • 选择,删除(+滑动删除)和收藏功能
    其中大部分通过block来实现,涉及的逻辑有些绕,好乱,不过功能还是实现了。效果如下图:


    购物车功能演示

3.订单确认页面

  • 实现购物车选定商品之后,进入订单确认支付页面。
  • 有三种支付方式:支付宝、微信和银联。
  • 收货地址选择(未完成)。
    效果图如下:


    订单确认

小结:回头研究下用SDAutoLayout来实现此种自动布局,最近一直在体验此框架。
令附上Demo地址--->传送门[Github],注:在此感谢朋友的阅读。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,075评论 25 708
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,200评论 4 61
  • 梦境中的一切是那么可怕,陌生的地方,陌生的事物,跟随着风在轻轻摇摆,发出微弱的声响,我独自一人走在这之中,莫名其...
    墨灬篱阅读 245评论 5 2
  • 今天找朋友聊天,感触很多。 恰好我正在作选择,进退失据,颇有些惆怅。于是问他该怎么看待选择工作的问题: 第一份工作...
    牛爸爱学习阅读 997评论 7 3
  • 这两天一直在体会陈默老师说了正确的父母观念第一条:养育、养育,养在先这句话的意思。也结合《弟子规》传承的以孝入道的...
    和顺顺阅读 263评论 0 0