Android Jetpack - 2편(View Binding) 예제를 이용한 사용법

이번에는 사용하면 편리한 ViewBinding을 알아보자.

# viewbinding을 사용 안할시

 <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:padding="5dp"
        android:layout_marginBottom="5dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent">

        <Button
            android:id="@+id/add_Btn"
            android:layout_width="100dp"
            android:layout_height="50dp"
            android:layout_marginEnd="50dp"
            android:background="#ECB8B8"
            android:text="추가하기"
            android:textSize="20sp"
            android:textStyle="bold" />
        <Button
            android:id="@+id/delAll_Btn"
            android:layout_width="100dp"
            android:layout_height="50dp"
            android:layout_marginEnd="50dp"
            android:background="#ECB8B8"
            android:text="전체삭제하기"
            android:textSize="17sp"
            android:textStyle="bold" />

        <Button
            android:id="@+id/del_Btn"
            android:layout_width="100dp"
            android:layout_height="50dp"
            android:background="#ECB8B8"
            android:text="삭제하기"
            android:textSize="20sp"
            android:textStyle="bold" />
    </LinearLayout>

예를 들어 xml에 버튼 3개가 있다고 치면 

class MainActivity : AppCompatActivity() {
	// 변수 선언 해주고
    private lateinit var addBtn: Button
    private lateinit var deleteBtn : Button
    private lateinit var deleteAllBtn : Button
    
    override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContentView(R.layout.activity_main)

     // findViewById로 id를 찾아서 넣어준다.
         addBtn = findViewById(R.id.add_Btn)
         deleteBtn = findViewById(R.id.del_Btn)
         deleteAllBtn = findViewById(R.id.delAll_Btn)

}

viewbinding을 사용 안 할 시 버튼 클릭 리스너나 버튼에 대해 작업을 하려면 먼저 변수를 선언해야 하고, findViewById를 이용해서 xml의 뷰와 변수를 연결시켜주는 그런 작업을 해야 했다.

이게 한 두 개 정도는 상관없는데 무수히 많이 늘어나면 코드가 길어지고 더러워진다.

 

그래서 나온 게 viewbinding이다

# viewbinding  사용법

##  gradle 추가

 

android{
	...
	buildFeatures {
        	viewBinding = true
    	}
}

gradle에 추가해준다

 

##  액티비티에서 사용

class MainActivity : AppCompatActivity() {
	// ActivityMainBinding형의 바인딩 선언
	private lateinit var binding : ActivityMainBinding
    override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         // inflate로 xml에 있는 뷰를 객체화
         binding = ActivityMainBinding.inflate(layoutInflater)
         //생성한 루트 뷰를 넘겨준다
         setContentView(binding.root)

     // 바인딩된 객체 안에 있는 버튼 접근
         binding.addBtn.setOnClickListener {}
         binding.deleteBtn.setOnClickListener {}
         binding.deleteAllBtn.setOnClickListener {}

}

1. 바인딩 클래스를 선언해준다.

   -  바인딩 클래스 이름은 아래와 같이 규칙이 정해져 있다.

Activity 이름	Binding Class이름
MainActivity	ActivityMainBinding
HelloActivity	ActivityHelloBinding
XXXActivity	ActivityXXXBinding

2.  inflate로 xml에 있는 뷰를 객체화시켜준다

3. setContentView에 원래는 R.layout.activity_main을 넘겨주지만 이번에는 우리가 생성한 루트 뷰를 넘겨준다.

4. 바인딩된 객체 안에 있는 버튼들을 접근하여 사용하면 끝

 

# 번외

코틀린 스코프 함수 중 with을 이용하여 반복되는 binding을 안 써도 된다.

class MainActivity : AppCompatActivity() {
	private lateinit var binding : ActivityMainBinding
    override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         binding = ActivityMainBinding.inflate(layoutInflater)
         setContentView(binding.root)

         binding.addBtn.setOnClickListener {
          // 원래 코드
          val name = binding.nameInput.text.toString()
          val age = binding.ageInput.text.toString()
          val phone = binding.phoneInput.text.toString()
            
          // 스코프 함수인 with 사용
          with(binding){
            val name = nameInput.text.toString()
            val age = ageInput.text.toString()
            val phone = phoneInput.text.toString()
       	   }

}

참고 사이트
https://todaycode.tistory.com/29