버튼 이너쉐도우 효과주기(다음메일앱 버튼 응용편) 2013.7월.

<눌렀을때 이너쉐도우 효과 나타나는 버튼>

-다음메일앱 버튼 응용편. 2013.7월 현재.

 

                                                                            (평상시 버튼 - 눌렀을 때 버튼은 다음메일앱 로그인 화면 참고함)

*btn은 button의 줄임말

1. 먼저 drawable 파일에 3개 xml 파일을 만든다.

  btn_custom.xml (이 파일이 아래의 두 파일을 관리한다.)

  btn_custom_pressed.xml (버튼 눌렀을 때)

  btn_custom_default.xmll (평상시 버튼)

     2. btn_custom.xml 파일에 넣을 것

        <!--버튼 눌렀을 때-->

        <item android:drawable="@drawable/btn_custom_pressed" android:state_pressed="true"/><!-- pressed --> 

  <!--평상시 버튼-->

        <item android:drawable="@drawable/btn_custom_default"/> <!-- default -->

     3. btn_custom_pressed.xml 파일에 넣을 것.

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    

    <!-- "background shadow" -->

    <item>

        <shape android:shape="rectangle" >

            <solid android:color="#000" />

            <corners android:radius="15dp" />

        </shape>

    </item>

    <!-- background color -->

    <item

        android:bottom="3px"

        android:left="3px"

        android:right="3px"

        android:top="3px">

        <shape android:shape="rectangle" >

            <solid android:color="#b3661e" />

            <corners android:radius="3dp" />

        </shape>

    </item>

    <!-- over left shadow -->

    <item>

        <shape android:shape="rectangle" >

            <gradient

                android:angle="180"

                android:centerColor="#b3661e"

                android:centerX="0.9"

                android:endColor="#000"

                android:startColor="#b3661e" />

            <corners android:radius="8dp" />

        </shape>

    </item>

    <!-- over right shadow -->

    <item>

        <shape android:shape="rectangle" >

            <gradient

                android:angle="360"

                android:centerColor="#b3661e"

                android:centerX="0.9"

                android:endColor="#000"

                android:startColor="#b3661e" />

            <corners android:radius="3dp" />

        </shape>

    </item>

    <!-- over top shadow -->

    <item>

        <shape android:shape="rectangle" >

            <gradient

                android:angle="-90"

                android:centerColor="#b3661e"

                android:centerX="0.9"

                android:endColor="#000"

                android:startColor="#b3661e"/>

            <corners android:radius="3dp" />

        </shape>

    </item>

    <!-- over bottom shadow -->

    <item>

        <shape android:shape="rectangle" >

            <gradient

                android:angle="90"

                android:centerColor="#b3661e"

                android:centerX="0.9"

                android:endColor="#000"

                android:startColor="#b3661e"

                android:type="linear" />

            <corners android:radius="3dp" />

        </shape>

    </item>

</layer-list>

    4. btn_custom_default.xml 파일에 넣을 것.

   <item>        

        <shape>

            <gradient

                android:startColor="#fa9630"

                android:endColor="#c96804" 

                android:angle="270" />

            <stroke

                android:width="1dp"

                android:color="#fff" />

            <corners

                android:radius="3dp" />

            <padding

                android:left="10dp"

                android:top="10dp"

                android:right="10dp"

                android:bottom="10dp" />

        </shape>

    </item>

5. 마지막으로 layout파일의 activity_login.xml 파일에 넣을것.

<Button

   android:id="@+id/bt_login"

   android:layout_width="match_parent"

   android:layout_height="45dp"

 

   android:background="@drawable/btn_custom.xml"

   android:text=" 로그인" 

   android:textSize="15dp"

   android:textColor="#fff"

   android:textStyle="bold"

   android:layout_marginTop="7dp"/>