Swift SkeletonView는 iOS 앱에서 로딩 상태를 시각적으로 표현하기 위한 라이브러리입니다. 이 라이브러리를 사용하면 로딩 중인 상태에서 앱의 화면에 적절한 Skeleton UI를 보여줄 수 있습니다. 기기의 크기나 화면 비율에 따라 Skeleton UI를 다르게 표현하고 싶을 때는 기기를 감지하는 방법을 사용할 수 있습니다.
UIDevice를 이용한 기기 감지
Swift에서 기기를 감지하기 위해 UIDevice 클래스를 사용할 수 있습니다. UIDevice.current를 통해 현재 기기에 대한 정보에 접근할 수 있습니다. 다음은 기기의 크기에 따라 Skeleton UI를 다르게 설정하는 예제 코드입니다.
import SkeletonView
func setSkeletonUI() {
let device = UIDevice.current
let screenWidth = UIScreen.main.bounds.width
if screenWidth <= 320 { // iPhone 5, SE
view.showAnimatedGradientSkeleton()
} else if screenWidth <= 375 { // iPhone 6, 7, 8, X
view.showAnimatedGradientSkeleton(usingGradient: .init(baseColor: .systemGray))
} else { // iPad or larger devices
view.showAnimatedGradientSkeleton(usingGradient: .init(baseColor: .systemBlue))
}
}
위 코드는 setSkeletonUI() 함수에서 현재 기기의 화면 너비를 확인하고, 너비에 따라 적절한 Skeleton UI를 설정합니다. iPhone 5/SE와 같은 작은 기기에서는 기본 Skeleton UI를 사용하고, 그 이상의 큰 기기에서는 다른 색상의 Skeleton UI를 사용하도록 하였습니다.
화면 회전 감지
또 다른 기기 감지 방법으로는 화면의 회전을 감지하여 Skeleton UI를 설정하는 방법이 있습니다. NotificationCenter를 사용하여 화면 회전 이벤트를 감지할 수 있습니다. 다음은 화면 회전에 따라 Skeleton UI를 설정하는 예제 코드입니다.
import SkeletonView
override func viewDidLoad() {
super.viewDidLoad()
NotificationCenter.default.addObserver(self, selector: #selector(orientationDidChange), name: UIDevice.orientationDidChangeNotification, object: nil)
}
@objc func orientationDidChange() {
if UIDevice.current.orientation.isLandscape {
view.showAnimatedSkeleton(usingColor: .systemRed)
} else {
view.showAnimatedGradientSkeleton()
}
}
위 코드는 orientationDidChange() 메서드를 통해 화면 회전 이벤트를 감지하고, 회전 방향에 따라 적절한 Skeleton UI를 설정합니다. 가로 방향일 때는 빨간색 Skeleton UI를, 세로 방향일 때는 기본 Skeleton UI를 사용하도록 하였습니다.