TextView에 Shadow 적용하기

TextView에 Shadow 적용하기

만들어 볼 화면

5개의 TextView를 배치해보았습니다

 

~3번째까지는 Shadow가 적용된 모습이고

 

4번째는 일반 TextView

 

5번째는 bold 처리한 TextView입니다

Shadow 적용하는 방법(xml)

 

 

TextView에 Shadow를 적용하기 위해서는

 

4가지만 알아두면 됩니다.

 

android:shadowColor

 

android:shadowRadius

 

android:shadowDx

 

android:shadowDy

 

 

속성이름만 봐도 어느정도

감이 잡히실 겁니다.

 

shadowColor는 그림자 색깔

 

shadowRadius는 그림자의 둥근 정도

 

shadowDx는 그림자의 x축방향입니다

(값이 클수록 그림자가 커집니다)

 

shadowDy는 그림자의 y축방향입니다.

 

어렵지 않으므로 바로 코드를 보겠습니다.

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:textSize="20dp"
        android:textStyle="bold"
        android:textColor="#007bff"
        android:text="Hello World!"
        android:shadowColor="#007bff"
        android:shadowRadius="5.0"
        android:shadowDx="5.0"
        android:shadowDy="5.0"
        />
    <TextView
        android:id="@+id/tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:textSize="20dp"
        android:textColor="#4e5952"
        android:text="안녕하세요" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:textSize="20dp"
        android:textStyle="bold"
        android:textColor="#3dae61"
        android:shadowRadius="5.0"
        android:shadowDx="5.0"
        android:shadowDy="5.0"
        android:shadowColor="#000000"
        android:text="Hello World!" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20dp"
        android:layout_marginBottom="10dp"
        android:text="안녕하세요" />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="10dp"
        android:textSize="20dp"
        android:textStyle="bold"
        android:text="Hello World!" />
</LinearLayout>

 

 

위와 같이 써주시면

아래와 같은 화면을 얻을 수 있습니다.

 

첫번째 TextView는

글자색과 shadowColor를

똑같이 하늘색?으로 해서 그런지

그림자효과가 눈에 확 안띄었는데

 

3번째 TextViews는

글자색 초록색에 ShadowColor를 검정색으로

넣었더니 확 표시가 나는 것을 알 수 있습니다.

 

 

가장 눈에 잘 띄는 3번째꺼만 보자면

        android:shadowRadius="5.0"
        android:shadowDx="5.0"
        android:shadowDy="5.0"
        android:shadowColor="#000000"

 

위에 적었듯이 shadowColor를

검정색인 #000000으로 설정했습니다

 

shadowDx와 shadowDy도 5.0으로

넣었더니 우측과 하단으로 그림자가

생긴것을 확인 할 수 있습니다.

 

좌표를 생각해보시면

(setX, setY와 같은 ㅎ)

x좌표는 우측으로 가면 증가하고

y좌표는 아래로 가면 증가하는것과

마찬가지로 위 속성값들도

 

값이 양수이면 우측, 하단으로 생기고

값이 음수이면 좌측, 상단으로 생기게 됩니다.

(즉, 속성값에 -값을 넣을 수 있다는 의미입니다)

 

다음은 코드로 Shadow 적용하는 방법을

알아보겠습니다

(첫번째 사진의 두번째 TextView처럼

빨간색글자색깔로 만들어보겠습니다)

 

 

Shadow 적용하는 방법(java)

 

바로 코드를 보겠습니다.

@Override
protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    TextView tv = (TextView)findViewById(R.id.tv);
    tv.setShadowLayer(5, 5, 5, Color.parseColor("#000000"));
    tv.setTextColor(Color.parseColor("#FF0000"));
    tv.setTypeface(null, Typeface.BOLD);
}

 

코드를 보니 오히려 xml보다 간단해보입니다.

코드로 작성하게 되면, 딱 한줄로 끝낼 수 있습니다.

 

setShadowLayer

 

이놈을 써주시면 끝난답니다.

 

 

 

 

코드상에서 입력을 하다보면

위와 같이 친절하게 어떤값을 어떤 순서대로

넣어줘야 할지 알려줍니다.

 

그대로 적어주시면 완료입니다!

 

돌려보면 처음과 똑같은 화면을

얻을 수 있습니다