如何在TableViewCell中实现ScrollView

Question

大家好，我正在尝试实现带有页面控制的滚动，就像 iPhone 主屏幕一样，但在 uitableview 单元格中。

我尝试做的是使用 xib 文件创建一个自定义表格视图单元格，并将 uipagecontrol 和 uiscrollview 放置在其上，并将其与 iboutlets 连接到 uitableviewcell。

这是自定义单元的 .h 文件中的代码。

@interface ScrollableCell : UITableViewCell <UIScrollViewDelegate>

@property (nonatomic, strong) IBOutlet UIScrollView *scrollView;
@property (nonatomic, strong) IBOutlet UIPageControl *pageControl;
@property (nonatomic, strong) NSMutableArray *viewControllers; 

这是综合属性后自定义单元的 .m 文件中的代码。

- (CGSize)contentSizeForPagingScrollView {
CGRect bounds = self.scrollView.bounds;
return CGSizeMake(bounds.size.width * [self.viewControllers count] , bounds.size.height );
} 

@- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
    // Initialization code

    UIView *blueView = [[UIView alloc] initWithFrame:CGRectZero];
    [blueView setBackgroundColor:[UIColor blueColor]];

    UIView *redView = [[UIView alloc] initWithFrame:CGRectZero];
    [redView setBackgroundColor:[UIColor redColor]];

    UIView *yellowView = [[UIView alloc] initWithFrame:CGRectZero];
    [yellowView setBackgroundColor:[UIColor yellowColor]]; 

    self.viewControllers = [NSArray arrayWithObjects:blueView, redView, yellowView,nil];

    for (UIView *view in self.viewControllers) {
        [view setFrame:CGRectMake([self.viewControllers indexOfObject:view]*self.scrollView.frame.size.width+5, 
                                  5, 
                                  self.scrollView.frame.size.width-10, 
                                  self.scrollView.frame.size.height-10.0)];
        [self.scrollView addSubview:view];

    }

    self.pageControl.numberOfPages = [self.viewControllers count];
    self.pageControl.currentPage = 0;

    self.scrollView.pagingEnabled = YES;
    self.scrollView.backgroundColor = [UIColor blackColor];
    self.scrollView.showsVerticalScrollIndicator = NO;
    self.scrollView.showsHorizontalScrollIndicator = NO;
    self.scrollView.contentSize = [self contentSizeForPagingScrollView];
    self.scrollView.delegate = self;
    [self.contentView addSubview:self.scrollView];
    [self.contentView addSubview:self.pageControl];
}
return self;
}

-(void) scrollViewDidScroll:(UIScrollView *)scrollView
{
CGFloat pageWidth = scrollView.frame.size.width;
int page = floor((scrollView.contentOffset.x - pageWidth / 2) / pageWidth) + 1;
self.pageControl.currentPage = page;
}

希望你们能帮助我完成这项工作。如果有我正在尝试的不同方法/更好的方法，请告诉我。

对于我想要实现的目标的视觉参考，我认为脉冲新闻应用程序符合要求

http://itunes.apple.com/us/app/pulse-news-for-iphone/id377594176?mt=8

它是一个表视图，每个单元格上水平滚动。

谢谢。

Answer 1

如果有与我正在尝试的不同的方法/更好的方法，请告诉我。
对于我想要实现的目标的视觉参考，我认为脉冲新闻应用程序符合要求。

如果您设计此应用程序的主要参考是 Pulse 应用程序，您应该知道开发人员实际上没有诉诸滚动视图。 Pulse 应用程序都是表格视图。每个单元格内有一个主要的垂直表格视图和几个水平“黑客”表格视图，组成垂直表格视图。

它是一个非常聪明的表格视图实现。但是，还有谁比 Pulse 的开发人员本身更能向您解释这一点呢？他们受邀前往斯坦福大学参加 iOS 编程课程的讲座。
它位于 iTunes U 和这是 6 分钟的讲座，名为“10 Hacks to Go From Idea To #1 App”。 您应该观看它，如果适合您，也许可以重新考虑您的应用程序设计 更好的。