কীভাবে সেল স্পেসিং এবং ইউআইকোলিকেশনভিউ - ইউআইকোল্লেশনভিউফ্লোআউটআউট আকারের অনুপাত সেট করবেন?

Question

আমি যুক্ত UICollectionViewকরার চেষ্টা করছি ViewControllerএবং আমার কাছে প্রতি সারিতে 3 টি সেল থাকতে হবে (ঘরগুলির মতো দেখতে এটি দেখতে হবে) কোষগুলির মধ্যে ফাঁকা জায়গা ছাড়াই 'প্রতি সারি প্রতি' সেল থাকতে হবে। কক্ষের প্রস্থ পর্দার আকারের এক তৃতীয়াংশ হওয়া উচিত, তাই আমি ভেবেছিলাম যে layout.itemপ্রস্থটি একই হওয়া উচিত। তবে আমি এটি পেয়েছি:

যদি আমি সেই আকারটি হ্রাস করি ( উদাহরণস্বরূপ 7 বা ৮ পিক্সেল দিয়ে ) তবে এটি আরও ভাল তবে সারির তৃতীয় ঘরটি সম্পূর্ণরূপে দৃশ্যমান নয় এবং আমার এখনও শূন্য স্থান (উপরে এবং নীচে এবং বাম এবং ডানদিকে) রয়েছে।

class ViewController: UIViewController, UICollectionViewDelegateFlowLayout, UICollectionViewDataSource {
    var collectionView: UICollectionView?
    var screenSize: CGRect!
    var screenWidth: CGFloat!
    var screenHeight: CGFloat!

    override func viewDidLoad() {
        super.viewDidLoad()

        screenSize = UIScreen.mainScreen().bounds
        screenWidth = screenSize.width
        screenHeight = screenSize.height

        // Do any additional setup after loading the view, typically from a nib
        let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsets(top: 20, left: 0, bottom: 10, right: 0)
        layout.itemSize = CGSize(width: screenWidth / 3, height: screenWidth / 3)
        collectionView = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)
        collectionView!.dataSource = self
        collectionView!.delegate = self
        collectionView!.registerClass(CollectionViewCell.self, forCellWithReuseIdentifier: "CollectionViewCell")
        collectionView!.backgroundColor = UIColor.greenColor()
        self.view.addSubview(collectionView!)
    }

    func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
        return 1
    }

    func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 20
    }

    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCellWithReuseIdentifier("CollectionViewCell", forIndexPath: indexPath) as CollectionViewCell
        cell.backgroundColor = UIColor.whiteColor()
        cell.layer.borderColor = UIColor.blackColor().CGColor
        cell.layer.borderWidth = 0.5
        cell.frame.size.width = screenWidth / 3
        cell.frame.size.height = screenWidth / 3

        cell.textLabel?.text = "\(indexPath.section):\(indexPath.row)"
        return cell
    }
}

Comments

আপনার সমাধান এখানে । ধন্যবাদ।

— জানু কানসাগ্রা

এখানে সুইফট 4 স্ট্যাকওভারফ্লো.com

— a/54703798/

Answer 1

এই 2 লাইন যুক্ত করুন

layout.minimumInteritemSpacing = 0
layout.minimumLineSpacing = 0

সুতরাং তোমার আছে:

   // Do any additional setup after loading the view, typically from a nib.
        let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsets(top: 20, left: 0, bottom: 10, right: 0)
        layout.itemSize = CGSize(width: screenWidth/3, height: screenWidth/3)
        layout.minimumInteritemSpacing = 0
        layout.minimumLineSpacing = 0
        collectionView!.collectionViewLayout = layout

এটি সমস্ত স্থান সরিয়ে দেবে এবং আপনাকে গ্রিড লেআউট দেবে:

আপনি যদি প্রথম কলামটির পর্দার প্রস্থের সমান প্রস্থের চান তবে নিম্নলিখিত ফাংশনটি যুক্ত করুন:

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    if indexPath.row == 0
    {
        return CGSize(width: screenWidth, height: screenWidth/3)
    }
    return CGSize(width: screenWidth/3, height: screenWidth/3);

}

গ্রিড লেআউটটি এখন দেখতে দেখতে (আমি প্রথম ঘরে একটি নীল পটভূমিও যুক্ত করেছি):

