UICollectionView 布局,带有用于 SearchBar 的部分标题和用于标题的另一个动态部分标题

Posted

技术标签:

【中文标题】UICollectionView 布局,带有用于 SearchBar 的部分标题和用于标题的另一个动态部分标题【英文标题】:UICollectionView Layout with Section Header for SearchBar and another dynamic Section Header for the Title 【发布时间】:2019-02-06 07:01:28 【问题描述】:

我想为集合视图创建 2 个标题。

第一个标头是UISearchController,部分标头用于我从 JSON 获得的类别

这是 JSON 示例

"tag": "req_kingdom_classification",
"success": "1",
"error": "0",
"data": [
    
        "Category": "Animalia",
        "SubCategory": "Mamals",
        "imagePath": "Mamals.jpg",
        "keyword": "",
        "activity": "AA"
    ,
    
        "Category": "Animalia",
        "SubCategory": "Reptile",
        "imagePath": "Reptile.jpg",
        "keyword": "",
        "activity": "AA"
    ,
        "Category": "Plantae",
        "SubCategory": "Embryophyta",
        "imagePath": "Embryophyta.jpg",
        "keyword": "",
        "activity": "PP"
    ,
    
        "Category": "Bacteria",
        "SubCategory": "Streptomyces",
        "imagePath": "Streptomyces.jpg",
        "keyword": "",
        "activity": "BB"
    , ...
]

图像已经在设备内部,因为我调用了 API 来获取图像。

这就是我想要创建的内容

------------------------------------------------------------- 
|                          SearchBar                        |
-------------------------------------------------------------
|                          Category1                        |
-------------------------------------------------------------
|     Category1.imagePath1    |     Category1.imagePath2    |
|    Category1.SubCategory1   |    Category1.SubCategory2   |
|                                                           |
|     Category1.imagePath3    |     Category1.imagePath4    |
|    Category1.SubCategory3   |    Category1.SubCategory4   |
-------------------------------------------------------------
|                          Category2                        |
-------------------------------------------------------------
|     Category2.imagePath1    |     Category2.imagePath2    |
|    Category2.SubCategory1   |    Category2.SubCategory2   |
|                                                           |
|     Category2.imagePath3    |     Category2.imagePath4    |
|    Category2.SubCategory3   |    Category2.SubCategory4   |
-------------------------------------------------------------
...

我使用UISearchBar 搜索每个SubCategory

如何使用 Swift 自定义 UICollectionView

【问题讨论】:

请向我们展示您尝试过的一些代码以及确切的问题。 使用collectionView(_:viewForSupplementaryElementOfKind:at:。如果 indexpath.section == 0 则返回带有搜索栏和标题标签的视图,否则返回带有标题标签的视图 @Teetz 先生,我在将搜索添加到部分标题时遇到问题。这是代码github.com/renzrz/gitCoe @RajeshKumarRI 先生,有什么例子可以试试吗?谢谢。 【参考方案1】:

我们在 ios 的集合视图中没有页眉和页脚部分。 但是您可以在集合单元格中管理表格视图,因为表格视图中有页眉和页脚视图。

你的问题已经解决了,我希望如此。

【讨论】:

您可以使用collectionView(_:viewForSupplementaryElementOfKind:at:方法为collectionview创建页眉和页脚 @Ravi Vaishnav 我尝试在表格视图中使用集合单元格,但它只能水平滚动......如何使它看起来像集合单元格先生? @Renzrz 先生,根据您的设计,您需要将集合视图放在表格单元格中,然后您就得到了您在上面给出的设计。表示集合视图中的一个表格单元格和另一个集合视图中的另一个表格单元格,您可以从中管理。

以上是关于UICollectionView 布局,带有用于 SearchBar 的部分标题和用于标题的另一个动态部分标题的主要内容,如果未能解决你的问题,请参考以下文章

UICollectionView - 垂直滚动,带有自定义布局的水平分页

带有自定义 UICollectionViewLayout 的 UICollectionView 中的部分标题

UICollectionView 更改布局 - 更改单元格

UICollectionView 中的自定义布局

UICollectionView 导致单元格的自动布局问题

UICollectionView 自动布局约束正在打破