本文實例為大家分享了iOS自定義View實現卡片滑動效果的具體代碼,供大家參考,具體內容如下
說明
控件基于UIView封裝完成,采用UIPanGestureRecognizer監聽自身的觸摸事件,以此處理各種滑動動畫操作。
內容之間可以循環切換,采用類似tableView加載機制,達到復用效果
效果
代碼實現
#import <UIKit/UIKit.h>@class SMSwipeView;@protocol SMSwipeDelegate <NSObject>@required//獲取顯示數據內容-(UITableViewCell*)SMSwipeGetView:(SMSwipeView*)swipe withIndex:(int)index;//獲取數據源總量-(NSInteger)SMSwipeGetTotaleNum:(SMSwipeView*)swipe;@end@interface SMSwipeView : UIView@property(nonatomic,weak)id<SMSwipeDelegate> delegate;//層疊透明方式顯示 默認NO@property(nonatomic,assign)BOOL isStackCard;//加載方法-(void)reloadData;//根據id獲取緩存的cell-(UITableViewCell*)dequeueReusableUIViewWithIdentifier:(NSString*)identifier;@end
#import "SMSwipeView.h"#define degreeTOradians(x) (M_PI * (x)/180)//childView距離父View左右的距離const int LEFT_RIGHT_MARGIN=10;//當前view距離父view的頂部的值const int TOP_MARGTIN=16;@interface SMSwipeView()//已經劃動到邊界外的一個view@property(nonatomic,weak)UITableViewCell * viewRemove;//放當前顯示的子View的數組@property(nonatomic,strong)NSMutableArray * cacheViews;//view總共的數量@property(nonatomic,assign)int totalNum;//當前的下標@property(nonatomic,assign)int nowIndex;//觸摸開始的坐標@property(nonatomic,assign)CGPoint pointStart;//上一次觸摸的坐標@property(nonatomic,assign)CGPoint pointLast;//最后一次觸摸的坐標@property(nonatomic,assign)CGPoint pointEnd;//正在顯示的cell@property(nonatomic,weak)UITableViewCell * nowCell;//下一個cell@property(nonatomic,weak)UITableViewCell * nextCell;//第三個cell@property(nonatomic,weak)UITableViewCell * thirdCell;//自身的寬度@property(nonatomic,assign)int w;//自身的高度@property(nonatomic,assign)int h;//是否是第一次執行@property(nonatomic,assign)BOOL isFirstLayoutSub;@end@implementation SMSwipeView//從xib中加載該類-(void)awakeFromNib{ [super awakeFromNib]; [self initSelf];}//直接用方法初始化-(instancetype)initWithFrame:(CGRect)frame{ self=[super initWithFrame:frame]; [self initSelf]; return self;}//進行一些自身的初始化和設置-(void)initSelf{ self.clipsToBounds=YES; self.cacheViews=[[NSMutableArray alloc]init]; //手勢識別 UIPanGestureRecognizer * pan=[[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(pan:)]; [self addGestureRecognizer:pan];}//布局subview的方法-(void)layoutSubviews{ if(!self.isFirstLayoutSub){ self.isFirstLayoutSub=YES; self.w=self.bounds.size.width; self.h=self.bounds.size.height; [self reloadData]; }}//重新加載數據方法,會再首次執行layoutSubviews的時候調用-(void)reloadData{ if (!self.delegate||![self.delegate respondsToSelector:@selector(SMSwipeGetView:withIndex:)]||![self.delegate respondsToSelector:@selector(SMSwipeGetTotaleNum:)]) { return; } self.totalNum=(int)[self.delegate SMSwipeGetTotaleNum:self]; self.viewRemove=nil; UITableViewCell * nowCell=[self.delegate SMSwipeGetView:self withIndex:self.nowIndex]; UITableViewCell * nextCell=[self.delegate SMSwipeGetView:self withIndex:self.nowIndex+1<self.totalNum?self.nowIndex+1:0]; UITableViewCell * thirdCell=[self.delegate SMSwipeGetView:self withIndex:self.nowIndex+2<self.totalNum?self.nowIndex+2:self.nowIndex+2-self.totalNum]; if (self.isStackCard) { [thirdCell setAlpha:0.3f]; [nextCell setAlpha:0.5f]; [nowCell setAlpha:1]; } [thirdCell removeFromSuperview]; thirdCell.layer.anchorPoint=CGPointMake(1, 1); thirdCell.frame=CGRectMake(LEFT_RIGHT_MARGIN*2, 0, self.w-2*2*LEFT_RIGHT_MARGIN, self.h-TOP_MARGTIN); [self addSubview:thirdCell]; self.thirdCell=thirdCell; [nextCell removeFromSuperview]; nextCell.layer.anchorPoint=CGPointMake(1, 1); nextCell.frame=CGRectMake(LEFT_RIGHT_MARGIN, TOP_MARGTIN/2*1, self.w-2*LEFT_RIGHT_MARGIN, self.h-TOP_MARGTIN); [self addSubview:nextCell]; self.nextCell=nextCell; [nowCell removeFromSuperview]; nowCell.layer.anchorPoint=CGPointMake(1, 1); nowCell.frame=CGRectMake(0, TOP_MARGTIN, self.w, self.h-TOP_MARGTIN); [self addSubview:nowCell]; self.nowCell=nowCell;}#pragma mark swipe觸摸的相關手勢處理-(void)swipe:(UISwipeGestureRecognizer*)sender{ NSLog(@"swipe");}-(void)pan:(UIPanGestureRecognizer*)sender{ CGPoint translation = [sender translationInView: self]; //CGPoint speed=[sender velocityInView:self];//獲取速度 if (sender.state==UIGestureRecognizerStateBegan) { //NSLog(@"begin"); self.pointStart=translation; self.pointLast=translation; } if (sender.state==UIGestureRecognizerStateChanged) { //NSLog(@"change"); // CGFloat xMove=translation.x-self.pointLast.x; // CGFloat yMove=translation.y-self.pointLast.y; // self.pointLast=translation; // // CGPoint center=self.nowCell.center; // self.nowCell.center=CGPointMake(center.x+xMove, center.y+yMove); CGFloat xTotalMove=translation.x-self.pointStart.x; // if (xTotalMove<0) { // self.nowCell.transform = CGAffineTransformMakeRotation(degreeTOradians(90*xTotalMove/self.w)); // self.nextCell.transform= CGAffineTransformMakeRotation(degreeTOradians(90*xTotalMove/self.w/2)); // }else{ // self.nowCell.transform = CGAffineTransformMakeRotation(degreeTOradians(0)); // self.nextCell.transform= CGAffineTransformMakeRotation(degreeTOradians(0)); // } } if (sender.state==UIGestureRecognizerStateEnded) { //NSLog(@"end"); CGFloat xTotalMove=translation.x-self.pointStart.x; if (xTotalMove<0) { [self swipeEnd]; }else{ [self swipeGoBack]; } } // NSLog(@"%@%f%@%f",@"x:",speed.x,@"y:",speed.y); //NSLog(@"%@%f%@%f",@"x:",translation.x,@"y:",translation.y);}/** * @author StoneMover, 16-12-29 14:12:33 * * @brief 獲取為顯示的cell,復用機制 * * @param identifier id標志 * * @return 返回的cell,如果緩存中沒有則返回空 */-(UITableViewCell*)dequeueReusableUIViewWithIdentifier:(NSString *)identifier{ for (UITableViewCell * cell in self.cacheViews) { if ([identifier isEqualToString:cell.reuseIdentifier]) { [self.cacheViews removeObject:cell]; return cell; } } return nil;}//滑動到下一個界面-(void)swipeEnd{ [UIView animateWithDuration:0.3 animations:^{ self.nextCell.transform= CGAffineTransformMakeRotation(degreeTOradians(0)); }]; //self.nowCell.transform= CGAffineTransformMakeRotation(degreeTOradians(0)); CGPoint center=self.nowCell.center; [UIView animateWithDuration:0.3 animations:^{ self.nowCell.center=CGPointMake(center.x-self.w, center.y); self.nowCell.transform= CGAffineTransformMakeRotation(degreeTOradians(0)); // [self.nowCell setAlpha:0.0]; } completion:^(BOOL finished) { self.nowIndex++; self.nowIndex=self.nowIndex<self.totalNum?self.nowIndex:0; if (self.viewRemove&&[self isNeedAddToCache:self.viewRemove]) { [self.cacheViews addObject:self.viewRemove]; [self.viewRemove removeFromSuperview]; } self.viewRemove=self.nowCell; //self.viewRemove.layer.anchorPoint=CGPointMake(0, 0); //self.viewRemove.transform=CGAffineTransformMakeRotation(degreeTOradians(-35)); self.nowCell=self.nextCell; self.nextCell=self.thirdCell; UITableViewCell * thirdCell=[self.delegate SMSwipeGetView:self withIndex:self.nowIndex+2<self.totalNum?(int)self.nowIndex+2:(int)self.nowIndex+2-(int)self.totalNum]; [thirdCell removeFromSuperview]; thirdCell.layer.anchorPoint=CGPointMake(1, 1); thirdCell.frame=CGRectMake(LEFT_RIGHT_MARGIN*2, 0, self.w-2*2*LEFT_RIGHT_MARGIN, self.h-TOP_MARGTIN); self.thirdCell=thirdCell; if (self.isStackCard) { [self.thirdCell setAlpha:0.3f]; [self.nextCell setAlpha:0.5f]; [self.nowCell setAlpha:1]; } [self insertSubview:thirdCell belowSubview:self.nextCell]; [UIView animateWithDuration:0.2 animations:^{ self.nowCell.frame=CGRectMake(0, TOP_MARGTIN, self.w, self.h-TOP_MARGTIN); self.nextCell.frame=CGRectMake(LEFT_RIGHT_MARGIN, TOP_MARGTIN/2*1, self.w-2*LEFT_RIGHT_MARGIN, self.h-TOP_MARGTIN); }]; }];}//滑動到上一個界面-(void)swipeGoBack{ if (!self.viewRemove) { NSLog(@"!viewRemove"); return; } if (self.nowIndex==0) { NSLog(@"!viewRemove+index"); return; } CGPoint center=self.viewRemove.center; self.nowIndex--; // if ([self isNeedAddToCache:self.thirdCell]) { // [self.cacheViews addObject:self.thirdCell]; // } [self.thirdCell removeFromSuperview]; self.thirdCell=self.nextCell; self.nextCell=self.nowCell; self.nowCell=self.viewRemove; if (self.nowIndex==0) { self.viewRemove=nil; }else{ UITableViewCell * cell=[self.delegate SMSwipeGetView:self withIndex:(int)self.nowIndex-1]; [cell removeFromSuperview]; [self insertSubview:cell aboveSubview:self.nowCell]; cell.layer.anchorPoint=CGPointMake(1, 1); cell.frame=self.viewRemove.frame; self.viewRemove=cell; } [UIView animateWithDuration:.5 animations:^{ self.nowCell.center=CGPointMake(center.x+self.w, center.y); self.nowCell.transform= CGAffineTransformMakeRotation(degreeTOradians(0)); self.nextCell.frame=CGRectMake(LEFT_RIGHT_MARGIN, TOP_MARGTIN/2*1, self.w-2*LEFT_RIGHT_MARGIN, self.h-TOP_MARGTIN); self.thirdCell.frame=CGRectMake(LEFT_RIGHT_MARGIN*2, 0, self.w-2*2*LEFT_RIGHT_MARGIN, self.h-TOP_MARGTIN); }];}//是否需要加入到緩存中去-(BOOL)isNeedAddToCache:(UITableViewCell*)cell{ for (UITableViewCell * cellIn in self.cacheViews) { if ([cellIn.reuseIdentifier isEqualToString:cell.reuseIdentifier]) { return NO; } } return YES;}@end
源碼下載 點擊查看
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。
新聞熱點
疑難解答