Xcode 기능 - 애니메이션 : 색 변경하기 / animation change color

이번부터는 아주 간단간단한 애니메이션에 대해 알아볼께요

왜 간단한거만 하는지 궁금하다면?

 

이유는 간단해요

알고있는게 이게 답니다...

 

 

먼저 색변경 애니메이션에 대해 알아볼께요

결과물 먼저 볼께요

 

 

별거 아닌데 애니메이션 하나만 들어갔는데도 이뻐요ㅎㅎ

아주 간단합니다!

 

일단 그전에 당연하지만 

 

버튼을 ViewController에 연결시켜야 한답니다 (이제부턴 안보여줘야지)

 

그리고 색변경을 하기에 앞서 색을 코드로 가져오는 방법에 대해 알고있어야겠죠?

아래 글을 먼저 보시길 바랍니다!

fdee.tistory.com/entry/Xcode-기능-코드로-색상-설정-및-변경하기-set-color-with-swift

Xcode 기능 - 코드로 색상 설정 및 변경하기 / set color with swift

 

이제 색을 가져왔으니 애니메이션을 구현해봅시다!

 

1) ViewController

< 애니메이션 : 색 변경 / animation color change >

UIView.animate(withDuration: 지속시간, animations: {

    변경할 대상.backgroundColor = 변경될 색상

})

UIView.animate(withDuration: 0.5, animations: {
    self.Button_plus_outlet.backgroundColor = self.BUTTON
})

이러한 형식이랍니다. 간단하죠?

여기서 필요한거는 애니메이션 대상 (버튼), 변경될 색상.

그리고 변경되는 시간입니다.

 

위 코드를 버튼을 클릭했을시에 넣는다던가 그런식으로 구현해주시면 됩니다!

 

 

 

 

추가적으로 좀 심화 내용으로 예제 영상처럼 만들고 싶다면?

두가지 추가적인 개념을 섞으면 됩니다!

 

먼저 코드부터 보여드릴께요

 

1. 버튼을 둥글게 만들기

Button_plus_outlet.layer.cornerRadius = 4

만약 모르실경우 아래 글을 참고해주시면 되겠습니다

fdee.tistory.com/entry/Xcode-기능-버튼-뷰-모서리-둥글게-만들기-button-view-cornerRadius

Xcode 기능 - 버튼, 뷰 모서리 둥글게 만들기 / button, view cornerRadius

 

2. 키보드 입력시 반응되겠금 만들기

Input_money.addTarget(self, action: #selector(textFieldDidChange1(textField:)),
    for: UIControl.Event.editingChanged)

만약 모르실경우 아래 글을 참고해주시면 되겠습니다

fdee.tistory.com/entry/Xcode-기능-키보드-입력시-반응하기-detect-keyboard-change

Xcode 기능 - 키보드 입력시 반응하기 - detect keyboard change

 

마지막으로 키보드 반응함수 내에 애니메이션 코드를 넣으면 됩니다!

 

3. 키보드 반응함수에 애니메이션 넣기

        if(Input_money.text != "") {
            UIView.animate(withDuration: 0.5, animations: {
                self.Button_plus_outlet.backgroundColor = self.BUTTON
            })
        } else {
            UIView.animate(withDuration: 0.5, animations: {
                self.Button_plus_outlet.backgroundColor = self.GRAY
            })
        }

 

예시영상의 경우 입력내용이 생기면 색이 뜨겠금, 입력내용이 사라지면 색이 없어지겠금 설정을 했습니다

그래서 입력값이 ""인지 여부를 확인해주어야 되죠?

그에 따라 알맞게 애니메이션을 넣으면 끝납니다!

 

 

 

이렇게 애니메이션 자체는 아주 간단한데

어떻게 구성하냐에 따라 무궁무진하게 사용되는게 매력적입니다ㅎㅎ