본문 바로가기
Ios/Swift UI

Swift UI 메서드 정리 ( 계속 추가 )

by 잘먹는 개발자 에단 2024. 7. 24.

1. resizable()

- 이미지를 재조정할 수 있게 한다. 

- 원본의 크기를 무시하고 뷰의 크기에 맞게 조정할 수 있다. 

import SwiftUI

struct ContentView: View {
    var body: some View {
        Image("exampleImage") // 이미지 이름
            .resizable() // 이미지를 재조정할 수 있게 함
            .aspectRatio(contentMode: .fit) // 뷰의 비율을 유지하면서 맞춤
            .frame(width: 100, height: 100) // 프레임 크기 설정
    }
}

 

 

2. scaledToFill()

- 이미지가 뷰의 프레임을 채우도록 크기를 조정한다.

- 뷰의 크기를 채우기 위해서 이미지를 확대 또는 축소할 수 있다.

import SwiftUI

struct ContentView: View {
    var body: some View {
        Image("exampleImage") // 이미지 이름
            .resizable() // 이미지를 재조정할 수 있게 함
            .scaledToFill() // 뷰의 프레임을 채우도록 크기 조정
            .frame(width: 100, height: 100) // 프레임 크기 설정
            .clipped() // 프레임을 벗어나는 부분을 잘라냄
    }
}

 

 

3. clipped()

- 뷰의 경계를 넘는 내용을 자른다.

- 주로 뷰의 경계 내에 컨텐츠를 제한하기 위해서 사용된다.

import SwiftUI

struct ContentView: View {
    var body: some View {
        Image("exampleImage") // 이미지 이름
            .resizable() // 이미지를 재조정할 수 있게 함
            .scaledToFill() // 뷰의 프레임을 채우도록 크기 조정
            .frame(width: 100, height: 100) // 프레임 크기 설정
            .clipped() // 프레임을 벗어나는 부분을 잘라냄
    }
}

 

 

 

4. listRowInsets()

- 리스트 항목의 패딩(인셋)을 설정한다. 

- 주로 리스트 항목 사이의 간격을 조정할 때 사용된다. 

import SwiftUI

struct ContentView: View {
    var body: some View {
        List {
            Text("First Item")
                .listRowInsets(EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 20)) // 인셋 설정
            Text("Second Item")
                .listRowInsets(EdgeInsets(top: 10, leading: 20, bottom: 10, trailing: 20)) // 인셋 설정
        }
    }
}

 

 

5. padding()

- 패딩을 설정한다. 

- 모든방향에 동일한 기본패딩 : .padding()

- 특정 값으로 모든 방향에 패딩 설정 : .padding(20)

- 특정 방향에 패딩설정 : .padding(.top, 10)   .top, .leading, .trailing, .bottom

- EdgeInsets를 사용하여 패딩을 설정 : .padding(EdgeInsets(top : 10, leading : 20, bottom : 30, trailing : 20)

- 수평방향으로 20패딩 추가 : .padding(.horizontal, 20)

 

6. frame()

- 뷰의 크기와 위치, 정렬을 설정

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .frame(width: 200, height: 100, alignment: .center) // 크기와 정렬 설정
    }
}

 

 

7. background()

- 뷰의 배경을 설정

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .padding()
            .background(Color.blue) // 배경 색상 설정
            .foregroundColor(.white) // 텍스트 색상 설정
    }
}

 

8. cornerRadius()

- 뷰의 모서리를 둥글게 만듦

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .padding()
            .background(Color.blue)
            .cornerRadius(10) // 모서리 반경 설정
    }
}

 

 

9. shadow()

- 뷰에 그림자를 추가

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .padding()
            .background(Color.blue)
            .cornerRadius(10)
            .shadow(color: .gray, radius: 5, x: 0, y: 5) // 그림자 설정
    }
}

 

 

10. overlay()

- 뷰 위에 다른 뷰를 겹친다.

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .padding()
            .background(Color.blue)
            .overlay(
                Text("Overlay Text")
                    .foregroundColor(.white)
                    .padding(5),
                alignment: .bottomTrailing // 오버레이 정렬
            )
    }
}

 

 

 

 

11. opacity()

- 뷰의 투명도를 설정한다.

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .padding()
            .background(Color.blue)
            .opacity(0.8) // 투명도 설정
    }
}

 

 

 

12. rotationEffect()

- 뷰를 회전시킨다.

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, SwiftUI!")
            .padding()
            .background(Color.blue)
            .rotationEffect(.degrees(45)) // 45도 회전
    }
}

 

 

 

13. hueRotation()

* hue : 색조

- 색상을 회전하여 색조를 변경하는 그래픽 및 이미지 처리 기술

import UIKit
import CoreImage

// 이미지 로드
let inputImage = UIImage(named: "example.jpg")!

// CIImage로 변환
let ciImage = CIImage(image: inputImage)!

// CIContext 생성
let context = CIContext(options: nil)

// CIHueAdjust 필터 생성
let hueAdjustFilter = CIFilter(name: "CIHueAdjust")!
hueAdjustFilter.setValue(ciImage, forKey: kCIInputImageKey)

// 색조 회전 각도 설정 (라디안 단위)
let angleInRadians = Float.pi / 4 // 45도
hueAdjustFilter.setValue(angleInRadians, forKey: kCIInputAngleKey)

// 필터 적용
let outputCIImage = hueAdjustFilter.outputImage!

// 결과 이미지 생성
if let cgImage = context.createCGImage(outputCIImage, from: outputCIImage.extent) {
    let outputImage = UIImage(cgImage: cgImage)
    
    // 결과 이미지를 사용 (예: UIImageView에 표시)
    let imageView = UIImageView(image: outputImage)
    imageView.frame = CGRect(x: 0, y: 0, width: 300, height: 300)
} else {
    print("이미지 생성 실패")
}

 

 

14. grayScale()

* 그레이스케일 변환 : 이미지의 색상을 흑백으로 변환하여 각 픽셀의 밝기만을 유지하는 작업

- CoreImage 프레임워크를 사용하여 이미지를 그레이스케일로 변환한다.

import UIKit
import CoreImage

// 이미지 로드
let inputImage = UIImage(named: "example.jpg")!

// CIImage로 변환
let ciImage = CIImage(image: inputImage)!

// CIContext 생성
let context = CIContext(options: nil)

// CIColorControls 필터 생성
let grayscaleFilter = CIFilter(name: "CIColorControls")!
grayscaleFilter.setValue(ciImage, forKey: kCIInputImageKey)

// 채도를 0으로 설정하여 그레이스케일 변환
grayscaleFilter.setValue(0.0, forKey: kCIInputSaturationKey)

// 필터 적용
let outputCIImage = grayscaleFilter.outputImage!

// 결과 이미지 생성
if let cgImage = context.createCGImage(outputCIImage, from: outputCIImage.extent) {
    let outputImage = UIImage(cgImage: cgImage)
    
    // 결과 이미지를 사용 (예: UIImageView에 표시)
    let imageView = UIImageView(image: outputImage)
    imageView.frame = CGRect(x: 0, y: 0, width: 300, height: 300)
} else {
    print("이미지 생성 실패")
}