如何在所有设备中使用 swift4 在 CollectionView 中显示两列

     2023-03-14     36

关键词:

【中文标题】如何在所有设备中使用 swift4 在 CollectionView 中显示两列【英文标题】:How to show two columns in a CollectionView using swift4 in all devices 【发布时间】:2018-03-30 11:42:57 【问题描述】:

为了在 collectionView 中只显示两列,我正在使用这段代码

    let layout = self.collectionView.collectionViewLayout as! UICollectionViewFlowLayout
    layout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0)
    layout.minimumInteritemSpacing = 4
    layout.itemSize = CGSize(width:(self.collectionView.frame.size.width - 10)/2,height: (self.collectionView.frame.size.height)/3)

但它只在 5s 上正确显示,而不是在每部 iphone 上。请帮忙。

我想像这张图片一样展示我的视图控制器。请帮助任何人

【问题讨论】:

班加利纳基? @Gorib mone prane @iPeter 【参考方案1】:

你一定是错过了UICollectionViewDelegateFlowLayout

试试这个看看:

// Source code
import UIKit

class CollectionVC: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout 

    @IBOutlet var collection: UICollectionView!
    override func viewDidLoad() 
        super.viewDidLoad()
        collection.delegate = self
        collection.dataSource = self
    

    override func viewWillAppear(_ animated: Bool) 
        super.viewWillAppear(animated)
        //collection.reloadData()
    

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
        let flowayout = collectionViewLayout as? UICollectionViewFlowLayout
        let space: CGFloat = (flowayout?.minimumInteritemSpacing ?? 0.0) + (flowayout?.sectionInset.left ?? 0.0) + (flowayout?.sectionInset.right ?? 0.0)
        let size:CGFloat = (collection.frame.size.width - space) / 2.0
        return CGSize(width: size, height: size)
    


    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
        return 50
    

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "testcell", for: indexPath)
        cell.backgroundColor = UIColor.red
        return cell
    


// 界面设计

结果:

【讨论】:

你能告诉我如何减少两个项目之间的空间。 相应地做了,但两个项目之间的空间并没有减少先生 @GoribDeveloper - 复制我的完整代码并按照我在界面构建器设计中展示的方式设计您的界面。 这是一个非常优雅的答案 - 我喜欢它如何考虑您可能设置的任何插图 - 谢谢! 按预期工作。非常感谢 (0_0)【参考方案2】:

确保您的协议与您的 ViewController 确认,

class ViewController: UIViewController,UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout

并将 flow layout 设置为您的 collectionview 对象

viewDidLoad

let layout = UICollectionViewFlowLayout()
layout.scrollDirection = .vertical //.horizontal
layout.minimumLineSpacing = 5
layout.minimumInteritemSpacing = 5
collectionView.setCollectionViewLayout(layout, animated: true)

并实现以下方法

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets 
    return UIEdgeInsets(top: 1.0, left: 1.0, bottom: 1.0, right: 1.0)//here your custom value for spacing


func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
    let lay = collectionViewLayout as! UICollectionViewFlowLayout
    let widthPerItem = collectionView.frame.width / 2 - lay.minimumInteritemSpacing
    
    return CGSize(width:widthPerItem, height:100)

【讨论】:

相应地做 @karthikeyani 我说我正在按照你的步骤操作 是的..它来了..你能告诉我如何减少两个项目之间的空间。 如果对您有帮助,请告诉我们 在此处更改您的值 return UIEdgeInsets(top: 1.0, left: 1.0, bottom: 1.0, right: 1.0)【参考方案3】:

将此代码添加到 viewDidLoad。 根据你改变高度。

试试这个!

if let layout = collectionView?.collectionViewLayout as? UICollectionViewFlowLayout
        layout.minimumLineSpacing = 10
        layout.minimumInteritemSpacing = 10
        layout.sectionInset = UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 10)
        let size = CGSize(width:(collectionView!.bounds.width-30)/2, height: 250)
        layout.itemSize = size

【讨论】:

【参考方案4】:

我已经实现了以下代码,以在集合视图中显示两列。

添加UICollectionViewDelegateFlowLayout的如下方法方法:

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
    let size = (collectionView.frame.size.width - 30) / 2
    return CGSize(width: size, height: size)

其中 30 代表单元格之间的左侧、右侧和中间空间。

即单元格应在左侧添加 10 像素,在右侧添加 10 像素,在两个单元格之间添加 10 像素。

从情节提要和尺寸检查器中选择collectionview,并按照最小间距设置。

我希望这能解决你的问题。

如果有任何疑问,请告诉我。

【讨论】:

发生了什么? 发布截图 你连接collectionView的Delegate了吗? 我必须在哪里给 30? 如果不是项目,你能分享你的演示吗?【参考方案5】:

