饿了么详情页分析
分三层:
最底层:ViewController
上面包括背景视图:
- NVMRestaurantBackgroundView(灰色部分,显示头像,名称,费用,和优惠等)
- NVMRestaurantPromotionView(广播)
- View
NVMRestaurantBackgroundView
![](https://img.haomeiwen.com/i143181/50867a49718adc18.jpg)
NVMRestaurantPromotionView
![](https://img.haomeiwen.com/i143181/9184f7b5c4247e29.jpg)
View
![](https://img.haomeiwen.com/i143181/9665cc1324e7b148.jpg)
View上面包含NVMSegmentView&NVMPanGestureScrollView.
NVMSegmentView 由3个button和一个View组成
NVMPanGestureScrollView包含3个View我猜测这3个View应该是由3各对应的控制器控制的.
其中商品对应的UIView布局
NVMFoodCategoryTableView
- 颜色:
![](https://img.haomeiwen.com/i143181/8d84a5448a8e04d9.jpg)
- NVMCategoryInfoCell的组成
![](https://img.haomeiwen.com/i143181/62ba2660bcdb8731.jpg)
当选中的cell会有一个imageView
![](https://img.haomeiwen.com/i143181/50eab65a1d3b5cf1.jpg)
NVMFoodListTableView
- NVMFoodListSectionHeaderView
![](https://img.haomeiwen.com/i143181/d46c7b87ec4ff7c1.jpg)
NVMCategoryPromotionView 包含
![](https://img.haomeiwen.com/i143181/676cdb5f0f8eec87.jpg)
"特"不是一张专门的图片而是跟文本同属label
NVMFoodCell
![](https://img.haomeiwen.com/i143181/3d2f64ef68ff3351.jpg)
NVMFoodToolBar
![](https://img.haomeiwen.com/i143181/784c0456acce2686.jpg)
当如果在销售,即不显示"已售完"则点击加号按钮会显示减号按钮和数量label,左侧NVMCategoryInfoCell对应的NVMIconNumberView会显示相应的数量
![](https://img.haomeiwen.com/i143181/c899816d2753587d.jpg)
点击加号按钮之后
![](https://img.haomeiwen.com/i143181/2d3163e51d66ead3.jpg)
网友评论