ABOUT ME

dddd-

Today
-
Yesterday
-
Total
-
  • [TextView] 안드로이드 TextView의 모든 것 1 - 기초
    Android/개발 2018. 10. 29. 21:41


    안드로이드 텍스트뷰의 모든것 1 - 기초(자동링크, 글자크기 자동 조절, 말줄임표로 표시, 기본패딩 제거)







    TextView는 Android의 가장 기본적인 View 입니다. TextView 사용하는 방법만 잘 알아도 보다 세련되고 가벼운 앱을 만들 수 있습니다. TextView의 속성을 잘 몰라 뭔가 필요하면 라이브러리를 가져다 쓸 수 있지만 조금만 알면 기본적인 TextView로도 원하는 것을 모두 할 수 있습니다!





    TextView의 기본속성으로는 width, height, text, textSize, textColor, textStyle 등이 있습니다. 이 외에도 80개가 넘는 속성을 가지고 있는데 막상 쓰는것은 몇 개 되지 않죠? 필요하지 않은 것도 있지만 몰라서 못쓰는 TextView의 속성들을 알아보도록 하겠습니다.






    TextView의 유용한 속성 4가지



    autoLink (default none, 자동링크)

    - email    : TextView의 text가 이메일 형식이면 클릭 시 이메일 앱을 열어줌

    - map     : TextView의 text가 주소 형식이면 클릭 시 지도 앱을 열어줌(외국 주소만 되는거 같네요.)

    - phone  : TextView의 text가 전화번호 형식이면 클릭 시 전화 앱을 열어줌

    - web     : TextView의 text가 전화번호 형식이면 클릭 시 인터넷 앱을 열어줌

    - all        : TextVIew의 text가 위 4가지 중 하나면 클릭 시 해당하는 앱을 열어줌


    예제소스)

    <TextView
    android:id="@+id/textViewAutoLink"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="4dp"
    android:text="https://www.naver.com/"
    android:textSize="20sp"
    android:textColor="@android:color/black"
    android:autoLink="all"/>


    결과


    - text에 link가 지정된 것을 볼 수 있습니다.






    autoSizeTextType (default none, AutoSizing)

    - uniform    : TextView의 크기(높이와 넓이)에 맞게 텍스트뷰의 글자크기를 자동으로 늘려주거나 줄여줌


    예제소스)

    <TextView
    android:id="@+id/textViewAutoSize"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:layout_marginTop="4dp"
    android:background="@android:color/black"
    android:text="Hello World!"
    android:textSize="20sp"
    android:textColor="@android:color/white"
    app:autoSizeTextType="uniform"
    app:autoSizeMinTextSize="20sp"
    app:autoSizeMaxTextSize="50dp"/>


    - 이 속성은 높이가 항상 고정된 값이어야 합니다. 고정값을 주지 않고 높이에 wrap_content 속성을 줘버리면 지정한 textSize로 나오게 됩니다. 나머지 속성에 대해 설명드리자면

    autoSizeMinTextSize : TextView의 크기가 작아지거나 text가 길어지더라도 더이상 줄어들지 않을 최소한의 textSize

    autoSizeMaxTextSizeTextView의 크기가 커지거나 text가 짧아지더라도 더이상 커지지 않을 최대한의 textSize


    결과


    - height는 80dp, autoSizeMaxTextSize는 50sp로 지정했습니다.

      TextView 크기가 남는데 50sp까지만 커진것을 볼 수 있습니다.






    ellipsize (default none, text 줄이기)

    - start        : TextView의 마지막 부분을 표시하고 마지막이 보여지고 남은 앞 부분의 text를 ...으로 표시

    - middle     TextView의 첫 부분과 마지막 부분을 표시하고 가운데 부분의 text를 ...으로 표시

    - end         TextView의 첫 부분을 표시하고 첫 부분 글자가 보여지고 남은 뒷 부분의 text를 ...으로 표시

    - marquee  : TextView의 text가 길다면 흘러가는 text로 표시

      * marquee를 쓸 때 사용하는 추가 속성

        marqueeRepeatLimit : text가 처음부터 끝까지 흐르는 횟수, marquee_forever로 지정하면 무한 반복

        focusable = true, focusableInTouchMode = true : marquee가 작동하기 위해 지정


    예제소스)

    <TextView
    android:id="@+id/textViewEllipsize"
    android:layout_width="80dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="4dp"
    android:text="Hello World!"
    android:textSize="20sp"
    android:textColor="@android:color/black"
    android:ellipsize="middle"
    android:singleLine="true"/>


    - ellipsize를 사용하기 위해선 singleLine = true 속성을 추가해줘야 합니다.

      singleLine 속성은 deprecated 속성이지만 안스에서 ellipsize를 사용할 땐 singleLine을 사용하라고 안내를 해줍니다.


    결과


    - width를 80dp로 지정했더니 'Hello World!'가 다 출력되지 못하고 가운데 부분이 ...처리 되었습니다.






    includeFontPadding (default true)

    - false    : TextView에 설정된 기본 Font Padding을 사용하지 않도록 설정


    예제소스)

    <TextView
    android:id="@+id/textViewFontPaddingFalse"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@android:color/black"
    android:text="Hello World!"
    android:textSize="20sp"
    android:textColor="@android:color/white"
    android:includeFontPadding="false"/>


    결과


    - 왼쪽 : 기본 TextView

      오른쪽 : IncludeFontPadding = false

      TextView에 기본을 들어가있던 위아래 padding이 사라진 것을 볼 수 있습니다.





    이렇게 TextView에는 많은 속성들이 있고 그것들을 활용하면 효과적인 UI를 구성할 수 있습니다!

    더 많은 속성들을 확인하려면 아래 링크를 눌러주세요!

    TextView 공식 레퍼런스



    TextView의 모든 것 2 - 모서리 둥글게 버튼 만들기편 보러가기

    TextView의 모든 것 3 - 특정 문자열 속성바꾸기편 보러가기


    * 궁금한점이 있으시면 댓글로 남겨주세요~ 최대한 빨리 답변드리도록 하겠습니다!





    댓글

Designed by Tistory.