안드로이드 TextView에 html 적용하기

프로그래밍|2014.04.16 08:00
안드로이드 TextView에 html 적용하기



안드로이드 프로그래밍을 할 때 TextView를 꾸미고 싶으신 분들이 있습니다. 보통 기본적으로 안드로이드에서 제공해주는 거 외에 html로 꾸밀 수 있다는 사실을 알고 계시나요?

일반적으로 html은 홈페이지 소스로도 많이 사용되고 있고 가끔씩 소스 코드를 보는 일반인들의 눈에도 익숙해져 있습니다. 게다가 html이라는 저 단어만 들어서 이 게 홈페이지 소스구나라고 생각들게 만드네요.



과연 어떻게 안드로이드 프로그래밍을 할 때 사용이 될 수 있는지 간단한 소스를 보여드리겠습니다. Html.fromHtml이라는 걸 사용을 하면 되는데, 사용 방법은 크게 어렵지 않습니다. 조금은 도움이 되지 않을 수 있을 수도 있겠지만 ListView나 Custom ListView에서 유용하게 사용을 하고 있습니다. 따로 앱을 개발을 하시는 분이라면 아무래도 이러한 기능을 사용을 하지 않을까 생각이 듭니다. 소스를 통해 자세히 알아보면 간단하게 구성이 되었구나라고 이해를 하시게 될거에요. 기존에 html 태그를 알고 계시다면 유용하실거에요.

activity_main.xml 

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <TextView
        android:id="@+id/txt1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="textView" />

    <TextView
        android:id="@+id/txt2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/txt1"
        android:layout_below="@+id/txt1"
        android:layout_marginTop="42dp"
        android:text="textView" />

    <TextView
        android:id="@+id/txt3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/txt1"
        android:layout_below="@+id/txt1"
        android:layout_marginTop="112dp"
        android:text="textView" />
   
</RelativeLayout>


MainActivity.java

package com.example.htmltest;

import android.app.Activity;
import android.os.Bundle;
import android.text.Html;
import android.view.Menu;
import android.widget.TextView;

public class MainActivity extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  
  TextView txt1 = (TextView)findViewById(R.id.txt1);
  txt1.setText(Html.fromHtml("<font size = '11'>" + "티스토리 블로그" + "</font>"));
  
  TextView txt2 = (TextView)findViewById(R.id.txt2);
  txt2.setText(Html.fromHtml("<font color = '#FF00DD'>" + "HTML 글씨 태그 테스트" + "</font>"));
  
  TextView txt3 = (TextView)findViewById(R.id.txt3);
  txt3.setText(Html.fromHtml("<h1>" + "글씨크기" + "</h1>"));
 
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.main, menu);
  return true;
 }
}


이클립스에서 안드로이드 프로젝트 생성 후에 입력을 하신 후에 스마트폰 기기나 가상기기에서 실행을 하여 보세요. 일반적으로 TextView 옵션을 통해 꾸몄을 때와 다른 느낌이 들거에요. 그냥 보거 가는 거 하고, 실제로 해보는 거 하고는 정말 차이가 나는 거 같네요. 호기심이 있으시다면 따라해보시길 바래요^^

댓글(8)