ios - 如何在UITableviewCell中创建UITableView(和UICollectionView)?
怪我咯
怪我咯 2017-04-17 14:25:26
0
5
785

请允许我用Storyboard来表明我的需求。
如图,在这个tableview里面有两个大的cell,一个是另外tableview,一个是collectionview。而且这两个大的cell的高度不是固定的,当点击加载更多的时候,对应的cell里面的tableview长度会增长,cell也会增长(换言之,在这两个cell里面所有内容都需要被全部展示,而不是滑动)。请问如果是这种需求的话,该如何设计呢?

怪我咯
怪我咯

走同样的路,发现不同的人生

reply all(5)
洪涛

Solution

你的情况其实仅仅一个collectionView就可以搞定了,根据数据源分组对应分几个section,展示更多时候,就修改对应section中的数据源,刷UI就好了,你所“必须”要关注的是你的CollectionView的contentSize以及如何Layout,还有优化的话考虑Cache layout类中的attributes.

Nested scheme

I just wrote collectionView nested collectionView like this today (it was requested, not just looking for trouble), let me talk about the idea (TableView nesting is similar, please ignore the difference between XIB/SB and pure code...)
PS: There are some mistakes, I hope - CollectionView master will come and correct me... Orz
1) Custom cell
Paste the following code in the cell where the collectionView needs to be hung:

//.h
@class WBrowserWhisperFlowLayout;
static NSString *BrowserWhisperCoverFlowCellIdentifier = @"BrowserWhisperCoverFlowCellIdentifier";

@interface WBrowserWhisperCoverFlowCell : UICollectionViewCell
@property (nonatomic, strong) WBrowserWhisperFlowLayout *layout;
@property (nonatomic, strong) UICollectionView *collectionView;

- (void)setCollectionViewDataSourceDelegate:(id<UICollectionViewDataSource, UICollectionViewDelegate>)dataSourceDelegate;

// .m
- (instancetype)initWithFrame:(CGRect)frame {
    if ((self = [super initWithFrame:frame])) {
        _layout = [[WBrowserWhisperFlowLayout alloc] init];
        _layout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0);
        _layout.itemSize = CGSizeMake(CGRectGetWidth(self.frame) - 100, 200);
        _layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;

        _collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:_layout];
        [_collectionView registerClass:[WBrowserWhisperCoverFlowItemCell class] forCellWithReuseIdentifier:BrowserWhisperCoverFlowItemCellIdentifier];
        _collectionView.backgroundColor = [UIColor whiteColor];
        _collectionView.showsHorizontalScrollIndicator = NO;
        _collectionView.pagingEnabled = YES;
        [self.contentView addSubview:_collectionView];
    }
    return self;
}

- (void)layoutSubviews {
    [super layoutSubviews];
    _collectionView.frame = self.contentView.bounds;
}

- (void)setCollectionViewDataSourceDelegate:(id<UICollectionViewDataSource, UICollectionViewDelegate>)dataSourceDelegate {
    _collectionView.dataSource = dataSourceDelegate;
    _collectionView.delegate = dataSourceDelegate;
    [_collectionView reloadData];
}

2) Remember that the CollectionView in the cell is initialized after the cell, that is, the data source and proxy of the CollectionView in the cell must be set immediately after initializing the cell, otherwise Crash will not be discussed.

3.1) Modify the data source of CollectionView in the cell (if there are changes, such as active/passive modification of data), then modify the CollectionView attributes (layoutAttribute will be modified) and relayout the two CollectionViews. (tableView is the indexPath corresponding to reloat)

4) Continue to complain: The essence of CollectionView lies in whether it can write layout. . CollectionView allows TableView to say goodbye, but it takes a certain amount of time to learn otherwise it will be difficult to use it well. Recommended resources:

  • Apple official documentation
  • iOS UICollectionView, 2nd Edition e-book
  • RayWench Video
大家讲道理

It is recommended not to use tableView in cell

It may be theoretically possible to add a UITableView to the cell (let the outer cell serve as the delegate of the inner tableView), but I have never seen such a way of writing it, and I feel that it is very bad. There are 2 reasons:

  1. Delegate is complex, and the cascading relationship of views is complex
  2. This will not meet your needs. You said you wanted:

The length of the tableview in the corresponding cell will grow, and so will the cell (in other words, all content in these two cells needs to be fully displayed, rather than sliding)

But the height of the UITableView is fixed and there is a ScrollView inside. It is naturally suitable for scrolling, rather than full display.

Possible alternatives

I think this requirement can be considered. Can the two large cells above and below be considered as two sections? The big cell above is changed to the first section. The cells inside have pictures on the left and two labels on the right. The footer or the last cell is "load more"; the big cell below is changed to the second section. According to the It depends on the situation of your collectionView. For example, if there are originally 5 items in a row, they can be arranged in each cell; or they can be arranged in one view, and this view is added to the only cell or to the headerView. Then the footer or last cell is loaded more.

Ty80

Please use this method.

- (void)reloadRowsAtIndexPaths:(NSArray *)indexPaths
              withRowAnimation:(UITableViewRowAnimation)animation
阿神

If you want to add a uitableview to uitablewview, you can search online to see if there is any open source one. I remember seeing it.
If you add a uicollection to uitableview. I offer an idea. Because I encountered a similar problem in a previous project. Tell me your thoughts.

Because uitableview supports defining cells, you can write a collectionview in the cell and then define your collectioncell. It is definitely feasible, and personally I feel the amount of code is not very large. When loading data, the data is passed to the cell each time, and then the collectionview will load the data.
You can calculate the height in the cell through code, which is possible.

Because the computer is not around... I won’t post the code. If necessary, you can leave me a message and I will post a piece of code I wrote on Monday to combine uitableview+collection

小葫芦

Does anyone have a solution? Seek to resolve conflicts.

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template