iOS-封装 Demo–滑动切换多标题菜单

好多地方都有滑动切换多个标题样式的菜单！今天自己尝试封装了一个，考虑欠缺的地方还望您指正！GitHub

先上图

简单说说我的思路

1： 将需要的关键数据初始化的时候获取（需要顶部每个页面对应的标题，还要知道要展示的页面，各自作为一个数组存入）。
2： 在自定义的 View 上添加平移手势，当手指滑动的时候根据平移量，去具体判断要展示的视图是哪一个。

2.1 左（右）滑动的时候，从数组中找到对应的下（上）一个展示的页面添加到自定义视图上（位置在当前页面的右（左）侧），并随着滑动一起滑动展现出来。
2.2 停止滑动的时候判断是要展示哪一个页面，并将不展示的那一个移除掉。（使用动画）。
2.3 这样的话最多的时候，我们需要两个展示页面！最后是只留一个我们看的那个页面。

3：顶部标题我是用了一个比较笨拙的方法，根据展示的页面数，创建对应的 Button 根据标题数组对应的给 Title，然后放在一个 ScrollView 上面。（有时间可以思考一下，可以对应的去改变展示 Button 名字不必创建那么多，好像一般也不会太多！）

3.1 Button 点击时候操作逻辑不难，就是移除当前展示的页面，添加 Button 对应的页面即可。
3.2 滑动手势结束的时候根据展示的页面，把对应的 Button 字体颜色和大小改掉即可（遍历 ScrollView 的子视图找到 Button 选中的特殊对待，其他另做对待就好）。

4：滑块是个 View，利用动画对应改变 Frame 就好了！

废话尽，代码上！

PP_SlipMenuView.h中

• 声明供给外界的初始化方法

1
2
3
4
5
6
7
8
9
10
11
12
13
<span class="hljs-preprocessor"># 初始话方法：</span>
<span class="hljs-comment">/*
 ParentVc:       你在哪个试图控制中使用
 childrenVc:     你要展示那些控制器的 View
 childrenTitles: 每一个展示的视图的标题（Button 的 Title）
 frame:          展示的位置
 numTitleOnePage:每一页显示几个标题（顶部Button）
 */</span>
- (instancetype)initWithParentVc:(<span class="hljs-built_in">UIViewController</span> *)parentVc
                      childrenVc:(<span class="hljs-built_in">NSArray</span><<span class="hljs-built_in">UIViewController</span> *>*)childrenVc
                  childrenTitles:(<span class="hljs-built_in">NSArray</span><<span class="hljs-built_in">NSString</span> *>*)titles
                           frame:(<span class="hljs-built_in">CGRect</span>)frame
                  numTitleOnePage:(<span class="hljs-built_in">NSInteger</span>)numTitleOnePage;

PP_SlipMenuView.m中

• 声明属性

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
{
<span class="hljs-built_in">NSInteger</span> numOnePage; <span class="hljs-comment">// 顶部展示的标题数量</span>
}

<span class="hljs-keyword">@property</span> (<span class="hljs-keyword">assign</span>, <span class="hljs-keyword">nonatomic</span>) <span class="hljs-built_in">NSInteger</span> currentIndex;<span class="hljs-comment">// 当前展示视图对应的下标</span>
<span class="hljs-keyword">@property</span> (<span class="hljs-keyword">strong</span>, <span class="hljs-keyword">nonatomic</span>) <span class="hljs-built_in">NSArray</span><<span class="hljs-built_in">UIViewController</span> *> *childrenVc;<span class="hljs-comment">// 子控制器</span>
<span class="hljs-keyword">@property</span> (<span class="hljs-keyword">strong</span>, <span class="hljs-keyword">nonatomic</span>) <span class="hljs-built_in">NSArray</span><<span class="hljs-built_in">NSString</span> *> *titles; <span class="hljs-comment">// 标题数组</span>
<span class="hljs-keyword">@property</span> (<span class="hljs-keyword">strong</span>, <span class="hljs-keyword">nonatomic</span>) <span class="hljs-built_in">UIViewController</span> *parentVc;<span class="hljs-comment">// 父控制器</span>
<span class="hljs-keyword">@property</span> (<span class="hljs-keyword">strong</span>, <span class="hljs-keyword">nonatomic</span>) <span class="hljs-built_in">UIPanGestureRecognizer</span> *pan;<span class="hljs-comment">// 手势</span>
<span class="hljs-keyword">@property</span> (<span class="hljs-keyword">strong</span>, <span class="hljs-keyword">nonatomic</span>) <span class="hljs-built_in">UIScrollView</span> *titlesView;<span class="hljs-comment">// 顶部承载标题 Button 容器</span>
<span class="hljs-keyword">@property</span> (<span class="hljs-keyword">strong</span>, <span class="hljs-keyword">nonatomic</span>) <span class="hljs-built_in">UIView</span> *lineView; <span class="hljs-comment">// 标题的下划线</span>

