大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。
最近的研究iOS程序侧边栏。渐渐的发现iOS该方案还开始采取风侧边栏格该,QQ,今日头条,Path(Path运营商最早的侧边栏app该,效果说成是Path效果),所以就研究了下。
然后发现Git Hub上有非常多側边栏的控件,这些控件效果也都挺玄的。可是我想找到不用第三方控件自己实现側边栏呢?后来參照这篇blog,然后自己搞了下,算搞清楚了。以下具体介绍一下吧。
1.
首先我们须要在storyboard里面新建3个view controlle,这里也能够是navigation controller。可是我还是习惯直接用view controller就能够了,跳转都自己来实现。
2.
接下来须要新建3个类,
ContainerViewController是一个容器类的VC。作用是放置MainVC和SideVC,就好比TabbarViewController一样。它仅仅是一个容器,真正调整页面的是在其它VC中。
3.
先不用管这3个ViewController怎样实现。我们转到storyboard中。分别把设置3个ViewController的identifier。像这个样子
ContainerViewController能够不设置storyboard,可是mainVC和sideVC一定要设置好storyboard ID,然后你还能够自己编辑一下Main VC和sideVC。这样能够更清晰地看到側边栏的效果。
终于的StoryBoard是这种:
最上面是ContainerViewController。接下来从右到左各自是MainViewController和SideViewController。
4.
好了,接下来我们就開始coding把。我这里想要做的效果是滑屏或者点击mainVC左上角的button都能够打开側边栏,然后当側边栏显示的时候,滑屏或者点击右側的mainVC。都能隐藏側边栏。
我们一步一步来分析代码吧:
事实上主要是ContainerViewController
ContainerViewController.h
// 这个相当于是容器的VC,里面存放主界面和側边栏 #import <UIKit/UIKit.h> #import "MainViewController.h" #import "SideViewController.h" @interface ContainerViewController : UIViewController<UIGestureRecognizerDelegate>{} @property(nonatomic, strong) MainViewController *centerController; @property(nonatomic, strong) SideViewController *leftController; - (void)showSideView; - (void)hideSideView; @end
我们import了mainVC和sideVC,然后定义了两个property和两个method
ContainerViewController.m
// #import "ContainerViewController.h" @interface ContainerViewController () @end @implementation ContainerViewController - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. UIStoryboard *storyboard = [UIStoryboard storyboardWithName:@"Main" bundle:nil]; _centerController = (MainViewController *)[storyboard instantiateViewControllerWithIdentifier:@"MainViewController"]; _centerController.fatherViewController = self; _leftController = (SideViewController *)[storyboard instantiateViewControllerWithIdentifier:@"LeftViewController"]; [self.view addSubview:_centerController.view]; [_centerController.view setTag:1]; [_centerController.view setFrame:self.view.bounds]; [self.view addSubview:_leftController.view]; [_leftController.view setTag:2]; [_leftController.view setFrame:self.view.bounds]; [self.view bringSubviewToFront:_centerController.view]; //add swipe gesture UISwipeGestureRecognizer *swipeGestureRight = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipeGesture:)]; [swipeGestureRight setDirection:UISwipeGestureRecognizerDirectionRight]; [_centerController.view addGestureRecognizer:swipeGestureRight]; UISwipeGestureRecognizer *swipeGestureLeft = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipeGesture:)]; [swipeGestureLeft setDirection:UISwipeGestureRecognizerDirectionLeft]; [_centerController.view addGestureRecognizer:swipeGestureLeft]; } -(void) swipeGesture:(UISwipeGestureRecognizer *)swipeGestureRecognizer { CALayer *layer = [_centerController.view layer]; layer.shadowColor = [UIColor blackColor].CGColor; layer.shadowOffset = CGSizeMake(1, 1); layer.shadowOpacity = 1; layer.shadowRadius = 20.0; if (swipeGestureRecognizer.direction == UISwipeGestureRecognizerDirectionRight) { [self showSideView]; } if (swipeGestureRecognizer.direction == UISwipeGestureRecognizerDirectionLeft) { [self hideSideView]; } } // 显示側边栏。单独写成一个函数,供mainVC点击头像时调用 - (void)showSideView{ [_leftController.view setHidden:NO]; [UIView beginAnimations:nil context:nil]; [UIView setAnimationCurve:UIViewAnimationCurveEaseIn]; if (_centerController.view.frame.origin.x == self.view.frame.origin.x || _centerController.view.frame.origin.x == -200) { [_centerController.view setFrame:CGRectMake(_centerController.view.frame.origin.x+200, _centerController.view.frame.origin.y, _centerController.view.frame.size.width, _centerController.view.frame.size.height)]; } [UIView commitAnimations]; } - (void)hideSideView{ [UIView beginAnimations:nil context:nil]; [UIView setAnimationCurve:UIViewAnimationCurveEaseOut]; if ( _centerController.view.frame.origin.x == 200) { [_centerController.view setFrame:CGRectMake(_centerController.view.frame.origin.x-200, _centerController.view.frame.origin.y, _centerController.view.frame.size.width, _centerController.view.frame.size.height)]; } [UIView commitAnimations]; // 最后调用防止出现白底 [_leftController.view setHidden:YES]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } /* #pragma mark - Navigation // In a storyboard-based application, you will often want to do a little preparation before navigation - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { // Get the new view controller using [segue destinationViewController]. // Pass the selected object to the new view controller. } */ @end
在viewDidload方法里面,我们从storyboard中获取到两个ViewController,注意我的sideviewcontroller起的名字是LeftViewController,也就是在storyboard ID里面要写成这个名字。
然后加入进去了滑屏手势,各自是向左滑和向右滑
接下里在滑屏的代理里面定义了滑屏的动作。这里为什么要把显示/隐藏sideview单独做成两个method呢?由于一会我们要实如今mainVC里面点击头像的时候可以调用ContainerVC里的这两个函数!
接下来看看MainVC怎样实现吧
MainViewController.h
#import <UIKit/UIKit.h> @class ContainerViewController; @interface MainViewController : UIViewController - (IBAction)showSideView:(id)sender; @property (nonatomic, strong) ContainerViewController* fatherViewController; @end
注意这里用@class来引入ContainerVC,不在头文件中面#import是为了防止循环引用。
然后我们定义一个property。fatherViewController,它是一个ContainerViewController的实例。
showSideView的IBAction是头像那个button的点击动作。
MainViewController.m
#import "MainViewController.h" #import "ContainerViewController.h" @interface MainViewController () @end @implementation MainViewController - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } /* #pragma mark - Navigation // In a storyboard-based application, you will often want to do a little preparation before navigation - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { // Get the new view controller using [segue destinationViewController]. // Pass the selected object to the new view controller. } */ - (IBAction)showSideView:(id)sender { [self.fatherViewController showSideView]; } - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{ [self.fatherViewController hideSideView]; } @end
这样在mainViewController的点击头像button的动作就能调用fatherViewController,也就是ContainerViewController里面的showSideView动作了。
touchesBegan是当点击mainViewController的时候。隐藏側边栏的。
以为SideViewController都是在storyboard里面拖入控件完毕的。所以不须要写什么代码。
当然,这里不过左側的側边栏,想要看两側的側边栏方法。查阅这里。
版权声明:本文博客原创文章,博客,未经同意,不得转载。
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/117365.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...