最近刚上线二维码的支付功能
产品要求:给我照着支付宝跟微信支付抄!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
支付的话,可能会涉及一些比较隐私的东西,这篇文章不会去详细说明,本篇文章主要要说的是 二维码点击以及条形码点击的效果(已经封装好了,一拖即用)
展示一下效果图(项目只能真机,就没有截取GIF了)
--------------------------------分割线------------------------------
具体的需求:
1、点击二维码中心放大,再次点击,中心缩小至原来的尺寸
2、点击条形码,旋转横屏放大,并显示条形码编号
需求就是这样,分析一下,也不是很难,主要就是动画的东西。
1、对于二维码点击方法和缩小
①首先要考虑一下,直接放大缩小,会很难看,而且也不便于后期修改(主要怕产品又要修改)。所以,我们在放大的时候,我们可以添加一个白色的iamgeView,覆盖整个屏幕,再在这个iamgeView上面,添加一个小的imageView,用于加载二维码,这就需要传一个image进去。
(这个背景图需要加载window上面)
//当前imageview的图片
UIImage *image = currentImageview.image;
//当前视图
UIWindow *window = [UIApplication sharedApplication].keyWindow;
//背景
UIView *backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];
放大的动画
//动画放大所展示的ImageView
[UIView animateWithDuration:0.4 animations:^{
// CGFloat y,width,height;
// y = ([UIScreen mainScreen].bounds.size.height - image.size.height * [UIScreen mainScreen].bounds.size.width / image.size.width) * 0.5;
// //宽度为屏幕宽度
// width = [UIScreen mainScreen].bounds.size.width;
// //高度 根据图片宽高比设置
// height = image.size.height * [UIScreen mainScreen].bounds.size.width / image.size.width;
[imageView setFrame:CGRectMake(0, 0, oldframe.size.width * 1.2, oldframe.size.height *1.2)];
imageView.center =backgroundView.center;
//重要! 将视图显示出来
[backgroundView setAlpha:1];
} completion:^(BOOL finished) {
}];
2、条形码的思路如上,也就是动画不同,具体可以查看代码
具体的使用
#pragma mark - **************** 手势触发事件 ****************
- (void)qrTapAction {
NSLog(@"点击二维码");
[LPScanImageView scanBigImageWithImageView:self.QRCodeImgView];
}
- (void)barCodeTapAction {
NSLog(@"点击条形码");
[LPScanImageView scanBarCodeImageWithImageView:barCodeBgView barcode:self.QRCode];
}
具体代码已经贴在github上面,求start
https://github.com/bommmmmmm/LPScanImageViewAnimation.git