<span class="hljs-keyword">const</span> <span class="hljs-keyword">float</span> titleHH = <span class="hljs-number">50.0</span>f; <span class="hljs-comment">// 定义顶部 Button 的高</span>
<span class="hljs-comment">// 定义一个滑动方向枚举  具体有使用的地方 定义只为可读性</span>
<span class="hljs-keyword">typedef</span> <span class="hljs-keyword">enum</span> : <span class="hljs-built_in">NSUInteger</span>
{
    MoveDirectionLeft,
    MoveDirectionRight,
} MoveDirection;

• 初始化方法实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
- (instancetype)initWithParentVc:(<span class="hljs-built_in">UIViewController</span> *)parentVc childrenVc:(<span class="hljs-built_in">NSArray</span><<span class="hljs-built_in">UIViewController</span> *> *)childrenVc childrenTitles:(<span class="hljs-built_in">NSArray</span><<span class="hljs-built_in">NSString</span> *> *)titles frame:(<span class="hljs-built_in">CGRect</span>)frame numTitleOnePage:(<span class="hljs-built_in">NSInteger</span>)numTitleOnePage
{
    <span class="hljs-comment">// 给对应的属性赋值</span>
    _childrenVc = childrenVc;
    _parentVc = parentVc;
    _titles = titles;
    numOnePage = numTitleOnePage;

    <span class="hljs-keyword">if</span> (<span class="hljs-keyword">self</span> = [<span class="hljs-keyword">super</span> initWithFrame:frame])
    {
    <span class="hljs-comment">// 处理视图控制器</span>
        <span class="hljs-comment">// 默认显示第一个控制器的内容</span>
        _currentIndex = <span class="hljs-number">0</span>;
        [<span class="hljs-keyword">self</span> insertSubview:_childrenVc[<span class="hljs-number">0</span>]<span class="hljs-variable">.view</span> atIndex:<span class="hljs-number">0</span>];

    <span class="hljs-comment">// pan手势处理切换</span>
        _pan = [[<span class="hljs-built_in">UIPanGestureRecognizer</span> alloc] initWithTarget:<span class="hljs-keyword">self</span> action:<span class="hljs-keyword">@selector</span>(panChangeVc:)];
        [<span class="hljs-keyword">self</span> addGestureRecognizer:_pan];

    <span class="hljs-comment">// 顶部控制菜单</span>
        _titlesView = [[<span class="hljs-built_in">UIScrollView</span> alloc] initWithFrame:(<span class="hljs-built_in">CGRectMake</span>(<span class="hljs-number">0</span>, <span class="hljs-number">0</span>, kScreenW, titleHH + <span class="hljs-number">20</span>))];
        _titlesView<span class="hljs-variable">.contentSize</span> = <span class="hljs-built_in">CGSizeMake</span>(kScreenW / numOnePage * _childrenVc<span class="hljs-variable">.count</span>, titleHH);
        _titlesView<span class="hljs-variable">.backgroundColor</span> = [<span class="hljs-built_in">UIColor</span> whiteColor];
        _titlesView<span class="hljs-variable">.bounces</span> = <span class="hljs-literal">NO</span>;
        _titlesView<span class="hljs-variable">.showsHorizontalScrollIndicator</span> = <span class="hljs-literal">NO</span>;
        [<span class="hljs-keyword">self</span> insertSubview:_titlesView atIndex:<span class="hljs-number">1</span>];

    <span class="hljs-comment">// 添加标题 Button</span>
        [<span class="hljs-keyword">self</span> addTittleButtons];
        <span class="hljs-comment">// 对应的 Button 下面的划线</span>
         _lineView = [[<span class="hljs-built_in">UIView</span> alloc] initWithFrame:<span class="hljs-built_in">CGRectMake</span>(_currentIndex * kScreenW / numOnePage, titleHH, kScreenW / numOnePage, <span class="hljs-number">20</span>)];
        _lineView<span class="hljs-variable">.backgroundColor</span> = [<span class="hljs-built_in">UIColor</span> blackColor];
        [_titlesView addSubview:_lineView];

    }
    <span class="hljs-keyword">return</span> <span class="hljs-keyword">self</span>;
}

