I want to number the pictures selected in the collectionView

Asked 2 years ago, Updated 2 years ago, 97 views

We are currently creating an ImagePicker feature that allows you to select multiple photos.

Therefore, we have reached the point where we can display the captured photos in UICollectionView.

What I want to do next is as shown in the image below.

Enter a description of the image here

I wondered if I should use didSelectRowAtIndexPath in UICollectionViewDelegate, but I didn't know how to implement it to number the selected photos.

Please tell me how to do it.

ios swift xcode uicollectionview uicollectionviewcell

2022-09-30 20:57

1 Answers

I'll put the instructions that I'll implement it like this.

First, prepare the following:

  • UICollectionViewCell selection number update method
  • Array holding the selected indexPath

collectionView(_:didSelectItemAtIndexPath:) adds the selected indexPath to the array.If it has already been added, delete it.At the same time, update the selection number to collectionView.visibleCells().

The selection number can be determined by "what number in the array".For Swift 1.2, you can find it in the global function find(), and for Swift 2.0, you can find it in the protocol extension indexOf().

collectionView.reloadData(), but reloading the entire cell is probably not the intended behavior.collectionView.visibleCells() can retrieve cells that are currently visible, so you should update the selection number for all of them.

addition:Example Code (Swift 2.0)

 var selection: NSIndexPath = [ ]

override function collectionView(collectionView:UICollectionView, didSelectItemAtIndexPath:NSIndexPath){
    // Add if present in the selection array, otherwise delete
    iflet index=selection.indexOf(indexPath){
        selection.removeAtIndex(index)
    } else{
        selection.append(indexPath)
    }

    // update all visible cells
    collectionView.visibleCells().map {updateCell($0)}

    collectionView.deselectItemAtIndexPath(indexPath, animated:true)
}

US>func updateCell(cell:UICollectionViewCell){
    // Reverse indexPath from Cell, otherwise return
    guardlet indexPath=self.collectionView?indexPathForCell(cell)else{
        return
    }
    // Get UILabel for selection number from Cell
    Let numLabel: UILabel=cell.viewWithTag(NUMBER_LABEL) as!UILabel
    // Show selection number and frame if indexPath is present in array, otherwise hide
    iflet index=selection.indexOf(indexPath){
        cell.contentView.layer.borderColor=UIColor.blueColor().CGColor
        cell.contentView.layer.borderWidth=4.0
        numLabel.hidden=false
        // Search results index +1 can be used as a selection number
        numLabel.text="\(index+1)"
    } else{
        cell.contentView.layer.borderColor=UIColor.clearColor().CGColor
        cell.contentView.layer.borderWidth=0.0
        numLabel.hidden=true
    }
}

re-add:For Swift 1.2 (slightly forgotten)

 var selection: NSIndexPath = [ ]

override function collectionView(collectionView:UICollectionView, didSelectItemAtIndexPath:NSIndexPath){
    iflet index=find(selection, indexPath){
        selection.removeAtIndex(index)
    } else{
        selection.append(indexPath)
    }

    // Update all visible cells (can be a for loop normally!)
    collectionView.visibleCells().map({(cell:AnyObject)->Void in
        self.updateCell (cell as!UICollectionViewCell)
    })
}

US>func updateCell(cell:UICollectionViewCell){
    Let numLabel: UILabel=cell.viewWithTag(NUMBER_LABEL) as!UILabel        
    iflet indexPath=self.collectionView?.indexPathForCell(cell){

        iflet index=find(selection, indexPath){
            cell.contentView.layer.borderColor=UIColor.blueColor().CGColor
            cell.contentView.layer.borderWidth=4.0
            numLabel.hidden=false
            numLabel.text="\(index+1)"
        } else{
            cell.contentView.layer.borderColor=UIColor.clearColor().CGColor
            cell.contentView.layer.borderWidth=0.0
            numLabel.hidden=true
        }
    }
}


2022-09-30 20:57

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.