안드로이드 텍스트뷰 속성 12. [maxLength, scrollHorizontally, shadowColor, shadowDx, shadowDy, shadowRadius] (Android TextView Attributes 12)

2016. 12. 17. 16:02


1. TextView 속성 (12)

TextView 속성 리스트 및 요약 설명을 확인하시려면 [안드로이드 텍스트뷰 속성] 페이지를 참고하시기 바랍니다.


TextView 속성에 대한 자세한 설명 및 예제를 확인하시려면, 아래 표에서 속성 이름을 클릭하시기 바랍니다.


속성 속성 속성 속성 속성
autoLink autoText breakStrategy bufferType capitalize
cursorVisible digits drawableBottom drawableEnd drawableLeft
drawablePadding drawableRight drawableStart drawableTint drawableTintMode
drawableTop editable editorExtras elegantTextHeight ellipsize
ems fontFamily fontFeatureSettings freezesText gravity
height hint hyphenationFrequency imeActionId imeActionLabel
imeOptions includeFontPadding inputMethod inputType letterSpacing
lineSpacingExtra lineSpacingMultiplier lines linksClickable marqueeRepeatLimit
maxEms maxHeight maxLength maxLines maxWidth
minEms minHeight minLines minWidth numeric
password phoneNumber privateImeOptions scrollHorizontally selectAllOnFocus
shadowColor shadowDx shadowDy shadowRadius singleLine
text textAllCaps textAppearance textColor textColorHighlight
textColorHint textColorLink textIsSelectable textScaleX textSize
textStyle typeface width

2. TextView 속성 활용

2.1 TextView 텍스트의 최대 길이 제한하기. (maxLength)

TextView에 표시(또는 EditText에 입력)되는 텍스트의 최대 길이를 제한하기 위해서 "maxLength" 속성을 사용합니다.

  * android:maxLength - 텍스트의 최대 길이 제한.
        > 정수 값 사용. (예. 10)


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="24sp"
        android:maxLength="10"
        android:text="1234567890ABCDEFG" />

maxLength 속성 예제


위의 예제 코드에서 text 속성을 통해 "1234567890ABCDEFG"라는 길이가 17인 텍스트를 출력했지만, maxLength가 10으로 지정되었기 때문에 실행 화면에는 "1234567890" 까지만 출력되는 것을 확인할 수 있습니다.


사실, maxLength 속성이 TextView에서 정의된 속성이긴 하나, EditText에서 최대 입력 가능한 문자의 갯수를 제한할 때 더 유용하게 사용될 수 있습니다.


예를 들어, 1에서 99까지의 숫자 값을 입력받아야 하는 기능이 필요하다면, maxLength에 "2"를 지정하여 2자리 이상의 값을 입력하지 못하도록 만들 수 있는 것이죠. (inputType 속성에 number를 지정하여 숫자만 입력하도록 만들면 더 좋겠죠.)

2.2 TextView 가로 스크롤 가능하게 만들기. (scrollHorizontally)

"scrollHorizontally" 속성을 사용하면 TextView의 텍스트가 TextView의 가로 영역을 넘어선 경우, 가로 스크롤 기능을 사용하도록 만들 수 있습니다.

  * android:scrollHorizontally - TextView 가로 스크롤 사용 여부 지정.
        > 텍스트가 TextView의 가로 영역보다 큰 경우 스크롤 표시.
        > true 또는 false 값 지정 (기본 값 false).


    <EditText
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:width="100dp"
        android:textSize="24sp"
        android:maxLines="1"
        android:scrollHorizontally="true"
        android:text="scrollHorizontally Example" />

하지만 scrollHorizontally 속성을 사용해도, TextView의 텍스트가 가로로 스크롤되는 동작은 확인할 수 없었습니다.