• 布局 Title Button 就是顶部菜单点击可以切换

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  <span class="hljs-comment">/*
  1: 根据页面的多少逐一创建 Button，
  2: tag 值为对应的下标加1000，这样便于我们根据对应的下标去找到对应的 Button
  3: 依次设置在 ScroView 上的位置，并添加_titlesView（ScrollView 上面）
  */</span>
  - (<span class="hljs-keyword">void</span>)addTittleButtons
  {
   <span class="hljs-keyword">for</span> (<span class="hljs-keyword">int</span> i = <span class="hljs-number">0</span>; i < _childrenVc<span class="hljs-variable">.count</span>; i++)
   {
       <span class="hljs-built_in">UIButton</span> *title = [<span class="hljs-built_in">UIButton</span> buttonWithType:(<span class="hljs-built_in">UIButtonTypeCustom</span>)];
       title<span class="hljs-variable">.backgroundColor</span> = [<span class="hljs-built_in">UIColor</span> grayColor];
       [title setTitle:_titles[i] forState:(<span class="hljs-built_in">UIControlStateNormal</span>)];
  <span class="hljs-preprocessor"># 设置展示的当前页面和未展示页面的对应 Button 字体大小颜色的区别</span>
       <span class="hljs-keyword">if</span> (i == _currentIndex)
       {
           [title<span class="hljs-variable">.titleLabel</span> setFont:[<span class="hljs-built_in">UIFont</span> systemFontOfSize:<span class="hljs-number">24</span>]];
           [title setTitleColor:[<span class="hljs-built_in">UIColor</span> purpleColor ] forState:(<span class="hljs-built_in">UIControlStateNormal</span>)];
  
       }<span class="hljs-keyword">else</span>{
           [title<span class="hljs-variable">.titleLabel</span> setFont:[<span class="hljs-built_in">UIFont</span> systemFontOfSize:<span class="hljs-number">17</span>]];
           [title setTitleColor:[<span class="hljs-built_in">UIColor</span> whiteColor] forState:(<span class="hljs-built_in">UIControlStateNormal</span>)];
       }
       [title setTitleColor:[<span class="hljs-built_in">UIColor</span> redColor] forState:(<span class="hljs-built_in">UIControlStateHighlighted</span>)];
       [title addTarget:<span class="hljs-keyword">self</span> action:<span class="hljs-keyword">@selector</span>(chooseTitle:) forControlEvents:(<span class="hljs-built_in">UIControlEventTouchUpInside</span>)];
       title<span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectMake</span>(i * kScreenW / <span class="hljs-number">3.0</span>, <span class="hljs-number">0</span>, kScreenW / <span class="hljs-number">3.0</span>, titleHH);
       title<span class="hljs-variable">.tag</span> = <span class="hljs-number">1000</span> + i;
       [_titlesView addSubview:title];
   }
  }

• 点击标题的事件，切换页面到对应的页面

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  - (<span class="hljs-keyword">void</span>)chooseTitle:(UIButton *)sender
  {
    <span class="hljs-comment">// 点击不是当前的标题才会去切换</span>
    <span class="hljs-keyword">if</span> (_currentIndex != sender.tag - <span class="hljs-number">1000</span>)
    {
       <span class="hljs-comment">// 移除当前的</span>
        [_childrenVc[_currentIndex].view removeFromSuperview];
  
        <span class="hljs-comment">//  展示点击的 设置 Frame 很关键要  因为手势的时候回去修改  这里让其展示在整个屏幕上</span>
        _childrenVc[sender.tag - <span class="hljs-number">1000</span>].view.frame = self.bounds;
        [self insertSubview:_childrenVc[sender.tag - <span class="hljs-number">1000</span>].view atIndex:<span class="hljs-number">0</span>];
        _currentIndex = sender.tag - <span class="hljs-number">1000</span>;
    }
    <span class="hljs-comment">// 移动下划线</span>
    [self moveLineView];
  }

