Imitation QQ sideslip menu function in IOS


Uitabbarcontroller makes QQ sideslip menu effect:

First, understand the hierarchy of uitabbarcontroller:

The views of other uiviewcontrollers loaded by uitabbarcontroller are added to uitransitionview (this is a private API), and uitransitionview is in self The 0 layer of view and the uitabbar are on the first layer of.

So my idea is this:

Uitransitionview and uitabbar are transferred to a new view1 as the sliding part;

Between view1 and self Add another view2 between views as the container of the menu;

Add corresponding gesture response to view1;


#import <UIKit/UIKit.h>
@protocol SlideTab_VC_TCVDelegate <NSObject>
@interface SlideTab_VC : UITabBarController
@property(strong, nonatomic)UIView *mMenuV;
@property(weak, nonatomic)id <SlideTab_VC_TCVDelegate> mDelegate;
#import "SlideTab_VC.h"
#define DEVICE_W [UIScreen mainScreen].bounds.size.width
@interface SlideTab_VC ()<UITabBarDelegate>{
 CGFloat _centerMaxX;
@property(strong, nonatomic)UIView *mTransitionView;
@property(strong, nonatomic)UITapGestureRecognizer *mTapGester;
@property(assign, nonatomic)BOOL mMenuIsOpen;
@property(strong, nonatomic)UITabBar *mTabBar;
@implementation SlideTab_VC
- (void)viewDidLoad {
 [super viewDidLoad];
 // Do any additional setup after loading the view.
 self.view.backgroundColor = [UIColor purpleColor];
 _mMenuIsOpen = NO;
 _centerMaxX = DEVICE_W*3/2-80.0f;
 [self initMTransitionView];
 [self addGestureForMTransitionView];
#Pragma mark menu lazy loading
-(void)setMMenuV:(UIView *)mMenuV{
 if (mMenuV!=nil) {
  _mMenuV = mMenuV;
  [self.view insertSubview:_mMenuV atIndex:0];
#Pragma mark open menu
 CGPoint center =;
 center.x = _centerMaxX;
 [UIView animateWithDuration:0.15f animations:^{ = center;
  if (_mDelegate != nil&& [_mDelegate respondsToSelector:@selector(didOpenMenu:)]) {
  [_mDelegate didOpenMenu:_mMenuV];
 [self mTransitionSubViewsEnable:NO];
#Pragma mark close menu
 CGPoint center =;
 center.x = DEVICE_W/2;
 [UIView animateWithDuration:0.15f animations:^{ = center;
 } completion:^(BOOL finished) {
  [self mTransitionSubViewsEnable:YES];
  if (_mDelegate != nil&& [_mDelegate respondsToSelector:@selector(didCloseMenu:)]) {
  [_mDelegate didCloseMenu:_mMenuV];
#Pragma mark transition user interaction enable
 for (UIView *tmp in self.mTransitionView.subviews) {
  tmp.userInteractionEnabled = enable;
 if (enable) {
  [self.mTransitionView removeGestureRecognizer:_mTapGester];
  [self.mTransitionView addGestureRecognizer:_mTapGester];
#Pragma mark configuring mtransitionview
 for (UIView *tmp in self.view.subviews) {
  [tmp removeFromSuperview];
  [self.mTransitionView addSubview:tmp];
 [self.view addSubview:self.mTransitionView];
#Pragma mark drag gesture
 CGPoint location = [pan translationInView:pan.view.superview];
 CGPoint center =;
 if (pan.state==UIGestureRecognizerStateEnded) {
  if (center.x<_centerMaxX*0.5+DEVICE_W*0.25){
   [self closeMenu];
   [self openMenu];
 }else if(pan.state==UIGestureRecognizerStateChanged){
  If (location. X < 0) {// slide left
   center.x = center.x+location.x<=DEVICE_W/2? DEVICE_W/2 : center.x+location.x;
   center.x = center.x+location.x>=_centerMaxX? _centerMaxX : center.x+location.x;
  } = center;
  [pan setTranslation:CGPointMake(0, 0) inView:pan.view.superview];
#Pragma mark add gesture
 UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panAction:)];
 [_mTransitionView addGestureRecognizer:pan];
 _mTapGester = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tapAction)];
#Pragma mark -- lazy loading
-(UIView *)mTransitionView{
 if (_mTransitionView==nil) {
  _mTransitionView = [[UIView alloc]initWithFrame:self.view.bounds];
 return _mTransitionView;
 CGFloat x =;
 if (x>=_centerMaxX) {
  [self closeMenu];


The above is the imitation QQ sideslip menu function in IOS introduced by Xiaobian. I hope it will help you. If you have any questions, please leave me a message and Xiaobian will reply to you in time. Thank you very much for your support to the developeppaer website!

Recommended Today

winoldap. Exe – what does winoldap process mean

Process file: winoldap or winoldap exeProcess name: Microsoft MS DOS executorProcess category: processes with security risks English Description:winoldap.exe is a legitimate process used on Windows 98 based computers which deals with old ms-dos based programs. This program is non-essential process to the running of the system, but should not be terminated unless suspected to be […]