两个UIScrollView 实现滑动菜单

项目需要一个界面展示更多的信息,所以考虑用分页的方式展示两个控制器的内容,试过用uisegmentedcontrol 去写,可是后来发现定制性比较差,后来索性用UIScrollView来实现,发现效果还是不错的。效果请看下图:


ScrollViewPage1.png
UIScrollViewPage2.png

上面导航栏自己写,用两个UIScrollView,一个是标题,一个是下面黄色的横条,然后内容里面的ScrollView放两个控制器的View,即可实现效果。具体代码贴出来欢迎指教改进。

//
//  ViewController.m
//  ScrollPageWekDemo
//
//  Created by kevin on 2017/8/17.
//  Copyright © 2017年 kevin. All rights reserved.
//

#import "ViewController.h"
#import "ViewController1.h"
#import "ViewController2.h"


#define MENU_HEIGHT         25
#define MENU_BUTTON_WIDTH   65
#define TopOffSet           64

#define MENU_BUTTON_WIDTHLeftOFFSET  40
#define MENU_BUTTON_WIDTHRIGHTOFFSET 58

//适用于RGB颜色相同的场景
#define RGBA(r,g,b,a) [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:a]
#define RGB(r,g,b) [UIColor colorWithRed:r/255.0 green:g/255.0 blue:b/255.0 alpha:1.0f]

@interface ViewController ()<UIScrollViewDelegate>

@property (nonatomic, strong) UIView             *headView;
@property (nonatomic, strong) UIButton           *button1;
@property (nonatomic, strong) UIButton           *button2;
@property (nonatomic, strong) UIView             *bgView;
@property (nonatomic, strong) UIScrollView       *topScrollView;
@property (nonatomic, strong) UIScrollView       *contentScrollView;

@property (nonatomic, strong) UIButton           *titleButton1;
@property (nonatomic, strong) UIButton           *titleButton2;

@property (nonatomic, strong) ViewController1    *vc1;
@property (nonatomic, strong) ViewController2    *vc2;


@property (nonatomic, assign) float              startPointX;


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self createView];
    
    // Do any additional setup after loading the view, typically from a nib.
}


- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (void)createView
{
    self.headView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, TopOffSet)];
    self.headView.backgroundColor = RGB(254,217,83);
    [self.view addSubview:self.headView];
    
    self.button1 = [[UIButton alloc] init];
    UIImage *image1 = [UIImage imageNamed:@"contacts_title_ic_rule"];
    self.button1.frame = CGRectMake(self.view.frame.size.width - 9 - image1.size.width, (44 - image1.size.height)/2 + 20, image1.size.width, image1.size.height);
    [self.button1 setImage:image1 forState:UIControlStateNormal];
    self.button1.hidden = NO;
    
    self.button2 = [[UIButton alloc] init];
    UIImage *image2 = [UIImage imageNamed:@"contacts_add_normal"];
    self.button2.frame = CGRectMake(self.view.frame.size.width - 9 - image1.size.width, (44 - image1.size.height)/2 + 20, image1.size.width, image1.size.height);
    [self.button2 setImage:image2 forState:UIControlStateNormal];
    self.button2.hidden = YES;
    
    
    [self.headView addSubview:self.button1];
    [self.headView addSubview:self.button2];
    
    
    NSArray *arT = @[@"密友", @"通讯录"];
    self.topScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake((self.view.frame.size.width - 130)/2, (44 - image1.size.height)/2 + 20, 130, MENU_HEIGHT + 2)];
    
    [self.topScrollView setShowsHorizontalScrollIndicator:NO];
    
    ///设置title的按钮
    
    self.titleButton1 = [UIButton buttonWithType:UIButtonTypeCustom];
    [self.titleButton1 setFrame:CGRectMake(0, 0, MENU_BUTTON_WIDTH, MENU_HEIGHT)];
    [self.titleButton1 setTitle:[arT objectAtIndex:0] forState:UIControlStateNormal];
    self.titleButton1.titleLabel.font = [UIFont systemFontOfSize:19];
    
    [self.titleButton1 setTitleColor:RGB(165,141,48) forState:UIControlStateNormal];
    [self.titleButton1 setTitleColor:RGB(106,91,25) forState:UIControlStateSelected];
    self.titleButton1.tag = 1;
    self.titleButton1.userInteractionEnabled = YES;
    [self.titleButton1 addTarget:self action:@selector(actionbtn:) forControlEvents:UIControlEventTouchUpInside];
    [self.topScrollView addSubview:self.titleButton1];
    
    self.titleButton2 = [UIButton buttonWithType:UIButtonTypeCustom];
    [self.titleButton2 setFrame:CGRectMake(MENU_BUTTON_WIDTH, 0, MENU_BUTTON_WIDTH, MENU_HEIGHT)];
    [self.titleButton2 setTitle:[arT objectAtIndex:1] forState:UIControlStateNormal];
    self.titleButton2.titleLabel.font = [UIFont systemFontOfSize:19];
    
    [self.titleButton2 setTitleColor:RGB(165,141,48) forState:UIControlStateNormal];
    [self.titleButton2 setTitleColor:RGB(106,91,25) forState:UIControlStateSelected];
    self.titleButton2.tag = 2;
    [self.titleButton2 addTarget:self action:@selector(actionbtn2:) forControlEvents:UIControlEventTouchUpInside];
    [self.topScrollView addSubview:self.titleButton2];
    
    
    
    ///nav可滑动的宽度;
    [self.topScrollView setContentSize:CGSizeMake(self.view.frame.size.width , MENU_HEIGHT)];
    [self.headView addSubview:self.topScrollView];
    
    self.bgView = [[UIView alloc] initWithFrame:CGRectMake(0, MENU_HEIGHT - 1, MENU_BUTTON_WIDTH, 3)];
    [self.bgView setBackgroundColor:RGB(106,91,25)];
    self.bgView.clipsToBounds = YES;
    self.bgView.layer.cornerRadius = 1.5;
    [self.topScrollView addSubview:self.bgView];
    
    
    ///创建下面的ScrollView
    self.contentScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, TopOffSet, self.view.frame.size.width, self.view.frame.size.height)];
    [self.contentScrollView setPagingEnabled:YES];
    [self.contentScrollView setShowsHorizontalScrollIndicator:NO];
    [self.view insertSubview:self.contentScrollView belowSubview:self.topScrollView];
    self.contentScrollView.delegate = self;
    
    
    [self addView2Page:self.contentScrollView count:2 frame:CGRectZero];
}