Swift 5 和 XCode 12.4 更新

    import UIKit

class TwoColumnViewController: UIViewController 

    enum Section 
        case main
    

    var dataSource: UICollectionViewDiffableDataSource<Section, Int>! = nil
    var collectionView: UICollectionView! = nil

    override func viewDidLoad() 
        super.viewDidLoad()
        navigationItem.title = "Two-Column Grid"
        configureHierarchy()
        configureDataSource()
    


extension TwoColumnViewController 
    /// - Tag: TwoColumn
    func createLayout() -> UICollectionViewLayout 
        let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),
                                             heightDimension: .fractionalHeight(1.0))
        let item = NSCollectionLayoutItem(layoutSize: itemSize)

        let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),
                                              heightDimension: .absolute(44))
        let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitem: item, count: 2)
        let spacing = CGFloat(10)
        group.interItemSpacing = .fixed(spacing)

        let section = NSCollectionLayoutSection(group: group)
        section.interGroupSpacing = spacing
        section.contentInsets = NSDirectionalEdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10)

        let layout = UICollectionViewCompositionalLayout(section: section)
        return layout
    


extension TwoColumnViewController 
    func configureHierarchy() 
        collectionView = UICollectionView(frame: view.bounds, collectionViewLayout: createLayout())
        collectionView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        collectionView.backgroundColor = .systemBackground
        view.addSubview(collectionView)
    
    func configureDataSource() 
        let cellRegistration = UICollectionView.CellRegistration<TextCell, Int>  (cell, indexPath, identifier) in
            // Populate the cell with our item description.
            cell.label.text = "\(identifier)"
            cell.contentView.backgroundColor = .cornflowerBlue
            cell.layer.borderColor = UIColor.black.cgColor
            cell.layer.borderWidth = 1
            cell.label.textAlignment = .center
            cell.label.font = UIFont.preferredFont(forTextStyle: .title1)
        
        
        dataSource = UICollectionViewDiffableDataSource<Section, Int>(collectionView: collectionView) 
            (collectionView: UICollectionView, indexPath: IndexPath, identifier: Int) -> UICollectionViewCell? in
            // Return the cell.
            return collectionView.dequeueConfiguredReusableCell(using: cellRegistration, for: indexPath, item: identifier)
        

        // initial data
        var snapshot = NSDiffableDataSourceSnapshot<Section, Int>()
        snapshot.appendSections([.main])
        snapshot.appendItems(Array(0..<94))
        dataSource.apply(snapshot, animatingDifferences: false)
    



 

【讨论】:

如何使用for循环在页面控件中打印数组(swift4)

】如何使用for循环在页面控件中打印数组(swift4)【英文标题】:Howtouseforlooptoprintarrayinapagecontrol(swift4)【发布时间】:2018-03-1615:18:26【问题描述】:我的代码现在使用for循环来打印放置在资产文件夹中的图像。我想使用标签对... 查看详情

如何在 swift4 中使用 Rxalamofire 发送 URL 请求

】如何在swift4中使用Rxalamofire发送URL请求【英文标题】:HowtosendURLRequestusingRxalamofireinswift4【发布时间】:2019-04-0313:18:54【问题描述】:实际上我是iOS新手,现在我的任务是使用Rxalamofire发送URL请求。我完全不知道Rxalamofire。以前... 查看详情

如何在 Firebase Analytics 中查看所有设备列表?

】如何在FirebaseAnalytics中查看所有设备列表?【英文标题】:HowtoseealldevicelistinFirebaseAnalytics?【发布时间】:2017-03-1305:57:59【问题描述】:在我们的应用中,我们使用FCM,因此Firebase分析也可以正常工作。但是,从仪表板中,我们... 查看详情

如何在所有设备中快速布局每行三个图像

】如何在所有设备中快速布局每行三个图像【英文标题】:Howtolayoutthreeimagesperrowinalldevicesswift【发布时间】:2018-07-0111:48:08【问题描述】:所以基本上我有一个看起来像这样的集合视图布局:这是一张每行3张的图片,像instagram... 查看详情

在 Swift4 中取消选中 TableView 所有 TableView 选择

】在Swift4中取消选中TableView所有TableView选择【英文标题】:UncheckTableViewallTableViewSelectionsinSwift4【发布时间】:2018-06-0317:26:56【问题描述】:我已经搜索并没有看到解决方案:我有一个允许多选的tableView我想在Swift中设置一个按钮... 查看详情

如何在 Android 设备中找到所有只读存储?

】如何在Android设备中找到所有只读存储?【英文标题】:HowtofindallreadOnlyStorageinAndroiddevices?【发布时间】:2015-07-0707:29:49【问题描述】:我为我糟糕的英语语法道歉。我想知道android设备是否在同一设备中同时具有只读和读/写存... 查看详情

