日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學無先后，達者為師

網站首頁 編程語言 正文

iOS開發實現抽屜效果_IOS

作者：Yeppppppppp ? 更新時間： 2022-10-02 編程語言

iOS開發之如何實現“抽屜”效果，供大家參考，具體內容如下

現在基本上每一個App中左劃都會出現一個頁面，基本上都是只占主頁面的一部分，效果就像是一個抽屜一樣。最近在寫項目時，關于如何達到抽屜效果，總結了一些東西。
先看看效果圖：

實現過程

首先我們需要去創建一個新的視圖控制器，讓它作為我們的要實現的抽屜的根視圖，在此視圖控制器我們要添加對應的左視圖，要是需要右視圖也可以添加，然后設定方法：

@property (nonatomic, strong) UIViewController *rootViewController;
//左側視圖
@property (nonatomic, strong) UIViewController *leftViewController;
//菜單寬度
@property (nonatomic, assign, readonly) CGFloat menuWidth;
//留白寬度
@property (nonatomic, assign, readonly) CGFloat emptyWidth;
//是否允許滾動
@property (nonatomic ,assign) BOOL slideEnabled;
//創建方法
-(instancetype)initWithRootViewController:(UIViewController*)rootViewController;
//顯示主視圖
-(void)showRootViewControllerAnimated:(BOOL)animated;
//顯示左側菜單
-(void)showLeftViewControllerAnimated:(BOOL)animated;

接著我們將定義的方法進行實現：

-(instancetype)initWithRootViewController:(UIViewController*)rootViewController{
? ? if (self = [super init]) {
? ? ? ? _rootViewController = rootViewController;
? ? ? ? [self addChildViewController:_rootViewController];
? ? ? ? [self.view addSubview:_rootViewController.view];
? ? ? ? [_rootViewController didMoveToParentViewController:self];
? ? }
? ? return self;
}

- (void)showLeftViewControllerAnimated:(BOOL)animated {
? ? if (!_leftViewController) {return;}
? ? [self.view sendSubviewToBack:_rightViewController.view];
? ? _coverView.hidden = false;
? ? [_rootViewController.view bringSubviewToFront:_coverView];
? ? [UIView animateWithDuration:[self animationDurationAnimated:animated] animations:^{
? ? ? ? _rootViewController.view.center = CGPointMake(_rootViewController.view.bounds.size.width/2 + self.menuWidth, _rootViewController.view.center.y);
? ? ? ? _leftViewController.view.frame = CGRectMake(0, 0, [self menuWidth], self.view.bounds.size.height);
? ? ? ? _coverView.alpha = MaxCoverAlpha;
? ? }];
}

然后我們需要添加一個分類，讓它向前聲明新的視圖控制器，添加一個創建視圖的方法使用懶加載：

- (XLSlideMenuViewController *)xl_sldeMenu {
? ? UIViewController *sldeMenu = self.parentViewController;
? ? while (sldeMenu) {
? ? ? ? if ([sldeMenu isKindOfClass:[XLSlideMenuViewController class]]) {
? ? ? ? ? ? return (XLSlideMenuViewController *)sldeMenu;
? ? ? ? } else if (sldeMenu.parentViewController && sldeMenu.parentViewController != sldeMenu) {
? ? ? ? ? ? sldeMenu = sldeMenu.parentViewController;
? ? ? ? } else {
? ? ? ? ? ? sldeMenu = nil;
? ? ? ? }
? ? }
? ? return nil;
}

然后我們在使用抽屜的時候，需要西安去設置根視圖，然后將左側視圖初始化并將左視圖添加在前邊設置好的左視圖屬性上：

UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:tabBarControllerTest];
? ? nav.modalPresentationStyle = UIModalPresentationFullScreen;
? ??
? ? LeftViewController *leftVC = [[LeftViewController alloc] init];
? ? XLSlideMenuViewController *slideMenu = [[XLSlideMenuViewController alloc] initWithRootViewController:nav];
? ? slideMenu.leftViewController = leftVC;
? ? self.window.rootViewController = slideMenu;
? ? slideMenu.modalPresentationStyle = UIModalPresentationFullScreen;
? ? [self presentViewController:slideMenu animated:NO completion:nil];

最后在我們還可以添加點擊事件，并且添加拖拽方法，使操作更加簡單：

-(void)panChanged:(UIPanGestureRecognizer*)pan{
? ? //拖拽的距離
? ? CGPoint translation = [pan translationInView:self.view];
? ? //移動主控制器
? ? _rootViewController.view.center = CGPointMake(_originalPoint.x + translation.x, _originalPoint.y);
? ? //判斷是否設置了左右菜單
? ? if (!_rightViewController && CGRectGetMinX(_rootViewController.view.frame) <= 0 ) {
? ? ? ? _rootViewController.view.frame = self.view.bounds;
? ? }
? ? if (!_leftViewController && CGRectGetMinX(_rootViewController.view.frame) >= 0) {
? ? ? ? _rootViewController.view.frame = self.view.bounds;
? ? }
? ? //滑動到邊緣位置后不可以繼續滑動
? ? if (CGRectGetMinX(_rootViewController.view.frame) > self.menuWidth) {
? ? ? ? _rootViewController.view.center = CGPointMake(_rootViewController.view.bounds.size.width/2 + self.menuWidth, _rootViewController.view.center.y);
? ? }
? ? if (CGRectGetMaxX(_rootViewController.view.frame) < self.emptyWidth) {
? ? ? ? _rootViewController.view.center = CGPointMake(_rootViewController.view.bounds.size.width/2 - self.menuWidth, _rootViewController.view.center.y);
? ? }
? ? //判斷顯示左菜單還是右菜單
? ? if (CGRectGetMinX(_rootViewController.view.frame) > 0) {
? ? ? ? //顯示左菜單
? ? ? ? [self.view sendSubviewToBack:_rightViewController.view];
? ? ? ? //更新左菜單位置
? ? ? ? [self updateLeftMenuFrame];
? ? ? ? //更新遮罩層的透明度
? ? ? ? _coverView.hidden = false;
? ? ? ? [_rootViewController.view bringSubviewToFront:_coverView];
? ? ? ? _coverView.alpha = CGRectGetMinX(_rootViewController.view.frame)/self.menuWidth * MaxCoverAlpha;
? ? }else if (CGRectGetMinX(_rootViewController.view.frame) < 0){
? ? ? ??
? ? ? ? //更新遮罩層的透明度
? ? ? ? _coverView.hidden = false;
? ? ? ? [_rootViewController.view bringSubviewToFront:_coverView];
? ? ? ? _coverView.alpha = (CGRectGetMaxX(self.view.frame) - CGRectGetMaxX(_rootViewController.view.frame))/self.menuWidth * MaxCoverAlpha;
? ? }
}

然后左視圖中的具體內容我們就可以自己去設置了，這樣就達到了一個“抽屜”的效果。

原文鏈接：https://blog.csdn.net/weixin_51638861/article/details/123030324

欄目分類
最近更新