[Kotlin]viewBinding을 통한 레이아웃

저번 시간에는 findViewById를 이용해 xml파일에 있는 문자열의 아이디값을 참조했다. 하지만, 이 방법은 좋은 방법은 아니다.

 

`findViewById`와 `ViewBinding`의 `binding` 객체를 사용하는 것은 안드로이드 앱에서 뷰를 참조하는 두 가지 다른 방법이다.

1. **findViewById:**
   - `findViewById`는 기존에 사용되던 방식으로, XML 레이아웃에서 정의한 뷰의 ID를 사용하여 뷰를 찾아온다.
   - 예를 들어, `findViewById(R.id.true_button)`은 XML 레이아웃에서 `true_button` ID를 가진 뷰를 찾아온다.
   - 이 방식은 뷰를 찾아오는 과정에서 캐스팅이 필요하며, 레이아웃의 변경 시에 레이아웃에 대한 일일이 변경이 필요하다.

 trueButton = findViewById(R.id.true_button)

2. **ViewBinding:**
   - `ViewBinding`은 안드로이드 스튜디오에서 자동으로 생성해주는 바인딩 클래스(`ActivityMainBinding`과 같은)를 사용하여 뷰에 직접 접근한다.

-binding이 자동으로 만들어준 binding요소 파일에 접근하려면 android View가 아니라 project View를 통해 app/build/generated/..을 통해 접근한다. 이 자동완성 파일은 "빌드할때 만들어진다!"
   - 이 방식은 레이아웃의 변경에 유연하게 대처할 수 있고, 캐스팅이 필요하지 않다.
   - 예를 들어, `binding.trueButton`은 바인딩 클래스에서 생성된 `trueButton`에 직접 접근한다.

   binding.trueButton.setOnClickListener { view: View ->
       // ...
   }

   

`ViewBinding`을 사용하면 코드가 간결해지고, 뷰에 대한 접근이 안전해진다. 또한 레이아웃이 변경되어도 빌드 시점에 오류를 감지할 수 있다. 

 

그러면, 예제와 함께 알아보자.

 

일단, strings.xml파일에 여러 필요한 요소들을 넣어주고 build버튼을 누르면 안드로이드는 자동으로 binding파일을 생성해준다. 아래 경로를 따라가보면

app/build/generated/data_binding_base_class_source/out/debug/dataBindingGenBaseClassesDebug/out/edu/vt/mobiledev/multiquiz/databinding/ActivityMainBinding.java

아래와 같은 바인딩 파일이 만들어져있다! 바인딩 파일은 activity_main.xml로부터 요소들을 가져온다!

 

이렇게 만들어진 바인딩 파일은 이제 우리는 ViewBinding을 통해 접근할수있게된다.

 

그렇다면 MainActivity에서의 viewBinding은 어떻게 이루어질까?

 

먼저, viewBinding을 선언 해줘야한다.

 binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

layoutInflator를 인자로 넘겨 inflate를 해야한다. .inflate는 xml레이아웃 파일을 실제 뷰 객체로 변환하고, 이를 이용해 액티비티의 화면에 표시하는 역할을 한다. 그리고 root는 해당 xml파일의 최상단 뷰를 나타낸다. 이로써 최상위 뷰 아래 생성된 하위 뷰와 구성 요소들이 액티비티 화면에 표시된다!

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding

    private val answerBank = listOf(
        Answer(R.string.Brisbane_button, false),
        Answer(R.string.Sydney_button, false),
        Answer(R.string.Melbourne_button, false),
        Answer(R.string.Canberra_button, true))
    private var currIdx = 0

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)
        binding.brisbaneButton.updateColor()
        binding.canberraButton.updateColor()
        binding.melbourneButton.updateColor()
        binding.sydneyButton.updateColor()

        binding.brisbaneButton.setOnClickListener { view: View ->

        }


        }
    }

 

먼저, ActivityMainBinding타입의 binding이라는 변수를 선언해준다. 그 다음, 예를들어 brisbaneButton.updateColor()을 해야한다고 해보자. 원래대로 findViewById()를 쓰려면, 먼저 문자열의 아이디를 가져온 후 변수에 할당해줘야 한다.

var brisBtId = findViewById(R.id.brisbaneButton)
brisBtId.updateColor()

 

하지만 bindingView를 이용하면 코드가 훨씬 더 간결해진다.

binding.brisbaneButton.updateColor()

 

이렇게 viewBinding을 이용하면 코드가 훨씬 더 가독성이 좋아지니 명심하자!