• 一定下划线 滑动到当前选中的 Button 下面

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  - (<span class="hljs-keyword">void</span>)moveLineView
  {
    <span class="hljs-preprocessor"># 用手势滑动时候 我们既要移动下划线  也要把对应的 Button 的字体颜色大小改了</span>
    <span class="hljs-keyword">for</span> (<span class="hljs-built_in">UIView</span> *view <span class="hljs-keyword">in</span> _titlesView<span class="hljs-variable">.subviews</span>)
    {
        <span class="hljs-comment">// 遍历找到 Button</span>
        <span class="hljs-keyword">if</span> ([view isKindOfClass:[<span class="hljs-built_in">UIButton</span> class]])
        {
            <span class="hljs-built_in">UIButton</span> *button = (<span class="hljs-built_in">UIButton</span> *)view;
            <span class="hljs-keyword">if</span> (button<span class="hljs-variable">.tag</span> == _currentIndex + <span class="hljs-number">1000</span>)
            {
                [button<span class="hljs-variable">.titleLabel</span> setFont:[<span class="hljs-built_in">UIFont</span> systemFontOfSize:<span class="hljs-number">24</span>]];
                [button setTitleColor:[<span class="hljs-built_in">UIColor</span> purpleColor ] forState:(<span class="hljs-built_in">UIControlStateNormal</span>)];
  
            }<span class="hljs-keyword">else</span>{
                [button<span class="hljs-variable">.titleLabel</span> setFont:[<span class="hljs-built_in">UIFont</span> systemFontOfSize:<span class="hljs-number">17</span>]];
                [button setTitleColor:[<span class="hljs-built_in">UIColor</span> whiteColor] forState:(<span class="hljs-built_in">UIControlStateNormal</span>)];
            }
        }
    }
    <span class="hljs-comment">// 算好位置 动画调整到相应的位置</span>
    [<span class="hljs-built_in">UIView</span> animateWithDuration:<span class="hljs-number">0.1</span>f animations:^{
        <span class="hljs-comment">/*
          页面的宽度 / 一个页面展示的 Button 数 = Button 的宽度
         当前下划线的 x = 当前的下标 * Button 的宽度
         */</span>
        _lineView<span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectMake</span>(_currentIndex * kScreenW / numOnePage, titleHH, kScreenW / numOnePage, <span class="hljs-number">20</span>);
    }];
   <span class="hljs-preprocessor">#下面的两个判断是一个展示的关键部分，我们可以根据自己的想法调整！</span>
     <span class="hljs-preprocessor">#1、当下划线的x 超过一个屏幕宽的时候，那么就是说明已经到了我们视线之外了，我们要调整_titlesView的偏移量使之能看见，我这里是让她保持在最右面！</span>
     <span class="hljs-preprocessor">#2、这个判断是当要展示的 Button 在左侧我们视线之外的时候，我们让_titlesView偏移量为 0让我们能看见（因为这里只有第一个会出现这样的情况）</span>
  
  <span class="hljs-keyword">if</span> (_lineView<span class="hljs-variable">.frame</span><span class="hljs-variable">.origin</span><span class="hljs-variable">.x</span> >= kScreenW )
    {
        <span class="hljs-built_in">NSLog</span>(<span class="hljs-string">@"走这个方法当前的下标%ld"</span>,_currentIndex);
        [_titlesView setContentOffset:<span class="hljs-built_in">CGPointMake</span>( kScreenW / numOnePage * (_currentIndex +<span class="hljs-number">1</span> - numOnePage), <span class="hljs-number">0</span>) animated:<span class="hljs-literal">YES</span>];
    }
    <span class="hljs-keyword">if</span> (_titlesView<span class="hljs-variable">.contentOffset</span><span class="hljs-variable">.x</span> >= <span class="hljs-built_in">CGRectGetMaxX</span>(_lineView<span class="hljs-variable">.frame</span>))
    {
        <span class="hljs-built_in">NSLog</span>(<span class="hljs-string">@"左滑动 走这个方法当前的下标%ld"</span>,_currentIndex);
        [_titlesView setContentOffset:<span class="hljs-built_in">CGPointMake</span>( kScreenW *<span class="hljs-number">0</span>, <span class="hljs-number">0</span>) animated:<span class="hljs-literal">YES</span>];
    }
  }

