Xcode Swift. Shimmer Animation 만들기

Xcode Swift. Shimmer Animation 만들기

 

저번 포스트에선 Xcode에서 그라데이션을 적용하는 방법을 알아보았는데,

 

이번에는  Shimmer 효과를 넣는 방법을 알아봅시다.

 

Shimmer란 "반짝임" 이란 뜻으로, 뷰가 반짝반짝이게 하는 효과를 가지고 있습니다.

 

글보단 눈으로 보는게 빠르겠죠?

오 버튼이 반짝반짝!! 이것만 있으면 이쁜 UI를 구성할 수 있겠군!

 

그렇다면 이제 적용시키는 방법을 알아봅시다.

 

우선 " ShimmerSwiftf " 라는 녀석을 import해주어야하는데,

 

그냥  xcode에서 바로 import해주려고하면 이녀석이 존재하지 않습니다!

 

ShimmerSwift가 가능하게 해주는 코코아팟을 설치하여야하는데요.

 

먼저 터미널을 킵시다.

 

터미널을 키신 다음 제가 만든 프로젝트 파일로 들어갑시다.

 

저는  Desktop안에 swiftPractice라는 폴더안에 ShimmerPractice라는 이름으로 만들었습니다.

 

자 이렇게 해당 파일로 넘어왔다면 이제 이 파일에 podFile을 설치하여 줍시다.

 

근데 OS에 코코아팟이 깔려있지않다면 다음과 같은 명령어도 코코아팟을 먼저 설치하여주세요

 

$ sudo gem install cocoapods

 

그 후,

$ pod init

$ open Podfile

 

그럼 다음과 같은 창이 생성될 탠데

 

다음과 같이 작성 해주시면 됩니다!

다른건 안건드르셔도 되고,   pod 'ShimmerSwift' 이 부분만 작성해주시면 됩니다.

 

그 후 Podfile을 닫고 터미널에서 

 

$ pod install

을 작성해주시면 우리가 원했던 ShimmerSwift에 관련된 내용을 사용할 수 있게 설치가됩니다.

 

이제 지금 켜두었던 Xcode창이 있다면 꺼주셔야되요. 끄고 다시키셔야 설정이됩니다.

 

 

다시 키려고 들어가니 저렇게 Podfile이 생성되고 첫번째 줄 제일 오른쪽에 workspace라는 파일이 하나 더 생겼군요?

 

저 파일로 들어가주셔야 합니다!

 

하얀색으로 되어있는 ShimmerPractice.xcwoerkspace 를 열면 이제부터 우리가 pod에 설치한 기능을 사용할 수 있습니다.

 

이런식으로 굳이 이 기능이아니더라도 pod에서 필요한게 있다면 다음과 같은 방식으로 활용해주시면 되요.

 

자 이제 다 설치 완료했으니 본격적으로 적용해봅시다!

 

import UIKit
import ShimmerSwift

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        
        let ShimmerView = ShimmeringView(frame: CGRect(x: 0, y: 0, width: 250, height: 100))

        view.addSubview(ShimmerView)
        ShimmerView.center = view.center
        
        let button = UIButton(frame: ShimmerView.bounds)
        button.backgroundColor = .systemBlue
        button.setTitle("success", for: .normal)
        button.layer.cornerRadius = 12
        
        ShimmerView.contentView = button
        ShimmerView.isShimmering = true
    }


}

이렇게 만들고, 실행을 해주면 맨 위에서 보았던 반짝이는 버튼이 생성됩니다!