iOS库或DIY Etsy如类别控制？
我试图findEtsy在iPhone应用程序中的滑动类别视图的库或示例项目。
我正在讨论在应用程序主视图的顶部重新创build“精选，历史和季节性”类别的轻扫效果。
如果有人知道Github上的一个，或者是一个关于如何做这个事情的kickstart，那就太棒了！
如果你只想要类别而不是整个TableView，那么你不需要第三方控制。 一个UIScrollView是你所需要的。
这个想法是你创build一个启用分页的滚动视图，并设置它不剪辑内容并将其居中在屏幕中。 现在，因为我们需要能够捕捉甚至超出scrollView左边缘的触摸（当用户已经滚动了），我们需要一个技巧来捕捉触摸。 这是通过使用将在全屏幕宽度的UIView完成的，并且会将截获的触摸传递给我们的scrollView。
有了这个设置，下面是代码：首先捕获触摸的视图（我将其命名为ExtendedScrollViewCaptureView）：
#import <UIKit/UIKit.h> @interface ExtendedScrollViewCaptureView : UIView { } @property (nonatomic,strong)UIScrollView *scrollView; @end 这里是实现文件：
#import "ExtendedScrollViewCaptureView.h" @implementation ExtendedScrollViewCaptureView @synthesize scrollView; - (id)initWithFrame:(CGRect)frame { self = [super initWithFrame:frame]; if (self) { // Initialization code } return self; } - (UIView *) hitTest:(CGPoint) point withEvent:(UIEvent *)event { if ([self pointInside:point withEvent:event]) { return scrollView; } return nil; } @end
现在让我们去主要的东西。 在您的viewController头文件中创build一个UIScrollView iVar：
@property(nonatomic,strong)UIScrollView *scrollView;
还添加了2个整数variables，用于监视可用的最大标题并跟踪所选标签：
@interface MyViewController : UIViewController<UIScrollViewDelegate> { int selectedIndex; int maxIndex; }
并在您的实施文件中：
- (void)viewDidLoad { [super viewDidLoad]; ExtendedScrollViewCaptureView *extendedView = [[ExtendedScrollViewCaptureView alloc] initWithFrame:self.navigationBar.bounds]; extendedView.backgroundColor = [UIColor clearColor]; extendedView.clipsToBounds = YES; UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(labelTapped:)]; [extendedView addGestureRecognizer:tap]; self.scrollView = [[UIScrollView alloc] init]; self.scrollView.frame = CGRectMake(0,0,320,36); self.scrollView.pagingEnabled = YES; self.scrollView.showsVerticalScrollIndicator = NO; self.scrollView.showsHorizontalScrollIndicator = NO; self.scrollView.bounces = YES; self.scrollView.alwaysBounceHorizontal = YES; self.scrollView.alwaysBounceVertical = NO; self.scrollView.backgroundColor = [UIColor clearColor]; self.scrollView.delegate = self; self.scrollView.scrollsToTop = NO; //add the scrollView inside the extendedView [extendedView addSubview:self.scrollView]; //get the pointer reference extendedView.scrollView = self.scrollView; //add the arrow inside the extendedView UIImageView *arrow = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"arrow.png"]]; arrow.frame = CGRectMake(154, 36, 11, 6); [extendedView addSubview:arrow]; //add the extendedSubView to the view [self.view addSubview:extendedView]; //init the scrollView with some entries: [self setUpScrollView:[NSArray arrayWithObjects:@"LABEL 1",@"LABEL 2",@"LABEL 3",@"LABEL 4",@"LABEL 5",nil]]; }
现在创build函数来初始化ScrollView的标题标签（标签作为NSArray传递）
- (void)setUpScrollView:(NSArray *)titleLabels { int scrollSize = 320; int i = 0; int offsetX = 0; int scrollViewWidth = 0; maxIndex = titleLabels.count; //if our scrollview has already the labels stop here if ([self.scrollView subviews].count>0) { self.scrollView.contentOffset = CGPointZero; return; } //get the max width of the labels, which will define our label width for (NSString *titleLabel in titleLabels) { CGSize expectedLabelSize = [[titleLabel capitalizedString] sizeWithFont:[UIFont fontWithName:kFontFamily1 size:kFontFamily1Correction+13] constrainedToSize:CGSizeMake(320, 22)]; scrollViewWidth = MAX(scrollViewWidth,expectedLabelSize.width); } //restrict max width for title items to 106 pixels (to fit 3 labels in the screen) //this is optional and can adjusted or removed, but I suggest to make labels equal width scrollViewWidth = MIN(scrollViewWidth, 106); //now draw the labels for (NSString *titleLabel in titleLabels) { UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(offsetX, 5, scrollViewWidth, 34)]; label.text = [titleLabel capitalizedString]; label.adjustsFontSizeToFitWidth = NO; label.numberOfLines = 2; label.backgroundColor = [UIColor clearColor]; label.font = [UIFont fontWithName:@"ArialMT" size:13]; if (i==selectedItem) { label.textColor = [UIColor redColor]; } else { label.textColor = [UIColor whiteColor]; } label.textAlignment = UITextAlignmentCenter; label.tag = 23000+i; [self.scrollView addSubview:label]; offsetX+=scrollViewWidth; i++; } self.scrollView.frame = CGRectMake((320-scrollViewWidth)/2, 0, scrollViewWidth, 36); self.scrollView.clipsToBounds = NO; self.scrollView.contentSize = CGSizeMake(MAX(scrollSize,offsetX), 36); self.scrollView.contentOffset = CGPointMake(scrollViewWidth*selectedItem, 0); }
现在从代理捕获UIScrollView滚动事件：
- (void)scrollViewDidScroll:(UIScrollView *)scrollView { //get the index of the label we scrolled into! int visiblePageIndex = round(scrollView.contentOffset.x/scrollView.bounds.size.width); //set page number.. if (selectedIndex!=visiblePageIndex) { //get the label and set it to red UILabel *label = (UILabel*)[self.scrollView viewWithTag:23000+visiblePageIndex]; label.textColor = [UIColor redColor]; //get the previous Label and set it back to White UILabel *oldLabel = (UILabel*)[self.scrollView viewWithTag:23000+selectedIndex]; oldLabel.textColor = [UIColor whiteColor]; //set the new index to the index holder selectedIndex = visiblePageIndex; } }
最后我们需要捕捉标题点击事件的function：
- (void)labelTapped:(UITapGestureRecognizer*)gestureRecognizer { CGPoint pressPoint = [gestureRecognizer locationInView:gestureRecognizer.view]; if (pressPoint.x>(self.scrollView.frame.size.width+self.view.frame.size.width)/2) { //move to next page if one is available... if (selectedIndex+1<maxIndex) { float currentOffset = self.scrollView.contentOffset.x+self.scrollView.frame.size.width; [self.scrollView setContentOffset:CGPointMake(currentOffset, 0) animated:YES]; } } else if (pressPoint.x<(self.view.frame.size.width-self.scrollView.frame.size.width)/2) { //move to previous page if one is available if (selectedIndex>0) { float currentOffset = self.scrollView.contentOffset.x-self.scrollView.frame.size.width; [self.scrollView setContentOffset:CGPointMake(currentOffset, 0) animated:YES]; } } }
而已！
在https://github.com/rs/SDSegmentedControl有一个类似的控制在github上。 他们使用UISegmentedControl子类来创build效果。 Cocoacontrols.com是你的朋友。 🙂