Tag: 自定义集合布局

使用集合视图自定义布局的可伸缩标题动画

最近，我们开始使用新的UX设计进行应用程序外观设计。 任何电子商务应用程序的“产品详细信息页面”都包含类似的信息，并且格式完全相同： 产品形象居首 产品特点 用户评分，相似的推荐产品，上次查看的产品等位于底部 让我们关注当用户拉下集合视图时产品的伸缩图像动画，图像将以某种视觉效果增长，如下所示： 实现方式： 让我们讨论每个步骤： 步骤A：集合视图设置 分配自定义布局CustomPDPLayout而不是默认的UICollectionViewFlowLayout。 我们将在稍后讨论有关该课程的更多信息。 2.注册单元格和标题视图 collectionView.register（AttributeCell.self，forCellWithReuseIdentifier：cellId） collectionView.register（PDPHeaderView.self，forSupplementaryViewOfKind：UICollectionView.elementKindSectionHeader，withReuseIdentifier：headerId） AttributeCell （ 单元格 ）包含一个文本标签， PDPHeaderView （ Header视图 ）包含一个图像。 3.使用UICollectionViewDelegateFlowLayout设置单元格大小和Header大小 私人租用填充：CGFloat = 16 //像元大小 func collectionView（_ collectionView：UICollectionView，layout collectionViewLayout：UICollectionViewLayout，sizeForItemAt indexPath：IndexPath）-> CGSize { 返回CGSize（width：collectionView.frame.width-2 * padding，height：50） } //标头大小 func collectionView（_ collectionView：UICollectionView，layout collectionViewLayout：UICollectionViewLayout，referenceSizeForHeaderInSection部分：Int）-> CGSize { 返回CGSize（width：collectionView.frame.width，height：250） } 4.从collectionViewLayout配置minimumInteritemSpacing，minimumLineSpacing，sectionInset等（您仍然可以使用UICollectionViewDelegateFlowLayout ） 如果让layout = collectionViewLayout为？ CustomPDPLayout { layout.minimumLineSpacing […]