![](/img/trans.png)
[英]All items are not displayed properly while using UICollectionView grid view
[英]Displaying multiple UICollectionView in one view, but the number of items displayed is wrong
我試圖在一個視圖中顯示多個UICollectionView。 該視圖是使用此自定義AccordionView控件的折疊式手風琴樣式視圖。
目標是顯示圖像縮略圖的多個部分,其中每個部分包含一個UICollectionView,如下所示:
數據可作為下面的NSArray self.wallpaperCollectionArray
,其中wallpaper_id
是縮略圖的路徑:
(
{
name = "Bold Statement";
"wallpaper_id" = (
"bs-better",
"bs-look-forward",
"bs-now-never",
"bs-stay-hype",
"bs-you-awesome"
);
},
{
name = "Dreamcatcher";
"wallpaper_id" = (
"dc-disney",
"dc-fear",
"dc-paulo",
"dc-quit"
);
},
{
name = "Goods from the good";
"wallpaper_id" = (
"gg-get-hurt",
"gg-jobs",
"gg-lennon",
"gg-oprah"
);
},
{
name = "Random Set";
"wallpaper_id" = (
"rs-face",
"rs-god-knows",
"rs-good",
"rs-holtz",
"rs-positive",
"rs-read",
"rs-think"
);
},
{
name = Traveling;
"wallpaper_id" = (
"tr-miller"
);
}
)
這是我生成UICollectionView的代碼:
- (void)loadView {
UIView *libraryView = [UIView new];
CGFloat maxWidth = [[UIScreen mainScreen] bounds].size.width;
CGFloat maxHeight = [[UIScreen mainScreen] bounds].size.height;
// Setup accordion
self.libraryAccordionView = [[AccordionView alloc] initWithFrame:CGRectMake(0, 0, maxWidth, maxHeight)];
// Re-usable layout for the UICollectionView(s) inside the for loop
UICollectionViewFlowLayout *layout = [UICollectionViewFlowLayout new];
layout.itemSize = CGSizeMake(thumbnailSize, thumbnailSize);
layout.minimumInteritemSpacing = 0;
layout.minimumLineSpacing = 1;
// Looping through the array contents:
int i = 0;
for(NSDictionary *currentCollectionDictionary in self.wallpaperCollectionArray) {
NSArray *wallpaperIDs = [currentCollectionDictionary valueForKeyPath:@"wallpaper_id"];
NSInteger numberOfWallpapers = [wallpaperIDs count];
// One row contains 4 thumbnails, while each thumbnail's height is 79.
// So, collectionView height = (total item / 4 + 1) * 79
NSInteger collectionViewHeight = (numberOfWallpapers / 4 + 1) * thumbnailSize;
UICollectionView *currentCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, maxWidth, collectionViewHeight)
collectionViewLayout:layout];
[currentCollectionView setDataSource:(id)self];
[currentCollectionView setDelegate:(id)self];
NSString *cellIdentifier = [NSString stringWithFormat:@"cell_%d", i];
[currentCollectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:cellIdentifier];
// Trick to let the delegate and data source functions deal with the multiple UICollectionView's
[currentCollectionView setTag:i];
// * --- Create header --- * //
UIButton *currentHeader = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 0, 30)];
NSString *currentHeaderTitle = [currentCollectionDictionary valueForKeyPath:@"name"];
[currentHeader setTitle:currentHeaderTitle forState:UIControlStateNormal];
[self.libraryAccordionView addHeader:currentHeader withView:currentCollectionView];
i++;
}
[libraryView addSubview:self.libraryAccordionView]
[self setView:libraryView];
}
數據源方法:
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
NSInteger index = collectionView.tag;
NSInteger numberOfWallpaper = [[[self.wallpaperCollectionArray objectAtIndex:index] valueForKeyPath:@"wallpaper_id"] count];
NSLog(@"index is: %d --- # of item is: %d", index, numberOfWallpaper);
return numberOfWallpaper;
}
// The cell that is returned must be retrieved from a call to -dequeueReusableCellWithReuseIdentifier:forIndexPath:
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
NSInteger index = collectionView.tag;
NSString *cellIdentifier = [NSString stringWithFormat:@"cell_%d", index];
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier
forIndexPath:indexPath];
NSString *thumbnailName = [[[self.wallpaperCollectionArray objectAtIndex:index] valueForKeyPath:@"wallpaper_id"] objectAtIndex:indexPath.row];
UIImageView *wallpaperImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:thumbnailName]];
[cell addSubview:wallpaperImage];
return cell;
}
問題是,所有UICollectionView僅顯示一個縮略圖,盡管看起來它們正在加載正確的縮略圖:
最初,我意識到問題可能出在- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
方法中。
但是,在此測試中, NSLog(@"index is: %d --- # of item is: %d", index, numberOfWallpaper);
, numberOfWallpaper
的結果是正確的:
2013-10-04 08:50:43.992 quo.mk.e[15046:11603] index is: 4 --- # of item is: 1
2013-10-04 08:50:43.993 quo.mk.e[15046:11603] index is: 3 --- # of item is: 7
2013-10-04 08:50:43.994 quo.mk.e[15046:11603] index is: 2 --- # of item is: 4
2013-10-04 08:50:43.994 quo.mk.e[15046:11603] index is: 1 --- # of item is: 4
2013-10-04 08:50:43.995 quo.mk.e[15046:11603] index is: 0 --- # of item is: 5
因此,我將為numberOfItemsInSection
返回正確數量的縮略圖。 為什么UICollectionView只顯示一個縮略圖?
原來問題在於布局的重用。 對於多個UICollectionView,我們需要創建自己的單獨布局。 由於某些原因。
在- (void)loadView
的循環內部移動布局創建可解決此問題:
int i = 0;
for(NSDictionary *currentCollectionDictionary in self.wallpaperCollectionArray) {
NSArray *wallpaperIDs = [currentCollectionDictionary valueForKeyPath:@"wallpaper_id"];
NSInteger numberOfWallpapers = [wallpaperIDs count];
// Layouting
UICollectionViewFlowLayout *layout = [UICollectionViewFlowLayout new];
layout.itemSize = CGSizeMake(thumbnailSize, thumbnailSize);
layout.minimumInteritemSpacing = 0;
layout.minimumLineSpacing = 1;
...
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.