UICollectionView 中有 2 种不同的单元格大小 Objective C
2 different cell sizes in UICollectionView Objective C
我想使用 UICollectionView,可以创建以下布局:
如您所见,有两种不同大小的单元格。一个是行的 1/4,另一个是 3/4。是否可以使用 UICollectionView 创建这种布局?
谁能教我怎么做???或者有样品吗???我已经研究了许多教程和参考资料。但是还是不知道怎么做..
谢谢!
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return [(NSString*)[arrayOfStats objectAtIndex:indexPath.row] sizeWithAttributes:NULL];
}
使用此方法,您可以 return 不同大小的单元格。请参考这个 link Dynamic cell width of UICollectionView depending on label width
有不同的方法:
您可以通过实施 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
方法来完成。
您可以完全按照以下教程中的步骤自定义集合视图。
http://www.raywenderlich.com/107439/uicollectionview-custom-layout-tutorial-pinterest
从您的目标布局来看,看起来甚至可以通过使用 UITableviewCell
(在单个单元格中同时加载 1/4 大小和 3/4 大小的单元格)轻松获得外观,并通过自动布局更改它们的大小。
好吧,我暂时对项目宽度进行了硬编码(72.0 和 23.0)。 5.0 的其余部分将用于中间间距和 edgeInsets。这段代码会给你正是你想要的。
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section
{
return 10.0;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section
{
return 10.0;
}
#pragma mark - CollectionViewFlowLayout Methods
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
CGSize newSize = CGSizeZero;
newSize.height = 100;
CGRect screenBounds = [[UIScreen mainScreen] bounds];
CGSize screenSize = screenBounds.size;
if(indexPath.item % 4 == 0 || indexPath.item % 4 == 3)
{
// Size : 1/4th of screen
newSize.width = screenSize.width * 0.23;
}
else
{
// Size : 3/4th of screen
newSize.width = screenSize.width * 0.72;
}
return newSize;
}
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
return UIEdgeInsetsMake(10, 2.0, 10, 2.0);
}
我想使用 UICollectionView,可以创建以下布局:
如您所见,有两种不同大小的单元格。一个是行的 1/4,另一个是 3/4。是否可以使用 UICollectionView 创建这种布局?
谁能教我怎么做???或者有样品吗???我已经研究了许多教程和参考资料。但是还是不知道怎么做..
谢谢!
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return [(NSString*)[arrayOfStats objectAtIndex:indexPath.row] sizeWithAttributes:NULL];
}
使用此方法,您可以 return 不同大小的单元格。请参考这个 link Dynamic cell width of UICollectionView depending on label width
有不同的方法:
您可以通过实施
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
方法来完成。您可以完全按照以下教程中的步骤自定义集合视图。
http://www.raywenderlich.com/107439/uicollectionview-custom-layout-tutorial-pinterest
从您的目标布局来看,看起来甚至可以通过使用
UITableviewCell
(在单个单元格中同时加载 1/4 大小和 3/4 大小的单元格)轻松获得外观,并通过自动布局更改它们的大小。
好吧,我暂时对项目宽度进行了硬编码(72.0 和 23.0)。 5.0 的其余部分将用于中间间距和 edgeInsets。这段代码会给你正是你想要的。
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section
{
return 10.0;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section
{
return 10.0;
}
#pragma mark - CollectionViewFlowLayout Methods
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
CGSize newSize = CGSizeZero;
newSize.height = 100;
CGRect screenBounds = [[UIScreen mainScreen] bounds];
CGSize screenSize = screenBounds.size;
if(indexPath.item % 4 == 0 || indexPath.item % 4 == 3)
{
// Size : 1/4th of screen
newSize.width = screenSize.width * 0.23;
}
else
{
// Size : 3/4th of screen
newSize.width = screenSize.width * 0.72;
}
return newSize;
}
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
return UIEdgeInsetsMake(10, 2.0, 10, 2.0);
}