【iOS】基于Realm数据库的记账软件–记账模块（二）
- 2020 年 3 月 31 日
- 筆記
1、记账界面搭建
从记账的需求出发，该界面需要用户输入以下账单信息： （1）账单金额 （2）账单类型 （3）相关账户 （4）账单产生的日期 （5）备注 那么，结合一下需求，开始构思一下界面如何搭建吧。
记账界面
其实这个界面不难搭建，一个控制器的scrollView添加包含两个控制器的视图（一个是收入，一个是支出）。子控制器分别用CollectView布局即可。这里就不详细说明了
2、数据准备
首先，我们来看看账单类型的模型声明。
/// 账单类型模型 @interface MPCategoryModel : RLMObject /// 类别ID @property (nonatomic, copy) NSString *cateID; /// 类型名称 @property (nonatomic, copy) NSString *categoryName; /// 类型图片名 @property (nonatomic, copy) NSString *categoryImageFileName; /// 是否为收入类型 @property (nonatomic, assign) BOOL isIncome; @end RLM_ARRAY_TYPE(MPCategoryModel)
那么，对应地，我们在程序第一次启动时，从本地的plist文件读取数据，写入数据库。这样一来，我们就可以方便的从数据库进行查询了。因此在MPCategoryManager创建时，马上进行初始化操作，部分代码如下
/// MPCategoryManager.m文件 + (instancetype)shareManager { static dispatch_once_t onceToken; dispatch_once(&onceToken, ^{ instance = [[self alloc] init]; [instance setup]; }); return instance; } /** 初始化 */ - (void)setup { if([self isEmpty]) { [self loadCategoryDataFromPlist]; } }
当数据写入完毕后，通过Realm Browser可以看到数据表如下
账单类别表
3、数据查询
以isIncome为查询条件，分别查询支出，收入类型类型列表。
/** 获得收入类型列表 @return MPCategory模型数组 */ - (RLMResults *)getIncomeCategoryList { RLMResults *results = [MPCategoryModel objectsWhere:@"isIncome = YES"]; return results; } 得到以上数据后，即可进行展示了，具体展示就不详细说了。 /** 获得支出类型列表 @return MPCategory模型数组 */ - (RLMResults *)getOutcomeCategoryList { RLMResults *results = [MPCategoryModel objectsWhere:@"isIncome = NO"]; return results; }
4、选择动画效果
点击按钮后，会提取选中的图标颜色，然后从左到右进行“覆盖”，如下所示：
这里写图片描述
因此，我们的动画要分两步：
- 提取颜色
- 做"覆盖"动画
4.1、提取颜色
在这里使用了一个框架CCColorCube，通过该框架，我们可以方便的提取图标的颜色。提取方法如下：
/// 从图片提取颜色 - (UIColor *)extractColorFromImage:(UIImage *)image { CCColorCube *cube = [[CCColorCube alloc] init]; NSArray *colors = [cube extractColorsFromImage:image flags:CCAvoidBlack count:1]; // 由于我们的图标都是单色的，因此直接取第一个元素即为我们所需要的颜色 return colors.firstObject; }
4.2、覆盖动画
通过shapeLayer的动画，一开始先添加宽为“1”的线条，再设置动画，将线条的lineWidth改为屏幕宽
- (void)animationWithBgColor:(UIColor *)color { CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"lineWidth"]; animation.fromValue = @0.0; animation.toValue = @(self.bounds.size.width * 2); animation.duration = 0.3f; //* 设置填充色 */ self.bgColorlayer.fillColor = color.CGColor; //* 设置边框色 */ self.bgColorlayer.strokeColor = color.CGColor; self.previousColor = color; //* 保持动画 */ animation.removedOnCompletion = NO; animation.fillMode = kCAFillModeForwards; [self.bgColorlayer addAnimation:animation forKey:@"bgColorAnimation"]; } - (CAShapeLayer *)bgColorlayer { if(_bgColorlayer == nil) { UIBezierPath *path = [UIBezierPath bezierPath]; [path moveToPoint:self.bounds.origin]; [path addLineToPoint:CGPointMake(self.bounds.origin.x, self.bounds.size.height)]; CAShapeLayer *layer = [CAShapeLayer layer]; //* 设置路径 */ layer.path = path.CGPath; //* 设置填充色 */ layer.fillColor = [UIColor clearColor].CGColor; //* 设置边框色 */ layer.strokeColor = [UIColor clearColor].CGColor; [self.layer insertSublayer:layer atIndex:0]; self.bgColorlayer = layer; } return _bgColorlayer; }
5、数字键盘
由于数字键盘设计到了“+-=.”等操作符，所以需要判定各情况的输入，来决定输入的内容。流程图如下所示：
这里写图片描述
具体判断的过程，看项目中的代码吧，判断起来有点繁琐。
6、小结
建议从记账模块入手，这一块完成后。记账软件的基本功能就完成了，剩下的只是对写入的数据，进行操作。所以这一模块是重中之重，有不明白的可以评论或者github上issue我~
