Codelab으로 LiveData 알아보기 - 7. Add the Play Again Button

이번에는 점수 화면에 Play Again 버튼을 추가하고 LiveData를 사용하여 클릭 리스너를 구현할 것이다.

해당 버튼은 점수 화면에서 다시 게임 화면으로 이동하는 이벤트를 발생시킨다.

 

먼저, 우리가 받아놓은 코드에는 이미 Play Again 버튼이 있지만 숨겨져 있다.

 

1. score_fragment.xml에서 play_again_button의 visibility를 보이도록 처리한다.

 

<Button
   android:id="@+id/play_again_button"
...
   android:visibility="visible"
 />

 

2. ScoreViewModel에 _eventPlayAgain이라는 Boolean값을 가지는 LiveData객체를 추가한다.

이 객체는 점수 화면에서 게임 화면으로 이동하는 이벤트를 저장하기 위해 만들었다.

private val _eventPlayAgain = MutableLiveData<Boolean>()
val eventPlayAgain: LiveData<Boolean>
   get() = _eventPlayAgain

 

3. ScoreViewModel에서 _eventPlayAgain을 설정하고 초기화하는 메소드를 정의한다.

 

fun onPlayAgain() {
   _eventPlayAgain.value = true
}
fun onPlayAgainComplete() {
   _eventPlayAgain.value = false
}

 

4. ScoreFragment에서 eventPlayAgain에 옵저버를 추가한다. onCreateView 마지막, return문 이전에 코드를 추가한다.

람다식에서 다시 게임 화면으로 넘어가고 eventPlayAgain을 리셋한다.

 

// Navigates back to game when button is pressed
viewModel.eventPlayAgain.observe(viewLifecycleOwner, Observer { playAgain ->
   if (playAgain) {
      findNavController().navigate(ScoreFragmentDirections.actionRestart())
       viewModel.onPlayAgainComplete()
   }
})

 

5. ScoreFragment의 onCreateView안에서 Play Again 버튼에 클릭 리스너를 추가하고

viewModel.onPlayAgain 메소드 호출을 추가한다.

 

binding.playAgainButton.setOnClickListener {  viewModel.onPlayAgain()  }

 

6. 앱을 실행하고 게임을 다시 플레이한다. 게임이 끝나면 점수 화면은 최종 점수와 Play Again 버튼을 보여준다.

해당 버튼을 누르면 다시 게임 화면으로 이동하기 때문에 다시 게임을 플레이할 수 있다.

앱 화면 출처 : Google Codelab