• 添加的手势事件

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  - (<span class="hljs-keyword">void</span>)panChangeVc:(<span class="hljs-built_in">UIPanGestureRecognizer</span> *)pan
  {
   <span class="hljs-comment">// 向左滑 x 为负 向右滑 x 为正  （末位置 减 初始位置）</span>
    <span class="hljs-built_in">CGPoint</span> panOffSet = [pan translationInView:<span class="hljs-keyword">self</span>];
    <span class="hljs-keyword">float</span> changeX = panOffSet<span class="hljs-variable">.x</span>;
    <span class="hljs-comment">// 获取 当前的视图位置</span>
    <span class="hljs-built_in">CGRect</span> frame = _childrenVc[_currentIndex]<span class="hljs-variable">.view</span><span class="hljs-variable">.frame</span>;
    <span class="hljs-comment">// 清空手势的偏移量</span>
    [_pan setTranslation:(<span class="hljs-built_in">CGPointZero</span>) inView:<span class="hljs-keyword">self</span>];
    <span class="hljs-comment">// 处理左右视图</span>
  <span class="hljs-preprocessor"># 这里只是为了临界点时候任然可以处理所以相应  增加减少了一个极小的数</span>
    <span class="hljs-keyword">float</span> resulet = frame<span class="hljs-variable">.origin</span><span class="hljs-variable">.x</span> + (changeX < <span class="hljs-number">0</span> ? - DBL_EPSILON : DBL_EPSILON);
  <span class="hljs-preprocessor"># 小于0说明我们左滑了 大于0说明我们右滑了 调用不同的自定义方法</span>
  ( resulet <=<span class="hljs-number">0</span> ) ?  [<span class="hljs-keyword">self</span> leftScroll:changeX frame:frame] : [<span class="hljs-keyword">self</span> rightScroll:changeX frame:frame] ;
   }

• 左滑视图 出现右侧视图

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  - (<span class="hljs-keyword">void</span>)leftScroll:(<span class="hljs-keyword">float</span>)offX frame:(<span class="hljs-built_in">CGRect</span>)frame
  {
  
    <span class="hljs-keyword">if</span> (_currentIndex == _childrenVc<span class="hljs-variable">.count</span> - <span class="hljs-number">1</span>)
    {
        <span class="hljs-built_in">NSLog</span>(<span class="hljs-string">@"最后一个左滑 不处理"</span>);
        <span class="hljs-keyword">return</span>;
    }
  
    <span class="hljs-keyword">float</span> tempX = frame<span class="hljs-variable">.origin</span><span class="hljs-variable">.x</span> + offX;
    <span class="hljs-keyword">if</span> (_currentIndex == <span class="hljs-number">0</span>)
    {
  <span class="hljs-preprocessor"># 左滑动的时候不松手又往右滑动 在第一个视图的时候不允许 当然也可以设置成循环滚动  到最后一个</span>
        tempX = tempX >=<span class="hljs-number">0</span> ? <span class="hljs-number">0</span> :tempX;
    }
  
    <span class="hljs-comment">// 移动当前的视图</span>
    _childrenVc[_currentIndex]<span class="hljs-variable">.view</span><span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectMake</span>(tempX, frame<span class="hljs-variable">.origin</span><span class="hljs-variable">.y</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.width</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.height</span>);
  
    <span class="hljs-comment">// 找到下一个页面</span>
    <span class="hljs-built_in">UIView</span> *subView = _childrenVc[_currentIndex + <span class="hljs-number">1</span>]<span class="hljs-variable">.view</span>;
  
    <span class="hljs-preprocessor"># 设置 Frame 很关键  让他出现当前页面的右侧</span>
    subView<span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectMake</span>(tempX + frame<span class="hljs-variable">.size</span><span class="hljs-variable">.width</span>, frame<span class="hljs-variable">.origin</span><span class="hljs-variable">.y</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.width</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.height</span>);
  
    <span class="hljs-keyword">if</span> (![<span class="hljs-keyword">self</span><span class="hljs-variable">.subviews</span> containsObject:subView])
    {
        [<span class="hljs-keyword">self</span> insertSubview:subView atIndex:<span class="hljs-number">0</span>];
    }
    <span class="hljs-keyword">if</span> (_pan<span class="hljs-variable">.state</span> == <span class="hljs-built_in">UIGestureRecognizerStateEnded</span>)
    {
  <span class="hljs-preprocessor"># 手势停止的时候确定一下到底要展示哪一个页面</span>
        MoveDirection result = tempX <= - kScreenW / <span class="hljs-number">2</span> ? [<span class="hljs-keyword">self</span> leftOut:_childrenVc[_currentIndex]<span class="hljs-variable">.view</span> rightIn:subView] : [<span class="hljs-keyword">self</span> leftIn:_childrenVc[_currentIndex]<span class="hljs-variable">.view</span>  rightOut:subView];
        _currentIndex = result == MoveDirectionLeft ? _currentIndex + <span class="hljs-number">1</span> : _currentIndex;
        [<span class="hljs-keyword">self</span> moveLineView];<span class="hljs-comment">// 调整 Button 文字和下划线</span>
    }
  }

