Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Slice an Image into Tiles and Store in an Array Using Swift iOS App

    • 0
    • 0
    • 0
    • 0
    • 1
    • 0
    • 1
    • 0
    • 2.72k
    Comment on it

    This is a small sample of how we can split an image into multiple pieces/tiles and store these small pieces into an array and further we will show, how these pieces are rearranged to form an image.

     


    So let start with slicing our image into small pieces or tiles.


    Here we will split an image into n X m pieces. Pass number of rows and column you want to slice your image in splitImage function.

    func splitImage(row : Int , column : Int){
            
            let oImg = imgView.image
        
            let height =  (imgView.image?.size.height)! /  CGFloat (row) //height of each image tile
            let width =  (imgView.image?.size.width)!  / CGFloat (column)  //width of each image tile
            
            let scale = (imgView.image?.scale)! //scale conversion factor is needed as UIImage make use of "points" whereas CGImage use pixels.
            
            imageArr = [[UIImage]]() // will contain small pieces of image
            for y in 0..<row{
                var yArr = [UIImage]()
                for x in 0..<column{
                    
                    UIGraphicsBeginImageContextWithOptions(
                        CGSize(width:width, height:height),
                        false, 0)
                    let i =  oImg?.cgImage?.cropping(to:  CGRect.init(x: CGFloat(x) * width * scale, y:  CGFloat(y) * height * scale  , width: width * scale  , height: height * scale) )
                    
                    let newImg = UIImage.init(cgImage: i!)
                    
                    yArr.append(newImg)
                    
                     UIGraphicsEndImageContext();
                    
                }
                
                imageArr.append(yArr)
            }
            
        }
    

     

    Once done with the above code we will get an array of image tiles now its time to rearrange these small tiles into an image. You can also shuffle the array of tiles image to make it an image puzzle. So here is the code for the same: 

    func createNewImage(imgArr : [[UIImage]]){
            
            let row = imageArr.count
            let column = imageArr[0].count
            let height =  (imgView.frame.size.height) /  CGFloat (row )
            let width =  (imgView.frame.size.width) / CGFloat (column )
        
           
            UIGraphicsBeginImageContext(CGSize.init(width: imgView.frame.size.width , height: imgView.frame.size.height))
            
            for y in 0..<row{
                
                for x in 0..<column{
                    
                let newImage = imgArr[y][x]
      
                    newImage.draw(in: CGRect.init(x: CGFloat(x) * width, y:  CGFloat(y) * height  , width: width - 1  , height: height - 1 ))
           
                }
            }
            
            let originalImg = UIGraphicsGetImageFromCurrentImageContext()
             UIGraphicsEndImageContext();
            imgView.image = originalImg
        }
    

    Thanks

    Slice an Image into Tiles and Store in an Array Using Swift iOS App

 1 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: