首页 › iOS开发 › IOS 利用UIScrollview实现滑动筛选

zxs19861202 发表于 2013-1-14 21:24:20

IOS 利用UIScrollview实现滑动筛选

在ios中经常会用到滑动筛选的功能，如下:

http://dl.iteye.com/upload/attachment/0066/6527/fdd71278-8d16-3889-ba34-a4ff2f17d77c.jpg

利用UIScrollview控件可以实现上述功能，思路大致是：创建一个UIView，宽度为屏幕宽度320，高度为以上图的背景图高度，在UIView上添加一个UIScrollView宽度为一个类型的宽度，设置UIscrollView自动停止滚动，设置两边被遮盖的区域可见，將类型添加到UIScrollview中，并设置他们的位置，这样效果是有了，但是这个时候只能在UISCrollview上滑动，即上图中间一块区域，要实现两边都可以滑动，需要重写UIView 的hitTest，將UIView两边的滑动事件交给UIScrollview即可。当然这样也可以实现类似Safari浏览器的多试图切换的效果。下面直接上示例代码：

http://dl.iteye.com/upload/attachment/0066/6546/a0399d72-2a69-3c55-8ef2-3a68cdc6eb9e.png
 
 
TopscrollView.h的代码如下：
 

#import <UIKit/UIKit.h>
 
@protocol TopScrollViewDelegate;
 
@interface TopScrollView : UIView<UIScrollViewDelegate>{
 
    UIScrollView *scrollview;
 
    id <TopScrollViewDelegate> _delegate;
}
 
@property(retain,nonatomic)UIScrollView *scrollview;
 
@property(retain,nonatomic)id <TopScrollViewDelegate> delegate;
 
@end
 
@protocol TopScrollViewDelegate <NSObject>
 
@required
 
//UIScrollView 滑动结束事件代理
- (void)TopScrollView:(TopScrollView *)foodTopView pageIndex:(NSInteger)pageIndex;
 
@end
 
 
TopscrollView.m 代码
 

#import "TopScrollView.h"
 
const CGFloat topScrollObjHeight= 38.0;
const CGFloat topScrollObjWidth= 101.0;
const NSUInteger topNumImages= 6;
 
 
@implementation TopScrollView
 
@synthesize scrollview;
@synthesize delegate=_delegate;
 
 
//设置UIScrollview子试图的frame和可滚动区域
- (void)layoutTopScrollImages
{
UIImageView *view = nil;
NSArray *subviews = ;
 
CGFloat curXLoc = 0;
for (view in subviews)
{
if (] && view.tag > 0)
{
CGRect frame = view.frame;
frame.origin = CGPointMake(curXLoc, 0);
view.frame = frame;

curXLoc += (topScrollObjWidth);
}
 
 
}

    .size.height)];
 
 
}
 
 
 
- (id)initWithFrame:(CGRect)frame
{
    self = ;
    if (self) {
 
        scrollview=[initWithFrame:CGRectMake(110, 0, 101, 39)];
        ;
        scrollview.indicatorStyle = UIScrollViewIndicatorStyleWhite;
        scrollview.clipsToBounds = NO;//是否溢出
        scrollview.scrollEnabled = YES;
        scrollview.pagingEnabled = YES;     //是否自动停止
        scrollview.showsHorizontalScrollIndicator=NO;  //是否显示水平滚动条
        scrollview.delegate=self;
 
        NSMutableArray *title=[initWithObjects:@"开胃菜",@"主餐类",@"主食",@"火锅",@"甜点",@"茶饮", nil];
 
        NSUInteger i;
 
        for (i = 1; i <= topNumImages; i++)
        {
            NSString *imageName = ;
            UIImage *image = ;
            UIImageView *imageView = [ initWithImage:image];
 
            CGRect rect = imageView.frame;
            rect.size.height = topScrollObjHeight;
            rect.size.width = topScrollObjWidth;
            imageView.frame = rect;
            imageView.tag = i;
 
            UILabel *lable=[initWithFrame:CGRectMake(0, 0, 101, 39)];
            lable.text=;
            lable.textColor=;
            lable.font=;
            lable.backgroundColor=;
            lable.textAlignment=UITextAlignmentCenter;
            ;
 
            ;
            ;
        }
 
        ;
        ;
        ;
 
        ;
 
 
    }
    return self;
}
 
//这里將整个UIView区域的事件都交给UIScrillView
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
    if (CGRectContainsPoint(CGRectMake(0,0,320,39), point)) {
 
        return scrollview;
    }
    return ;
}
 
- (void)dealloc
{
    ;
    ;
}
 
//滑动结束，即类型切换时更新内容
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {
 
    int index=self.scrollview.contentOffset.x/topScrollObjWidth+1;
 
    if () {
 
;
}

}
 
@end

查看完整版本: IOS 利用UIScrollview实现滑动筛选