PHPFixing
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • PHP
  • Programming
  • SQL Injection
  • Web3.0

Wednesday, July 27, 2022

[FIXED] How to cut an image into 2 using SwiftUI

 July 27, 2022     crop, geometryreader, image, swiftui, uiimage     No comments   

Issue

I have an image like this enter image description here

I'd like to split it into 2 pieces across the center using SwiftUI. Leaving me with 2 separate images that I can access. However I can't figure out how to split the original into a top and bottom piece. The two pieces must line up to create the original image.

Top Image: enter image description here

Bottom Image: enter image description here

I've tried use a geometry reader to read the height and width and return an image with half the height, but the two images don't like up like this.

GeometryReader { geo in
    image
       .frame(width: geo.width, height: geo.height / 2, alignment: .center)
       .clipped()
}

Solution

Here a way of doing this: with using clipped() modifier.


enter image description here


struct ContentView: View {
    
    @State private var spacing: CGFloat = CGFloat()
    @State private var imageSize: CGSize = CGSize()
    
    var body: some View {
        
        let image = Image(systemName: "star")
            .resizable()
            .scaledToFit()
            .frame(width: 200, height: 200, alignment: .center)
            .background(Color.yellow)
            .cornerRadius(10.0)
            .background(GeometryReader { proxy in Color.clear.onAppear() { imageSize = proxy.size } })
        
        
        return ZStack {
            
            VStack(spacing: spacing) {
                
                image.frame(width: imageSize.width, height: imageSize.height/2, alignment: .top).clipped()
                
                image.frame(width: imageSize.width, height: imageSize.height/2, alignment: .bottom).clipped()
            }
            
            VStack { Spacer(); Slider(value: $spacing,in: 0.0...100.0) }
            
        }
        .padding()
        .compositingGroup()
        .shadow(radius: 10.0)
        
    }
}


Answered By - swiftPunk
Answer Checked By - Pedro (PHPFixing Volunteer)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Stumble
  •  Digg
Newer Post Older Post Home

0 Comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Total Pageviews

Featured Post

Why Learn PHP Programming

Why Learn PHP Programming A widely-used open source scripting language PHP is one of the most popular programming languages in the world. It...

Subscribe To

Posts
Atom
Posts
Comments
Atom
Comments

Copyright © PHPFixing