Comments

আপনাকে অনেক ধন্যবাদ, আমি আরও জটিল কিছু প্রত্যাশা করছিলাম এবং আমি এটিতে অনেক সময় ব্যয় করেছি। ধন্যবাদ আরও একবার।

— মার্কো 5'15

এবং আরও একটি বিষয়, কেবল প্রথম সেলটির জন্য লেআউট.আইটিম সাইজ পরিবর্তন করার কোনও সম্ভাবনা আছে ? (আমি জানি যে ইনডেক্সপথ.রো 0 হলে আমার সেল.ফ্রেম.সাইজ পরিবর্তন করা দরকার তবে কেবলমাত্র একটি আইটেমের জন্য কীভাবে বিন্যাসের আকার পরিবর্তন করতে হবে তা জানেন না) প্রথম উপাদানটির প্রস্থের স্ক্রিনউইথের সমান হওয়া উচিত ।

— মার্কো

হাই, আমার একই সমস্যা আছে তবে আমি একই রকম ফাংশন শিরোনামটি উদ্দেশ্য সিতে জানতে চাই।

— নদা গামাল

ঠিক আছে, এটি এখন দুর্দান্ত কাজ করে, অনেক ধন্যবাদ :) উদ্দেশ্য সি ক্রিয়াকলাপ: - (সিজি সাইজ ) কালেকটিউ ভিউ: (ইউআইকোলিকেশনভিউ ) সংগ্রহ ভিউ লেআউট: (ইউআইসিএল্লেক্সভিউলআউট ) সংগ্রহভিউ লেআউট আকারের আইটেমএটিএন্ডেক্সপথ: (এনএসআইন্ডেক্সপথ *) ইনডেক্সপথ {স্ক্রিনউইড / স্ক্রিনভিড ); }

— গামাল

মহান উত্তর @ গ্রেন্টর জন্য ধন্যবাদ। একটি অনুদান প্রেরণ। ভুলবেন না ! CollectionView .collectionViewLayout = বিন্যাস , পাঠকরা

— Fattie

Answer 2

সুইফ্ট 3 এবং এক্সকোড 8 এর জন্য , এটি কাজ করেছিল। এটি অর্জনের জন্য নীচের পদক্ষেপগুলি অনুসরণ করুন: -

{
    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
    let width = UIScreen.main.bounds.width
    layout.sectionInset = UIEdgeInsets(top: 0, left: 5, bottom: 0, right: 5)
    layout.itemSize = CGSize(width: width / 2, height: width / 2)
    layout.minimumInteritemSpacing = 0
    layout.minimumLineSpacing = 0
    collectionView!.collectionViewLayout = layout
}

এই কোডটি ভিউডিডলোড () ফাংশনে রাখুন।

Answer 3

কিছু নির্দিষ্ট পরিস্থিতিতে, কালেক্টভিউ- UICollectionViewFlowLayoutএ সেট করা viewDidLoadবা ViewWillAppearনাও লাগতে পারে।

সেট UICollectionViewFlowLayoutমধ্যে viewDidAppearরানটাইম কোষ আকারের পরিবর্তন দেখতে হতে পারে।

আরও একটি সমাধান, সুইফ্ট 3 এ:

extension YourViewController : UICollectionViewDelegateFlowLayout{

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {
        return UIEdgeInsets(top: 20, left: 0, bottom: 10, right: 0)
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let collectionViewWidth = collectionView.bounds.width
        return CGSize(width: collectionViewWidth/3, height: collectionViewWidth/3)
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return 0
    }
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return 20
    }
}

Comments

দুর্দান্ত উত্তর! এটি অবশ্যই এটি করার অ্যাপল উপায়। এখন, ডিভাইস ওরিয়েন্টেশন পরিবর্তিত হলে কীভাবে রিফ্রেশ করবেন তা আপনি জানেন না?

— jlstr

Answer 4

আপনি যদি সুইফট 3 খুঁজছেন, এটি অর্জনের জন্য পদক্ষেপগুলি অনুসরণ করুন:

func viewDidLoad() {

    //Define Layout here
    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()

    //Get device width
    let width = UIScreen.main.bounds.width

    //set section inset as per your requirement.
    layout.sectionInset = UIEdgeInsets(top: 0, left: 5, bottom: 0, right: 5)

    //set cell item size here 
    layout.itemSize = CGSize(width: width / 2, height: width / 2)

    //set Minimum spacing between 2 items
    layout.minimumInteritemSpacing = 0

    //set minimum vertical line spacing here between two lines in collectionview
    layout.minimumLineSpacing = 0

    //apply defined layout to collectionview
    collectionView!.collectionViewLayout = layout

}

এটি সুইচ 3 এর সাথে এক্সকোড 8.0 এ যাচাই করা হয়েছে।

Answer 5

let layout = myCollectionView.collectionViewLayout as? UICollectionViewFlowLayout
layout?.minimumLineSpacing = 8

Answer 6

সুইফট 4

let collectionViewLayout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout
collectionViewLayout?.sectionInset = UIEdgeInsetsMake(0, 20, 0, 40) 
collectionViewLayout?.invalidateLayout()

Answer 7

সুইফ্ট 3 এবং এক্সকোড 8 এর জন্য, এটি কাজ করেছিল। এটি অর্জনের জন্য নীচের পদক্ষেপগুলি অনুসরণ করুন: -

viewDidLoad()
    {
        let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        var width = UIScreen.main.bounds.width
        layout.sectionInset = UIEdgeInsets(top: 0, left: 5, bottom: 0, right: 5)
    width = width - 10
    layout.itemSize = CGSize(width: width / 2, height: width / 2)
        layout.minimumInteritemSpacing = 0
        layout.minimumLineSpacing = 0
        collectionView!.collectionViewLayout = layout
    }

Comments

আপনার যদি একাধিক বিভাগ থাকে তবে কীভাবে সত্যতা বিবেচনা করবেন

— নিখিল পান্ডে

এটি শুধুমাত্র 1 কলামের জন্য (বিভাগ)

— ব্যবহারকারীর 24

Answer 8

সুইফ্ট 3+ এবং এক্সকোড 9+ এর জন্য এটি ব্যবহার করে দেখুন

extension ViewController: UICollectionViewDelegateFlowLayout {

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

    let collectionWidth = collectionView.bounds.width
    return CGSize(width: collectionWidth/3, height: collectionWidth/3)

}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat {
    return 0
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
    return 0

}

Answer 9

সুইফট 5: গতিশীল কক্ষের প্রস্থ সহ কক্ষগুলির মধ্যে সমানভাবে বিতরণ স্থানগুলির জন্য কন্টেইনার স্পেসের সেরাটি তৈরি করতে আপনি নীচের কোড স্নিপেট ব্যবহার করতে পারেন একটি ন্যূনতমকেলভিডথ মান সরবরাহ করে।

private func collectionViewLayout() -> UICollectionViewLayout {
    
    let layout = UICollectionViewFlowLayout()
    layout.sectionHeadersPinToVisibleBounds = true
    // Important: if direction is horizontal use minimumItemSpacing instead. 
    layout.scrollDirection = .vertical
    
    let itemHeight: CGFloat = 240
    let minCellWidth :CGFloat = 130.0
    let minItemSpacing: CGFloat = 10
    let containerWidth: CGFloat = self.view.bounds.width
    let maxCellCountPerRow: CGFloat =  floor((containerWidth - minItemSpacing) / (minCellWidth+minItemSpacing ))
    
    let itemWidth: CGFloat = floor( ((containerWidth - (2 * minItemSpacing) - (maxCellCountPerRow-1) * minItemSpacing) / maxCellCountPerRow  ) )
    // Calculate the remaining space after substracting calculating cellWidth (Divide by 2 because of left and right insets)
    let inset = max(minItemSpacing, floor( (containerWidth - (maxCellCountPerRow*itemWidth) - (maxCellCountPerRow-1)*minItemSpacing) / 2 ) )

    
    layout.itemSize = CGSize(width: itemWidth, height: itemHeight)
    layout.minimumInteritemSpacing = min(minItemSpacing,inset)
    layout.minimumLineSpacing = minItemSpacing
    layout.sectionInset = UIEdgeInsets(top: minItemSpacing, left: inset, bottom: minItemSpacing, right: inset)

    
    return layout
}