라이브러리 버터나이프 기본적인 사용법

[ 버터나이프 공식 홈페이지 ]

오늘은 findViewbyId와 OnClick 이벤트 처리의 번거로움을 줄여주는 버터나이프 라이브러리 사용법에 대해 쓰려합니다.

※물론 더 성능좋은 라이브러리인 DataBinding(구글에서 제공)이 있지만.. 여러 이유(XML 건드리기, MVVM패턴 비선호)로 인해 버터나이프를 쓰기로 했습니다.

---

1. 설치

1.1) 버터나이프 라이브러리 설치

그래들을 띄워 (build.gradle(Module: app))

dependencies 안에

implementation 'com.jakewharton:butterknife:8.8.1'
annotationProcessor 'com.jakewharton:butterknife-compiler:8.8.1'

다음을 추가해주고 SyncNow 클릭

1.2) 버터나이프 플러그인 설치

버터나이프를 보다 쉽고 간편하게 쓰기 위해서 플러그인을 설치하겠습니다.

File -> Settings -> Plugins -> Browse repositories... 클릭

검색창에 Android Butterknife Zelezny 입력하고 Install 버튼을 누릅니다.

---

2. 사용법

설명을 위해 텍스트뷰 1개에, 버튼 3개를 만들었습니다.

각각의 ID 값은 textView, button1, button2, button3 입니다.

버터나이프의 일반적인 사용법은 다음과 같습니다.

public class MainActivity extends AppCompatActivity {

    /**
     * 설명할 부분은 폰트를 크게 바꾸었습니다.
     */

    @BindView(R.id.textView) // 어노테이션(@)을 사용하여 리소스를 바인딩 함
    TextView textView; // 전역변수 선언
    @BindView(R.id.button1)
    Button button1;
    @BindView(R.id.button2)
    Button button2;
    @BindView(R.id.button3)
    Button button3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

    ButterKnife.bind(this); // 이 메소드를 통해 액티비티와 리소스를 바인딩 한다.
    }

    @OnClick(R.id.button1) // 버튼 한 개의 클릭 이벤트를 처리했을 때
    public void button1Clicked() {
    }


    @OnClick({R.id.button2, R.id.button3}) // 버튼 두 개 이상 클릭 이벤트를 처리했을 때
    public void buttonsClicked(View view) {
        switch (view.getId()) {
            case R.id.button2:
                break;
            case R.id.button3:
                break;
        }
    }
}

막상 써보니, 코드의 가독성은 높아졌지만 여전히 피곤하게 일일이 다 쳐야합니다.

너무나도 귀찮습니다.

그래서 우리는 플러그인을 다운받은 것입니다.

다음 주황색 친 부분을 클릭하고, Alt+Insert 를 누른다.(다른곳에서 하면 안뜹니다.)

그럼 

Generate 창에 Butterknife injections가 뜬 걸 확인할 수 있습니다. 이를 클릭하면,

다음과 같은 창이 뜹니다.

Element는 뷰의 종류, ID는 뷰의 아이디, OnClick은 클릭했을 때의 이벤트 처리, Variable Name은 해당 뷰를 자바 코드에서 사용할 때의 변수이름입니다.

저는 모든 뷰를 바인딩 함과 동시에 버튼 3개를 묶어서 한 메소드에 클릭 이벤트 처리를 하였습니다.

(만약 Split OnClick methods를 체크하면, 버튼 3개를 한 메소드에 묶어서 이벤트 처리를 하지 않고, OnClick 이벤트 메소드 3개를 각각 생성합니다)

confirm 버튼을 누르면,

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.textView)
    TextView textView;
    @BindView(R.id.button1)
    Button button1;
    @BindView(R.id.button2)
    Button button2;
    @BindView(R.id.button3)
    Button button3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
    }

    @OnClick({R.id.button1, R.id.button2, R.id.button3})
    public void onViewClicked(View view) {
        switch (view.getId()) {
            case R.id.button1:
                break;
            case R.id.button2:
                break;
            case R.id.button3:
                break;
        }
    }
}

다음과 같이 자동으로 생성이 됩니다. 참 쉽죠?

---

3. 테스트

그럼 이제 잘 작동하는지 실행해보겠습니다.

버튼을 누르면 텍스트 창이 바뀌도록 해보겠습니다.

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.textView)
    TextView textView;
    @BindView(R.id.button1)
    Button button1;
    @BindView(R.id.button2)
    Button button2;
    @BindView(R.id.button3)
    Button button3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
    }

    @OnClick({R.id.button1, R.id.button2, R.id.button3})
    public void onViewClicked(View view) {
        switch (view.getId()) {
            case R.id.button1:
                textView.setText("1번버튼");
                break;
            case R.id.button2:
                textView.setText("2번버튼");
                break;
            case R.id.button3:
                textView.setText("3번버튼");
                break;
        }
    }
}

.........................................

네 잘 작동 됩니다.

끗~~~~~~~~~~~~~~~~~~~~~~