美文网首页
实现滚动与点击按钮的联动

实现滚动与点击按钮的联动

作者: 码渣 | 来源:发表于2016-08-14 11:43 被阅读239次

这个实现用到第三方框架 HMSegmentControl 具体实现看代码 

#import "ViewController.h"#import "HMSegmentedControl.h"#define Width self.view.bounds.size.width@interface ViewController (){

UIScrollView *_scrollView;

HMSegmentedControl *_seg;

}

@end

@implementation ViewController

- (void)viewDidLoad {

[super viewDidLoad];

[self createSegmentControl];

[self createScrollView];

}

- (void)createScrollView {

_scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 100, Width, self.view.bounds.size.height - 100)];

_scrollView.contentSize = CGSizeMake(7 * Width, 0);

_scrollView.pagingEnabled = YES;

[self.view addSubview:_scrollView];

_scrollView.delegate = self;

UIView *lastView = nil;

for (int i = 0; i < 7; i++) {

UIView *view = [[UIView alloc] init];

view.backgroundColor = [self randomColor];

view.frame = CGRectMake(lastView?(lastView.frame.origin.x + lastView.bounds.size.width) : 0,0, Width, _scrollView.bounds.size.height);

[_scrollView addSubview:view];

lastView = view;

}

}

- (void)createSegmentControl {

HMSegmentedControl *seg = [[HMSegmentedControl alloc] initWithSectionTitles:@[@"消息",@"关注",@"收藏",@"我的",@"首页",@"联动",@"购物"]];

seg.frame = CGRectMake(0, 64, self.view.bounds.size.width, 36);

[self.view addSubview:seg];

//    seg.backgroundColor = [UIColor grayColor];

seg.selectedSegmentIndex = 0;

// 正常的属性

NSMutableDictionary *dict = [NSMutableDictionary dictionary];

dict[NSForegroundColorAttributeName] = [UIColor greenColor];

dict[NSFontAttributeName] = [UIFont systemFontOfSize:14];

seg.titleTextAttributes = dict;

// 选中的属性

NSMutableDictionary *selectedDict = [NSMutableDictionary dictionary];

selectedDict[NSFontAttributeName] = [UIFont systemFontOfSize:16];

selectedDict[NSForegroundColorAttributeName] = [UIColor redColor];

seg.selectedTitleTextAttributes = selectedDict;

// 指示条

seg.selectionIndicatorColor = [UIColor purpleColor];

seg.selectionIndicatorLocation = HMSegmentedControlSelectionIndicatorLocationDown;

seg.selectionIndicatorHeight = 2.0f;

// 垂直线

seg.verticalDividerEnabled = YES;

seg.verticalDividerColor = [UIColor blackColor];

seg.verticalDividerWidth = 2.0f;

// 选择类型

seg.selectionStyle = HMSegmentedControlSelectionStyleBox;

// 设置segment的偏移量

seg.segmentEdgeInset = UIEdgeInsetsMake(0, 20, 0, 20);

[seg addTarget:self action:@selector(selectedChangeValue:) forControlEvents:UIControlEventValueChanged];

_seg = seg;

}

- (void)selectedChangeValue:(HMSegmentedControl *)seg {

NSLog(@"select index:%ld",seg.selectedSegmentIndex);

// 设置偏移量

[_scrollView setContentOffset:CGPointMake(Width * seg.selectedSegmentIndex, 0) animated:YES];

}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {

NSInteger selectedIndex = scrollView.contentOffset.x / Width;

// 设置选中的索引

[_seg setSelectedSegmentIndex:selectedIndex animated:YES];

}

- (UIColor *)randomColor {

CGFloat redValue = arc4random_uniform(255);

CGFloat greenValue = arc4random_uniform(255);

CGFloat blueValue = arc4random_uniform(255);

UIColor *color = [UIColor colorWithRed:redValue/255 green:greenValue/255 blue:blueValue/255 alpha:1];

return color;

}

相关文章

  • CollectionView按钮联动

    CollectioView滚动到指定section的方法CollectionView按钮联动 实现1:点击按钮,C...

  • 实现滚动与点击按钮的联动

    这个实现用到第三方框架 HMSegmentControl 具体实现看代码 #import "ViewControl...

  • Android停止(结束)惯性滚动

    场景:当页面滚动超过一定距离后,显示回到顶部的按钮,点击按钮平滑滚动回顶部。 实现:监听页面滚动距离,与一特定值比...

  • scroll-view左右联动

    究极干货,完美实现微信小程序商品左右联动scroll-view的实现及性能优化,点击左边,右边滚动;右边滚动,左边...

  • day27-作业

    1、实现点击按钮,滚动条走动和百分比走动 2、实现秒表

  • js基础3作业1

    实现点击按钮,滚动条走动和百分比走动方法一:

  • jQuery实现点击按钮滚动元素

    最近做项目做到一个功能是用左右按钮取代进度条滚动,网上没有类似的dome就自己写了一个,挺简单不难,废话不多说直接...

  • jQuery点击锚点平滑滚动

    点击锚点平滑滚动到相应页面位置: .. "返回顶部"按钮效果:向下滚动页面出现 按钮,点击返回顶部。 …………EN...

  • 联动效果及一些疑问

    联动是一个专业术语,点击按钮切换视图,滑动视图切换按钮,是一个特定的应用场景 实现起来分两个过程来做: 1.点击按...

  • 微信小程序利用scroll-view和swiper实现标签页

    小程序实现一个联动的效果,具体效果看图。 上方是一个可滚动的标签栏。下面也是可以滚动的内容区。点击上方标签栏,下方...

网友评论

      本文标题:实现滚动与点击按钮的联动

      本文链接:https://www.haomeiwen.com/subject/wiwakttx.html