Android (세번째 수업 - 안드로이드 Design Support Library( Snackbar, AlertDialog ))

---

Android - Design Support Library

안드로이드 디자인 서포트 라이브러리

구글은 지난 Google I/O 2015 에서 머티리얼 디자인을 더욱 

쉽게 적용할수 있는 'Android Design Support Library' 를 공개했습니다.

이번에 살펴볼 안드로이드 디자인 서포트 라이브러리 를 살펴보기전에

---

먼저 다른 라이브러리들 처럼 Gradle 에 dependencies 에 등록해줍니다

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:27.1.1'
    implementation 'com.android.support.constraint:constraint-layout:1.1.2'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
    implementation 'com.android.support:design:27.1.1'
}

소스를 보면 마지막줄처럼 

 implementation 'com.android.support:design:27.1.1'

이소스를 추가 해주셔야합니다 버전은 위에 appcompat 버전 이랑 동일하게 해주세요.

---

1. Snackbar

Snackbar 는 Toast 랑 비슷하다. 

Snackbar는 하단에 메세지를 출력해준니다

동작과 사용방법은 Toast랑 비슷하다 하지만 메세지와 함께 액션(Action) 을 

포함한다는 점에 달라집니다.

그럼 사용법에 대해 알아보도록하자.

Snackbar.make(view, "스낵바 테스트", Snackbar.LENGTH_SHORT).show();

Toast 메시지와 비슷한점을 알수있다.

Snackbar는 3가지 인자를 받는데

첫번째 인자는 view , 두번째 인자는 Snackbar 에 띄어줄 문구를 적어준다

세번째 인자는 지속시간이다. (LENGTH_SHORT 는 약 2초이다 짧게 띄어줄때 사용.)

그리고 항상 뒤에 .show(); 메소드로 실행시켜주자 까먹지말자.

이코드로만은 아직 아쉬운점이있다.

왜냐하면 이렇게 그냥 띄어주기만하면 Toast랑 다른점은 그냥 하단에 

Snackbar형식으로 띄어주는것 차이이다

이제 우리가 살펴볼건 Snackbar에 액션(Action) 을 추가해줄것이다.

button.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Snackbar.make(view, "스낵바 테스트", Snackbar.LENGTH_SHORT)
                    .setAction("확인", new View.OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            textView.setText("스낵바 내용  확인됨");
                        }
                    }).show();
        }
    });
}

소스 코드를 해석해보자면

Snackbar에 인자를 주고

.setAction() 메서드를 사용해 액션(Action) 을 추가해줬다.

.setAction() 안에는

액션에 표시할 텍스트와 View.OnClickListener() 

두개의 인자를 받습니다

사용자가 액션을 클릭했을때 

수행할 코드는 onClick 이벤트에 정의합니다.

소스를 보면 textView.setText("스낵바 내용 확인됨");

액션을 클릭했을때 텍스트로 "스낵바 내용 확인됨"

이라고 textView가 뜹니다.

이런식으로 Snackbar 의사용법을 알아봤습니다.

---

2.AlertDialog

AlertDialog은 알림상자라고 볼수있다.

먼저 AlertDialog 도 Snackbar 처럼 Gradle 에 dependencies 에 등록해줍니다.

AlertDialog을 설명하자면

제목 하나, 최대 세 개의 버튼, 선택 가능한 품목 목록 또는 사용자 지정 레이아웃을 표시할 수 있는 대화상자입니다.

먼저 xml 코드를 보면

xml code

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="360"
    tools:context=".MainActivity">

    <Space
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="150"/>
    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="50"
        android:textAppearance="@style/Base.TextAppearance.AppCompat.Large"
        android:text="tools"
        android:gravity="center"/>
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="Press Me"/>


</LinearLayout>

Snackbar 도 같은 xml 코드

xml 코드를 간단하게 설명하자면 

<Space/> 로 공백을 줬고

<TextView/> 은 그전에 Snackbar의 액션을 눌렀을때 <TextView/>가

바뀌는걸 볼수있다.

그리고 <Button/> 을 하나 만들어 줬다. 

이제 AlertDialog 의 사용법에 대해 알아보자.

private void setDialog(){
    AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
    builder.setTitle("알림");
    builder.setMessage("정말로 종료하시겠습니까?");
    builder.setPositiveButton("확인", new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            finishAffinity();
        }
    });
    builder.setNegativeButton("취소", null);
    AlertDialog alertDialog = builder.create();
    alertDialog.show();
}

먼저 AlertDialog.Builder 클래스를 이용해 객체를 만들어준다음에

.setTitle() 의 인자로 타이틀 텍스트를 입력해주고

.setMessage() 의 인자로는 메세지 텍스트를 입력해준다.

여기서 살펴볼건 .setPositiveButton() 이다.

먼저 살펴보자면 "확인" 을 눌르면 onClick 이벤트의 finishAffinity(); 를 호출하게된다

finishAffinity(); 메서드를 설명하자면 어느 Activity 등

모든 부모 Activity를 닫을수 있다.

그러므로 "확인" 을누르게 되면 앱이 종료 된다.

그리고 "취소 를" 누르게 되면 

알림창 객체를 생성하고 알림창을 띄우는데

내용은 null이다.

이런식으로 AlertDialog 의사용법에 대해 알아봤습니다

여기서 응용으로 

public void onBackPressed(){
    setDialog();
}

이런식으로 onBackPressed() 는 뒤로가기 버튼을 눌렀을 경우 처리하는 함수이다.

뒤로가기 버튼을 이용해

AlertDialog 를 호출할수도 있다.

---

 앞으로 열심히 해야겠다.