十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
前言:可能很多iOS开发者在学习之初都会对QQ的主界面的左滑与右滑动感到好奇,今天开始写我人生中的第一篇博客,即:iOS开发之Slide(主界面侧滑侧边栏)。
成都创新互联公司专注于淮安区企业网站建设,响应式网站设计,商城系统网站开发。淮安区网站建设公司,为淮安区等地区提供建站服务。全流程按需网站设计,专业设计,全程项目跟踪,成都创新互联公司专业和态度为您提供的服务
正文:
首先,新建类(HomeViewController:命名随自己)继承ViewController。
然后我们需要声明这些属性:
//滑动速度系数-建议在0.5-1之间。默认为0.5
@property (nonatomic,assign)CGFloat speedf;
//左侧窗控制器
@property (nonatomic,strong)UIViewController *leftVC;
//右侧滑框控制器
@property (nonatomic,strong)UIViewController *rightVC;
@property (nonatomic,strong)UIViewController *mainVC;
//点击手势控制器,是否允许点击视图恢复视图位置。默认为yes
@property (nonatomic,strong)UITapGestureRecognizer *sideslipTapGes;
//滑动手势控制器
@property (nonatomic,strong)UIPanGestureRecognizer *pan;
//侧滑窗是否关闭(关闭时显示为主页)
@property (nonatomic,assign)BOOL closed;
以及下列方法:
-(instancetype)initWithLeftView:(UIViewController *)leftVC withMainview:(UIViewController *)mainVC withRightVC:(UIViewController *)rightVC;
/**
@brief 关闭左视图
*/
- (void)closeLeftView;
-(void)closeZPFLeftView;
/**
@brief 打开左视图
*/
- (void)openLeftView;
-(void)showZPFleftView;
-(void)showZPFrightView;
-(void)showZPFmainView;
/**
* 设置滑动开关是否开启
*
* @param enabled YES:支持滑动手势,NO:不支持滑动手势
*/
- (void)setPanEnabled: (BOOL) enabled;
然后在.m文件中我们进行接下来的操作:
@interfaceLeftSlideViewController ()
{
CGFloat _scalef; //实时横向位移
}
@property (nonatomic,strong)UITableView *leftTableview;
@property (nonatomic,assign)CGFloat leftTableviewW;
@property (nonatomic,strong)UIView *contentView;
@property (nonatomic,strong)UIView *rightView;
@end
以及实现我们在.h文件中声明的方法:
-(instancetype)initWithLeftView:(UIViewController *)leftVC withMainview:(UIViewController *)mainVC withRightVC:(UIViewController *)rightVC {
if (self = [super init]) {
self.speedf = vSpeedFloat;
self.leftVC = leftVC;
self.mainVC = mainVC;
self.rightVC = rightVC;
//滑动手势
self.pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(ZPFhandlePan:)];
[self.mainVC.viewaddGestureRecognizer:self.pan];
[self.pansetCancelsTouchesInView:YES];
self.pan.delegate = self;
self.leftVC.view.hidden = YES;
self.rightVC.view.hidden = YES;
[self.view addSubview:self.leftVC.view];
[self.view addSubview:self.rightVC.view];
[self.view addSubview:self.mainVC.view];
}
returnself;
}
#pragma mark -- ZPF左右侧滑
-(void)ZPFhandlePan:(UIPanGestureRecognizer *)rec{
CGPoint point = [rec translationInView:self.view];
_scalef = (point.x*_speedf+_scalef);
//根据视图位置判断是左滑还是右边滑动
if (rec.view.frame.origin.x>=0) {
rec.view.center = CGPointMake(rec.view.center.x+_speedf*point.x,rec.view.center.y );
rec.view.transform =CGAffineTransformScale(CGAffineTransformIdentity,1-_scalef/1000,1-_scalef/1000);
[recsetTranslation:CGPointMake(0,0)inView:self.view];
self.leftVC.view.hidden = NO;
self.rightVC.view.hidden = YES;
}else {
rec.view.center = CGPointMake(rec.view.center.x + point.x*_speedf,rec.view.center.y);
rec.view.transform =CGAffineTransformScale(CGAffineTransformIdentity,1+_scalef/1000,1+_scalef/1000);
[recsetTranslation:CGPointMake(0,0)inView:self.view];
self.rightVC.view.hidden = NO;
self.leftVC.view.hidden = YES;
}
//手势结束后修正位置
if (rec.state ==UIGestureRecognizerStateEnded) {
if (_scalef>140*_speedf) {
[self showZPFleftView];
}else if (_scalef<-140*_speedf){
[self showZPFrightView];
}else{
[self showZPFmainView];
_scalef = 0;
}
}
}
#pragma mark -- 单击手势
-(void)handleZPFTap:(UITapGestureRecognizer *)tap {
if (tap.state ==UIGestureRecognizerStateEnded) {
[UIViewbeginAnimations:nilcontext:nil];
tap.view.transform =CGAffineTransformScale(CGAffineTransformIdentity,1.0,1.0);
tap.view.center =CGPointMake([UIScreenmainScreen].bounds.size.width/2,[UIScreenmainScreen].bounds.size.height/2);
[UIViewcommitAnimations];
_scalef = 0;
}
}
#pragma mark -- 修改视图位置
//恢复位置
-(void)showZPFmainView {
[UIViewbeginAnimations:nilcontext:nil];
self.mainVC.view.transform =CGAffineTransformScale(CGAffineTransformIdentity,1.0,1.0);
self.mainVC.view.center =CGPointMake([UIScreenmainScreen].bounds.size.width/2,[UIScreenmainScreen].bounds.size.height/2);
[UIViewcommitAnimations];
}
//显示左视图
-(void)showZPFleftView {
[UIViewbeginAnimations:nilcontext:nil];
self.mainVC.view.transform =CGAffineTransformScale(CGAffineTransformIdentity,0.8,0.8);
self.mainVC.view.center =CGPointMake(340,[UIScreenmainScreen].bounds.size.height/2);
self.rightVC.view.hidden = YES;
self.leftVC.view.hidden = NO;
[UIViewcommitAnimations];
}
//显示右视图
-(void)showZPFrightView {
[UIViewbeginAnimations:nilcontext:nil];
self.mainVC.view.transform =CGAffineTransformScale(CGAffineTransformIdentity,0.8,0.8);
self.mainVC.view.center =CGPointMake(self.view.frame.size.width*0.4,[UIScreenmainScreen].bounds.size.height/2);
self.rightVC.view.hidden = NO;
self.leftVC.view.hidden = YES;
[UIViewcommitAnimations];
}
#pragma mark -- 隐藏左视图
-(void)closeZPFLeftView {
[UIViewbeginAnimations:nilcontext:nil];
self.mainVC.view.transform =CGAffineTransformScale(CGAffineTransformIdentity,1.0,1.0);
self.mainVC.view.center =CGPointMake(kScreenWidth /2,kScreenHeight /2);
self.closed = YES;
self.leftTableview.center =CGPointMake(kLeftCenterX,kScreenHeight *0.5);
self.leftTableview.transform =CGAffineTransformScale(CGAffineTransformIdentity,kLeftScale,kLeftScale);
self.contentView.alpha =kLeftAlpha;
[UIViewcommitAnimations];
[selfremoveSingleTap];
}
#pragma mark --为了界面美观,可以选择隐藏或者显示状态栏
-(BOOL)prefersStatusBarHidden {
returnNO;//返回NO表示要显示,返回YES即不显示
}
至此我们已建好我们所需的左右滑动的框架。 注:(如需修改左右滑动的距离,只需修改
self.mainVC.view.transform = CGAffineTransformScale(CGAffineTransformIdentity,0.8,0.8);
self.mainVC.view.center = CGPointMake(340,[UIScreen mainScreen].bounds.size.height/2);
)
接下来在我们的appdelegate.m文件中进行如下操作:
self.window = [[UIWindowalloc]initWithFrame:[[UIScreenmainScreen]bounds]];
self.window.backgroundColor = [UIColorwhiteColor];
[self.windowmakeKeyAndVisible];
ViewController *cc = [[ViewControlleralloc]init];
self.mainNavigation = [[UINavigationControlleralloc]initWithRootViewController:cc];
RightViewController *asdas = [[RightViewControlleralloc]init];
asdas.view.backgroundColor = [UIColorwhiteColor];
LeftViewController *left = [[LeftViewControlleralloc]init];
left.view.backgroundColor = [UIColorwhiteColor];
self.leftSlideVC = [[LeftSlideViewControlleralloc]initWithLeftView:leftwithMainview:self.mainNavigationwithRightVC:asdas];
[[UINavigationBarappearance]setBarTintColor:[UIColorredColor]];
[[UINavigationBarappearance]setTintColor:[UIColorwhiteColor]];
self.window.rootViewController =self.leftSlideVC;
// Override point for customization after application launch.
returnYES;
(可能代码比较乱,毕竟帮别人加急写出来的,望大家见谅)。
然后在我们的ViewController中需要触发左右的地方进行如下操作即可:
AppDelegate *app = (AppDelegate *)[[UIApplicationsharedApplication]delegate];
if (isLeft == NO) {
[app.leftSlideVC showZPFleftView];
isLeft = YES;
}else{
[app.leftSlideVC closeZPFLeftView];
isLeft = NO;
}
注:isLeft用来判断左按钮是否按下。
好了,cmd+r 尽情的享用我们的左右滑动。