Как реализовать TableView, где фон прокручивается одновременно? - PullRequest
2 голосов
/ 20 марта 2010

Представьте, что у вас есть нормальное табличное представление, где каждая строка представляет собой элемент на конвейерной ленте. Вы поместите элементы в каждую ячейку табличного представления, но при прокрутке вы также хотите, чтобы фоновое изображение (конвейерная лента) также прокручивалось. Как ты можешь это сделать?

Ответы [ 4 ]

5 голосов
/ 20 марта 2010

Этого можно добиться, установив цвет фона представления таблицы:

tableView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"background.png"]];
2 голосов
/ 29 марта 2010

Сделайте фон UITableView прозрачным и добавьте UIScrollView позади него с UIImageView внутри. Добавьте прослушиватель, когда прокручивается UITableView (так как это подкласс UIScrollView, у него все те же методы делегата). Затем, когда он прокручивается, установите положение прокрутки UIScrollView позади него на то же программное значение.

Технически вы можете сделать это без секунды UIScrollView после UITableView, просто с простым UIIImageView, если вы хотите изменить значения смещения.

1 голос
/ 23 марта 2010

Я не пробовал этого, поэтому я не уверен, какой будет наилучший подход, но один из вариантов - добавить фоновое изображение в виде UIImageView в каждую из ваших ячеек, чтобы каждая ячейка имела полноразмерный размер.копия вашего фонового изображения.Установите для clipsToBounds значение NO в вашей ячейке и присвойте границам UIImageView отрицательное значение y, равное смещению от вашей ячейки к вершине таблицы.

Вы также можете рассмотреть возможность использования UIScrollView вместо UITableView.

UITableView сам по себе является UIScrollView, поэтому вы можете попробовать просто добавить фоновое изображение в качестве подпредставления вашего UITableView, но я бы удивился, если бы это сработало.Я предполагаю, что реализация UITableView не будет хорошо работать с зарубежными подпредставлениями.

** EDIT **

Хотя я все еще подозреваю, что UIScrollView может быть более подходящим базовым классом для использования здесь,Я решил попробовать трюк UIImageView, который я описал выше.Это довольно просто и не потребляет чрезмерной памяти, пока все ваши UIImageViews совместно используют один UIImage.Вот мой пример кода:

//  LadderCell.h
#import <UIKit/UIKit.h>

@interface LadderCell : UITableViewCell {
    UIImageView *backgroundImageView;
    UILabel *titleLabel;
}

@property (nonatomic, retain) UIImageView *backgroundImageView;
@property (nonatomic, retain) UILabel *titleLabel;

- (void)setIndexPath:(NSIndexPath *)indexPath;
- (id)initWithImage:(UIImage *)theImage;
+ (NSString *)reuseIdentifier;
+ (CGFloat)height;
@end
//  LadderCell.m
#import "LadderCell.h"

@implementation LadderCell
@synthesize backgroundImageView, titleLabel;

- (void)dealloc {
    self.backgroundImageView = nil;
    self.titleLabel = nil;
    [super dealloc];
}

- (id)initWithImage:(UIImage *)theImage {
    if (self = [super initWithStyle:UITableViewCellStyleDefault reuseIdentifier:[LadderCell reuseIdentifier]]) {
        self.frame = CGRectMake(0.0, 0.0, 320.0, [LadderCell height]);
        self.clipsToBounds = YES;
        self.backgroundImageView = [[[UIImageView alloc] initWithImage:theImage] autorelease];
        backgroundImageView.autoresizingMask = UIViewAutoresizingFlexibleRightMargin;
        self.titleLabel = [[[UILabel alloc] initWithFrame:self.bounds] autorelease];
        titleLabel.textAlignment = UITextAlignmentCenter;
        titleLabel.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
        titleLabel.backgroundColor = [UIColor colorWithWhite:1 alpha:0];
        [self addSubview:backgroundImageView];
        [self addSubview:titleLabel];
    }
    return self;
}

- (void)setIndexPath:(NSIndexPath *)indexPath {
    backgroundImageView.frame = CGRectMake(0.0, 
                                           -(CGFloat)indexPath.row * [LadderCell height] + 100.0,  
                                           backgroundImageView.frame.size.width,
                                           backgroundImageView.frame.size.height);
}

+ (NSString *)reuseIdentifier {
    return @"LadderCell";
}

+ (CGFloat)height {
    return 30;

}

@end
//  TableBackgroundTestViewController.h
#import 

@interface TableBackgroundTestViewController : UITableViewController {
    UIImage *backgroundImage;
}

@property (nonatomic, retain) UIImage *backgroundImage;

@end
//  TableBackgroundTestViewController.m
#import "TableBackgroundTestViewController.h"
#import "LadderCell.h"

@implementation TableBackgroundTestViewController
@synthesize backgroundImage;

- (void)dealloc {
    self.backgroundImage = nil;
    [super dealloc];
}

- (void)viewDidLoad {
    [super viewDidLoad];
    self.backgroundImage = [UIImage imageNamed:@"background.png"];
}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1;
}

- (NSInteger)tableView:(UITableView *)table numberOfRowsInSection:(NSInteger)section {
    return 1000;
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    return [LadderCell height];
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    LadderCell *cell = (LadderCell *)[tableView dequeueReusableCellWithIdentifier:[LadderCell reuseIdentifier]];
    if (!cell) {
        cell = [[[LadderCell alloc] initWithImage:self.backgroundImage] autorelease];
    }
    [cell setIndexPath:indexPath];
    cell.titleLabel.text = [NSString stringWithFormat:@"Row %d", indexPath.row];
    return cell;
}

@end
0 голосов
/ 29 марта 2010

Мое предложение похоже на Эд Марти (что он предлагает "без второго UIScrollView"):

Поместите UITableView в простой UIView. Сделайте фоны ячеек прозрачными, чтобы фон снизу таблицы отображал

Под UITableView поместите UIImageView с нужным вам фоном. И UITableView, и UIImageView теперь находятся внутри одного и того же вмещающего UIView.

Слушайте события прокрутки UITableView. При обнаружении прокрутки просто измените фоновое положение UIImageView (frame.origin.y) соответствующим образом, чтобы оно «прилипало» к виду таблицы.

Вы можете иметь фон как одно гигантское изображение или иметь серию из них, чтобы вы делали мозаику. Вы можете иметь массив изображений и добавлять в массив сверху / снизу, когда это необходимо, а также удалять изображения, которые «прокручивались» с экрана, чтобы сохранить память. Вам нужно будет самостоятельно рассчитать позиции для всех этих фоновых изображений, но в этом нет ничего сложного.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...