대신, HorizontalScrollView를 사용하여 TextView의 텍스트 가로 스크롤을 가능하게 만드는 방법에 대한 내용은 확인할 수 있었습니다. (http://stackoverflow.com/questions/20307601/why-my-scrollhorizontally-doesnt-work/20307691#20307691)


아래의 코드로 TextView의 텍스트 가로 스크롤 기능을 구현할 수 있습니다.
    <HorizontalScrollView
        android:layout_width="100dp"
        android:layout_height="wrap_content">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/text1"
            android:textSize="40sp"
            android:text="Scroll Horizontally example" />

    </HorizontalScrollView>

scrollHorizontally 속성 예제


2.3 텍스트에 그림자 효과 입히기. (shadowColor, shadowDx, shadowDy, shadowRadius)

TextView의 텍스트 아래에 희미한 그림자(blurred shadow) 효과를 입히기 위한 속성은 "shadowColor"이며, 직접 색상 값을 지정할 수 있습니다.

  * android:shadowColor - 텍스트 아래에 표시될 희미한 그림자(blurred shadow) 색상 지정.
        > 컬러 값 지정. (#rgb, #argb, #rrggbb, #aarrggbb 등의 형식)

shadowColor 속성 예제


그리고 텍스트와 그림자 사이의 간격은 "shadowDx"와 "shadowDy" 속성을 사용할 수 있습니다.

  * android:shadowDx - 텍스트와 그림자 사이의 가로 방향(x 축) 간격 조절
        > 소수 값 사용. (예. 1.2)
  
  * android:shadowDy - 텍스트와 그림자 사이의 세로 방향(y 축) 간격 조절
        > 소수 값 사용. (예. 1.2)

shadowDx, shadowDy 속성 예제


마지막으로 그림자의 범위를 조절하기 위해서는 "shadowRadius" 속성을 사용합니다.

  * android:shadowRadius - 그림자의 범위 조절.
        > 소수 값 사용. (예. 1.2)

shadowRadius 속성 예제


그럼 지금부터 shadow 관련 속성들을 사용하여 표현할 수 있는, 다양한 그림자 텍스트 효과들을 살펴보겠습니다.

2.3.1 기본적인 텍스트 그림자 효과. (Drop Shadow)

첫 번째 예제는 일반적으로 많이 사용하는 한 방향 그림자 효과입니다.

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40sp"
        android:shadowColor="#000000"
        android:shadowDx="3"
        android:shadowDy="3"
        android:shadowRadius="3.0"
        android:text="DROP SHADOW 1" />

텍스트뷰 shadow 속성 예제 1 (Drop Shadow)


shadowDx, shadowDy 속성 값을 조절하여 그림자의 방향을 바꿀 수 있습니다. shadowDx의 값이 커지면 그림자가 오른쪽으로 이동하고, shadowDy의 값이 커지면 아래쪽으로 이동합니다. 특히 음수(-) 값을 사용하면 반대 방향(왼쪽, 위쪽)으로 그림자가 이동합니다.

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40sp"
        android:shadowColor="#000000"
        android:shadowDx="-3"
        android:shadowDy="-3"
        android:shadowRadius="3.0"
        android:text="DROP SHADOW 2" />

텍스트뷰 shadow 속성 예제 2 (Drop Shadow)


그리고 shadowColor에 그림자로 표시될 색상 값을 지정할 수 있습니다.

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40sp"
        android:shadowColor="#FF0000"
        android:shadowDx="3"
        android:shadowDy="3"
        android:shadowRadius="3.0"
        android:text="DROP SHADOW 3" />

텍스트뷰 shadow 속성 예제 3 (Drop Shadow)


2.3.2 텍스트 주변을 그림자로 감싸기. (Outer Shadow)

두 번째 예제는 shadowDx와 shadowDy 값을 0으로 두고, shadowRadius만 값을 증가시켜 표현한 텍스트 주변 그림자 효과입니다.

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40sp"
        android:shadowColor="#444444"
        android:shadowDx="0"
        android:shadowDy="0"
        android:shadowRadius="5.0"
        android:text="OUTER SHADOW 1" />

텍스트뷰 shadow 속성 예제 4 (Outer Shadow)


TextView의 배경 색상(background)과 텍스트 색상(textColor)를 동일하게 설정하고, 그림자 색상(shadowColor)만 달리하여 테두리만 그려진 텍스트 효과를 낼 수 있습니다.

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40sp"
        android:background="#FFFFFF"
        android:textColor="#FFFFFF"
        android:shadowColor="#000000"
        android:shadowDx="0"
        android:shadowDy="0"
        android:shadowRadius="2.0"
        android:text="OUTER SHADOW 2" />

텍스트뷰 shadow 속성 예제 5 (Outer Shadow)


위의 예제에서 각 색상을 바꾸고 shadowRadius 값을 증가시켜, 네온 사인 텍스트 효과를 낼 수도 있습니다.

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40sp"
        android:background="#000000"
        android:textColor="#000000"
        android:shadowColor="#00FF00"
        android:shadowDx="0"
        android:shadowDy="0"
        android:shadowRadius="3.0"
        android:text="OUTER SHADOW 3" />

텍스트뷰 shadow 속성 예제 6 (Outer Shadow)


3. 참고.

.END.


ANDROID 프로그래밍/TEXTVIEW