- (void)addView2Page:(UIScrollView *)scrollV count:(NSUInteger)pageCount frame:(CGRect)frame
{

    self.vc1 = [[ViewController1 alloc] init];
    self.vc2 = [[ViewController2 alloc] init];
    
    [self addChildViewController:self.vc1];
    [self addChildViewController:self.vc2];
    self.vc1.view.frame = CGRectMake(0, 0, self.contentScrollView.frame.size.width, CGRectGetHeight(self.contentScrollView.frame));
    self.vc2.view.frame = CGRectMake([UIScreen mainScreen].bounds.size.width, 0, self.contentScrollView.frame.size.width, CGRectGetHeight(self.contentScrollView.frame));
    [self.contentScrollView addSubview:self.vc1.view];
    [self.contentScrollView addSubview:self.vc2.view];
    
    [scrollV setContentSize:CGSizeMake(scrollV.frame.size.width * 2, scrollV.frame.size.height)];
}


#pragma mark - UIScrollViewDelegate

- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    _startPointX = scrollView.contentOffset.x;
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    [self changeView:scrollView.contentOffset.x];
}

- (void)changeView:(float)x
{
    float xx = x * (MENU_BUTTON_WIDTH / self.view.frame.size.width);

    [self.bgView setFrame:CGRectMake(xx, self.bgView.frame.origin.y, self.bgView.frame.size.width, self.bgView.frame.size.height)];
    
    if (xx == MENU_BUTTON_WIDTH )
    {
        self.titleButton2.selected = YES;
        self.titleButton1.selected = NO;
        self.button1.hidden = YES;
        self.button2.hidden = NO;
        
        //[self.bgView setFrame:CGRectMake(xx + (MENU_BUTTON_WIDTH - MENU_BUTTON_WIDTHRIGHTOFFSET)/2, self.bgView.frame.origin.y, MENU_BUTTON_WIDTHRIGHTOFFSET, self.bgView.frame.size.height)];
    
    } else if (xx == 0)
    {
        self.titleButton2.selected = NO;
        self.titleButton1.selected = YES;
        self.button1.hidden = NO;
        self.button2.hidden = YES;
        
        //[self.bgView setFrame:CGRectMake(xx + (MENU_BUTTON_WIDTH - MENU_BUTTON_WIDTHLeftOFFSET)/2, self.bgView.frame.origin.y, MENU_BUTTON_WIDTHLeftOFFSET, self.bgView.frame.size.height)];
    }
    
}

- (void)actionbtn:(UIButton *)btn
{
    [self.contentScrollView scrollRectToVisible:CGRectMake(self.contentScrollView.frame.size.width * (btn.tag - 1), self.contentScrollView.frame.origin.y, self.contentScrollView.frame.size.width, self.contentScrollView.frame.size.height) animated:YES];
    
    self.titleButton1.selected = YES;
    self.titleButton2.selected = NO;
    self.button1.hidden = NO;
    self.button2.hidden = YES;


}

- (void)actionbtn2:(UIButton *)btn
{
    [self.contentScrollView scrollRectToVisible:CGRectMake(self.contentScrollView.frame.size.width * (btn.tag - 1), self.contentScrollView.frame.origin.y, self.contentScrollView.frame.size.width, self.contentScrollView.frame.size.height) animated:YES];
    
    self.titleButton1.selected = NO;
    self.titleButton2.selected = YES;
    self.button1.hidden = YES;
    self.button2.hidden = NO;
    
}


@end

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,245评论 4 61
  • 掌握 UIScrollView的常见属性 UIScrollView的常用代理方法 UIScrollView的缩放 ...
    JonesCxy阅读 2,765评论 1 12
  • 每个人都有灵魂。每个人的灵魂的任务是不一样。她需要在她的生命路上去吸取
    她总阅读 94评论 0 0
  • 上2周去了珠海,感觉除了老家和广州,很久没有去其他城市瞎逛过了,很想写点东西,但是都不知道从哪里写起。想一想,4月...
    啊左阅读 435评论 1 3