• 自定义方法判断手势结束的时候要把谁移除

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  - (MoveDirection)leftOut:(<span class="hljs-built_in">UIView</span> *)leftView rightIn:(<span class="hljs-built_in">UIView</span> *)rightView
  {   <span class="hljs-comment">/*
    当手势结束的时候  左边的视图移除  右侧的视图占据整个屏幕
    */</span>
    [<span class="hljs-built_in">UIView</span> animateWithDuration:<span class="hljs-number">0.3</span>f animations:^{
        leftView<span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectOffset</span>(<span class="hljs-keyword">self</span><span class="hljs-variable">.bounds</span>, - kScreenW, <span class="hljs-number">0</span>);
        rightView<span class="hljs-variable">.frame</span> = <span class="hljs-keyword">self</span><span class="hljs-variable">.bounds</span>;
    } completion:^(<span class="hljs-built_in">BOOL</span> finished) {
        [leftView removeFromSuperview];
    }];
    <span class="hljs-keyword">return</span> MoveDirectionLeft;
  }
  - (MoveDirection)leftIn:(<span class="hljs-built_in">UIView</span> *)leftView rightOut:(<span class="hljs-built_in">UIView</span> *)rightView
  {
    <span class="hljs-comment">/*
     当手势结束的时候  左边的视图移除  右侧的视图占据整个屏幕
     */</span>
    [<span class="hljs-built_in">UIView</span> animateWithDuration:<span class="hljs-number">0.3</span>f animations:^{
        rightView<span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectOffset</span>(<span class="hljs-keyword">self</span><span class="hljs-variable">.bounds</span>, kScreenW, <span class="hljs-number">0</span>);
        leftView<span class="hljs-variable">.frame</span> = <span class="hljs-keyword">self</span><span class="hljs-variable">.bounds</span>;
    } completion:^(<span class="hljs-built_in">BOOL</span> finished) {
       [rightView removeFromSuperview];
    }];
    <span class="hljs-keyword">return</span> MoveDirectionRight;
  }

