Toast의 업글버전? Snackbar(스낵바)를 써보자

Toast의 업글버전? 

Snackbar(스낵바)를 써보자

ㆍ 오늘 심심해서 샘플프로젝트를 하던중에 snackbar라는 놈이 

    있어서 사용해봤습니다. 거의 뭐 Toast급으로 쓰기 쉬워서

    한번 사용해 보시라고 이렇게 글을 쓰게 되었습니다.

    안드로이드 5.0 롤리팝때 Material Design이 도입되었는데

    그 중에 포함되어 있는 내용입니다.

    

일단 사용방법전에

왜 Toast의

업글버전이라고

하는지 직접 먼저

결과물을 보겠습니다.

앱을 실행하자마자 

뜨게 설정해놨는데

느낌이 잘 안사네요

버튼 누르면 뜨게 할걸..

뭐 대충 저런 모양입니다.

아래에서 위로 올라오는

그리고 시간 지나면 아래로 내려가는데

영상편집하다가 짤린듯..

내려가는건..

뭐 모양만으로 봐도

Toast랑 다르긴 합니다.

근데 이것만 봐서는

크게 다른점은 모르겠습니다.

다음 gif에서

Snackbar와 Toast의

차이점을 보겟습니다

잘 보이십니까

안내메시지에서

버튼을 한번 더

누를수 있습니다.

일단 그냥 토스트만 

간단하게

띄워놨는데

잘 만 이용하면

괜찮은 기능도 가능할

것 같습니다.

그럼 바로 사용방법을

알아보도록

하겠습니다.

일단 프로젝트를

하나 켜시고

첫번째, Support:design Library를 추가시키자!

예 

사용전에 준비사항은

말 그대로 

저거만 추가시키면 끝입니다

Recyclerview 추가시키듯

똑같이 시키면 됩니다.

Ctrl+Alt+Shift+S를

눌러서

좌측하단에

[app] 클릭하시고

가운데 상단 탭에

Dependencies

눌러주시고

바로 보일수도 있는데

안보이시면 

design이라고 검색하시면

아래와 같이 바로 뜨는데

추가시켜주세요~

그 다음, 바로 사용하세요~

사용전에 그래도 

사용방법을 알아보면

저대로 넣어주면 됩니다

현재 View, 원하는 

텍스트, 지속기간

뭐 버튼 눌렀을때

토스트처럼 띄우는

코드를 바로 보면

findViewById(R.id.btn).setOnClickListener(new View.OnClickListener()
{
    @Override
    public void onClick(View v)
    {
        Snackbar.make(v, "ITPANGPANG", Snackbar.LENGTH_SHORT).show();
    }
});

완전 비슷합니다.

뭐 Context대신

View들어가는거 말곤

판박이죠

아 여기서

액티비티에서

바로 띄우시려는 분이

얼마나 될지 모르겠지만

액티비티 뷰는 이렇게

구하시면 됩니다.

Snackbar.make(getWindow().getDecorView().getRootView(), "ITPANGPANG", Snackbar.LENGTH_LONG).show();

유지시간은

위에 나와있듯이

int duration

넣으시면 됩니다

뭐 10초라면

findViewById(R.id.btn).setOnClickListener(new View.OnClickListener()
{
    @Override
    public void onClick(View v)
    {
        Snackbar.make(v, "ITPANGPANG", 10000).show();
    }
});

이렇게 되겠죠?

자 그렇다면 

이번에는

버튼을 누를수

있도록 코드를

조금더 추가해보겠습니다.

코드가 길지도 않습니다.

findViewById(R.id.btn).setOnClickListener(new View.OnClickListener()
{
    @Override
    public void onClick(View v)
    {
        Snackbar.make(v, "ITPANGPANG", 10000).setAction("YES", new View.OnClickListener() 
        {
            @Override
            public void onClick(View v) 
            {
                //할거
            }
        }).show();
    }
});

setAction을 써주시고

추가시킬 Text 적으시고

그 옆에 바로 클릭리스너

달아주시면 됩니다

이번에는 스낵바(Snackbar)에서

저 누를수 있는 

버튼 색깔을 

변경시켜보겠습니다

이것은 요렇게

findViewById(R.id.btn).setOnClickListener(new View.OnClickListener()
{
    @Override
    public void onClick(View v)
    {
        Snackbar.make(v, "ITPANGPANG", 10000).setActionTextColor(Color.parseColor("#FF0000"))
                .setAction("YES", new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                //할거
            }
        }).show();
    }
});

저 ITPANGPANG 글씨색

바꾸는법도 있으나

저건 좀 작업해야되서

다음번에 기회가 되면 

2탄으로 쓰겠습니다.

음 

다음은..

스낵바 background를

바꿔볼까요?

자 이건

요렇게~

findViewById(R.id.btn).setOnClickListener(new View.OnClickListener()
{
    @Override
    public void onClick(View v)
    {
        Snackbar snackbar;
        snackbar = Snackbar.make(v, "ITPANGPANG",Snackbar.LENGTH_LONG)
                .setActionTextColor(Color.BLUE).setAction("Hi", new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {

            }
        });
        View snackView = snackbar.getView();
        snackView.setBackgroundColor(Color.parseColor("#FF0000"));
        snackbar.show();
    }
});

저 스낵바의

View를 구해서

View 백그라운드를

바꿔주시면 됩니다.

이제

마지막으로

위치를 바꾸고싶으시면

xml에서 이렇게

써주시고 원하는곳에

배치하시면 됩니다

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/myCoordinatorLayout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    >
</android.support.design.widget.CoordinatorLayout>

저 공간에서 

나오니까

잘 맞춰서 짜시면 됩니다

음 이게 얼마나

쓰일지는 모르겠지만

아직 뭐 Recyclerview만큼

대세까지는 아닌거 같아서 

더 써보고 괜찮다 싶으면

좀 더 연구해서 추가글

써보도록 하겠습니다