在 iOS 12 中检查设备是不是连接到 ***

...检查在iOS12及更高版本中无法运行的iOS设备上的***连接。如何在iOS12中检查***连接funcis***Connected()-> 查看详情

如何在 AWS Device Farm CLI 上的设备池中添加单个设备?

】如何在AWSDeviceFarmCLI上的设备池中添加单个设备?【英文标题】:HowtoaddSingleDeviceinDevicePoolonAWSDeviceFarmCLI?【发布时间】:2019-01-0520:16:39【问题描述】:我正在使用AWSCLI来安排项目构建。我已经使用设备池(所有Android设备)使用A... 查看详情

如何在 Android Studio 中使用虚拟设备测试麦克风功能

】如何在AndroidStudio中使用虚拟设备测试麦克风功能【英文标题】:HowtotestmicrophonefunctionswithVirtualDevicesinAndroidStudio【发布时间】:2020-08-0419:15:28【问题描述】:我正在编写一个需要使用设备麦克风的Android应用。为了测试我的应用... 查看详情

如何在swift4中动态添加滚动视图

】如何在swift4中动态添加滚动视图【英文标题】:Howtoaddscrollviewdynamicallyinswift4【发布时间】:2018-04-2406:42:21【问题描述】:我创建了一个视图,其中包含一个图像和一个文本视图(动态变化)和一个按钮。此视图嵌入在UIScrollVie... 查看详情

Swift 4.2 - 如何在枚举函数中使用警报?

】Swift4.2-如何在枚举函数中使用警报?【英文标题】:Swift4.2-HowtouseanAlertinaenumfunction?【发布时间】:2018-09-1011:16:44【问题描述】:我知道了#ifos(iOS)importUIKitimportFoundation#elseifos(OSX)importFoundationimportcocoa#else//Futureconcerns#endifenumImage 查看详情

如何在自动布局中设计 3x3 按钮支持所有使用 Storyboard 的 iPhone 设备

】如何在自动布局中设计3x3按钮支持所有使用Storyboard的iPhone设备【英文标题】:Howtodesign3x3buttonsinautolayoutsupportalliPhonedevicesusingStoryboard【发布时间】:2015-10-2711:33:28【问题描述】:我需要帮助来设计视图控制器中的3x3按钮。它适... 查看详情

如何使用 ALAssets 获取设备中的所有图像?

】如何使用ALAssets获取设备中的所有图像?【英文标题】:HowtogetallimagesindevicewithALAssets?【发布时间】:2014-06-1007:37:40【问题描述】:我是新的iOS开发人员,我正在尝试获取设备中的所有图像。它在模拟器和iPhone4,4s(iOS6.0->7.1... 查看详情

如何使用 Firebase Cloud Messaging 向所有设备发送通知

】如何使用FirebaseCloudMessaging向所有设备发送通知【英文标题】:HowtosendnotificationstoalldevicesusingFirebaseCloudMessaging【发布时间】:2016-07-1801:37:07【问题描述】:在Firebase文档中,它始终有一个带有设备/令牌ID的“to”字段......但我怎... 查看详情

如何在情节提要中使用自动布局在不同设备尺寸上设置动态位置的约束

】如何在情节提要中使用自动布局在不同设备尺寸上设置动态位置的约束【英文标题】:Howtosetupconstraintsinstoryboardwithautolayoutfordynamicpositionondifferentdevicesizes【发布时间】:2017-02-0808:40:53【问题描述】:如果我想保证多屏支持以便... 查看详情

如何在 Swift 4 中使用 respondsToSelector 验证来自 HomeKit 的值的方法字节

】如何在Swift4中使用respondsToSelector验证来自HomeKit的值的方法字节【英文标题】:HowtovalidatemethodbytesusingrespondsToSelectorforvaluefromHomeKitinSwift4【发布时间】:2018-05-1806:18:51【问题描述】:下面是我要转换成Swift4的代码,我可以看到res... 查看详情

如何在 IBM MFP 中获取所有现有的推送设备注册

】如何在IBMMFP中获取所有现有的推送设备注册【英文标题】:HowtogetallexistingdeviceregistrationsofpushinIBMMFP【发布时间】:2018-07-0604:58:39【问题描述】:我已按照其余API(链接如下)教程获取MFP中推送通知的所有设备注册。但我得到... 查看详情

如何在 Firefox 89 中打开同步设备中的所有选项卡?

】如何在Firefox89中打开同步设备中的所有选项卡?【英文标题】:HowtoopenalltabsfromthesynceddevicesinFirefox89?【发布时间】:2021-08-2307:01:25【问题描述】:上次更新后,无法右键单击同步设备->打开所有选项卡。同步的选项卡面板在... 查看详情