• 右滑视图 出现左侧视图 思路和上面一样

  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  - (<span class="hljs-keyword">void</span>)rightScroll:(<span class="hljs-keyword">float</span>)offX frame:(<span class="hljs-built_in">CGRect</span>)frame
  {
  <span class="hljs-keyword">if</span> (_currentIndex == <span class="hljs-number">0</span>)
   {
       <span class="hljs-built_in">NSLog</span>(<span class="hljs-string">@"第一个右滑 不处理"</span>);
       <span class="hljs-keyword">return</span>;
   }
   <span class="hljs-keyword">float</span> tempX = frame<span class="hljs-variable">.origin</span><span class="hljs-variable">.x</span> + offX;
   <span class="hljs-keyword">if</span> (_currentIndex == _childrenVc<span class="hljs-variable">.count</span> - <span class="hljs-number">1</span>)
   {
       tempX = tempX <=<span class="hljs-number">0</span> ? <span class="hljs-number">0</span> :tempX;
   }
   <span class="hljs-comment">// 移动当前的视图</span>
   _childrenVc[_currentIndex]<span class="hljs-variable">.view</span><span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectMake</span>(tempX, frame<span class="hljs-variable">.origin</span><span class="hljs-variable">.y</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.width</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.height</span>);
   <span class="hljs-built_in">UIView</span> *subView = _childrenVc[_currentIndex - <span class="hljs-number">1</span>]<span class="hljs-variable">.view</span>;
   subView<span class="hljs-variable">.frame</span> = <span class="hljs-built_in">CGRectMake</span>(tempX - frame<span class="hljs-variable">.size</span><span class="hljs-variable">.width</span>, frame<span class="hljs-variable">.origin</span><span class="hljs-variable">.y</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.width</span>, frame<span class="hljs-variable">.size</span><span class="hljs-variable">.height</span>);  
   <span class="hljs-keyword">if</span> (![<span class="hljs-keyword">self</span><span class="hljs-variable">.subviews</span> containsObject:subView])
   {
        [<span class="hljs-keyword">self</span> insertSubview:subView atIndex:<span class="hljs-number">0</span>];
   }
   <span class="hljs-keyword">if</span> (_pan<span class="hljs-variable">.state</span> == <span class="hljs-built_in">UIGestureRecognizerStateEnded</span>)
   {
       MoveDirection result = tempX <=  kScreenW / <span class="hljs-number">2</span> ? [<span class="hljs-keyword">self</span> leftOut:subView rightIn:_childrenVc[_currentIndex]<span class="hljs-variable">.view</span>] : [<span class="hljs-keyword">self</span> leftIn:subView  rightOut:_childrenVc[_currentIndex]<span class="hljs-variable">.view</span>];
       _currentIndex = result == MoveDirectionLeft ? _currentIndex : _currentIndex - <span class="hljs-number">1</span>;
      [<span class="hljs-keyword">self</span> moveLineView];
   }
  }

ViewController.m 引入使用

1
2
3
4
5
6
7
8
9
10
11
12
NSMutableArray *arraVc = [NSMutableArray <span class="hljs-keyword">new</span>];
    NSMutableArray *arraTitle = [NSMutableArray <span class="hljs-keyword">new</span>];
    <span class="hljs-keyword">for</span> (<span class="hljs-keyword">int</span> i = <span class="hljs-number">0</span> ; i <= <span class="hljs-number">10</span> ; i++)
    {
        UIViewController *vc = [UIViewController <span class="hljs-keyword">new</span>];
        vc.view.backgroundColor = [UIColor colorWithRed:(arc4random()%<span class="hljs-number">173</span>)/<span class="hljs-number">346.0</span> + <span class="hljs-number">0.5</span> green:(arc4random()%<span class="hljs-number">173</span>)/<span class="hljs-number">346.0</span> + <span class="hljs-number">0.5</span>  blue:(arc4random()%<span class="hljs-number">173</span>)/<span class="hljs-number">346.0</span> + <span class="hljs-number">0.5</span>  alpha: <span class="hljs-number">1</span>];
        [arraVc addObject:vc];
        [arraTitle addObject:[NSString stringWithFormat:@<span class="hljs-string">"第%d页"</span>,i]];
    }
     PP_SlipMenuView *pp_View = [[PP_SlipMenuView alloc] initWithParentVc:self childrenVc:arraVc childrenTitles:arraTitle frame:self.view.bounds numTitleOnePage:<span class="hljs-number">3</span>];

    [self.view addSubview:pp_View];

• 补充一句 子控制器View 添加到自定义 View 上时候，frame 要注意我这随便设置一样 Bounds 的，真正使用的时候要考虑显示问题，会不会被顶部挡住！