android ui设计 textview,Android UI设计——TextView控件

TextView这个可以说是Android中最简单的一个控件了。该控件主要用来显示一段文字。

其中控件的显示设置也很简单，这里简单说一下重要的几个，控件的id，layout_weigth(宽度)，layout_height(高度)，text(显示文字内容)等都是比较常用和简单的设置，不在详细描述。

(1)文字的编辑

设置文本的大小，颜色有两种方式：一种是通过在layout中的布局文件中设置；另一种是在Activity中的onCreate方法中进行设置。

xml文件设置

设置文字的内容为“消息”，大小为“20sp”(文字的单位一般采用sp)，颜色是“黑色”，文字对其方式是“居中”。

Activity中的修改

//设置文字大小 ，大小只能传像素值

textView.setTextSize(67);

//设置颜色，三种方式。

textView.setTextColor(0xff00ff00);

textView.setTextColor(Color.BLUE);

textView.setTextColor(Color.argb(0x99, 0xff, 0x00, 0x00));

// 通过values中的color中设置的颜色来设定。

int color = getResources().getColor(R.color.red);

textView.setTextColor(color);

(2)文本的链接

将文本中的电话号码，Email，URL等设置为链接。对这个的设置叶有两种方式：一种是在layout中的xml文件中进行添加；另一种是在Activity的onCreate方法中添加代码。

xml文件设置

链接设置可以设置为：all， map, none, email, phone以及web。在这我们以设置为phone为例。 (电话号码是随便编的哟……)

Activity中的修改

// 设置连接方式，文字必须在其后面。

textView.setAutoLinkMask(Linkify.ALL);

textView.setText("TextView:13314121514");

(3)添加图片

可以在TextView中添加图片，通过在layout中的布局文件中添加，添加的过程同时也设置了图片字TextView中的位置，如下设置的是在其顶部：

android:drawableTop="@mipmap/communication"

也可以修改图片上下所占的间距，通过如下代码：

android:drawablePadding="10sp"

(4)文本的省略显示

之前我记得我第一部智能手机在收到短信的时候，如果我在其他应用中，短信的内容如果过长机会再我手机的系统标题栏上滚动显示，那其实就是一种对文本过长的处理。

在TextView中可以设置 android:ellipsize属性就行修改。android:ellipsize的属性值有marquee(滚动显示)，end(末尾显示······)，middle(中间显示······)，none(不显示省略号，多余自动不显示)。

其中end， middle， none的设置很简单，只需要设置android:ellipsize=""即可,但是滚动显示“marquee”还需要设置焦点，代码如下：

android:ellipsize="marquee"

android:focusable="true"

android:focusableInTouchMode="true"

android:singleLine="true"

(5)富文本

先说一下什么是富文本，富文本就是对文本中一些特殊文字或者图片的特殊显示。例如我们我们发一段话“你还没有还我100块钱。”这句话我们要强调“100块钱”这是后我们可以把它显示为特殊的颜色，这其实就是一种富文本。有时候我们QQ聊天经常发表情，其实这也是一种富文本。富文本，可以支持一部分的HTML，也可以动态添加的一些图片。

textFu = (TextView) findViewById(R.id.textFu);

Spanned spanned = Html.fromHtml("这是一个富文本,然后加一个图标",

new Html.ImageGetter() {

@Override

public Drawable getDrawable(String s) {

int id = R.mipmap.ic_launcher;

//方法一：通过反射获得s.

Class clazz =R.mipmap.class;

try {

Field field = clazz.getDeclaredField(s);

id = field.getInt(s);

} catch (NoSuchFieldException e) {

e.printStackTrace();

} catch (IllegalAccessException e) {

e.printStackTrace();

}

Drawable drawable = getResources().getDrawable(id);

drawable.setBounds(0,0,drawable.getIntrinsicWidth(),drawable.getIntrinsicHeight());

}

},null);

textFu.setText(spanned);

textFu.setPaintFlags(Paint.STRIKE_THRU_TEXT_FLAG);

textFu = (TextView) findViewById(R.id.textFu);

Spanned spanned = Html.fromHtml("这是一个富文本,然后加一个图标",

new Html.ImageGetter() {

@Override

public Drawable getDrawable(String s) {

//方法二，直接通过R.mipmap.a_merchant_06_click，得到图片。

Drawable drawable = getResources().getDrawable(R.mipmap.a_merchant_06_click);

drawable.setBounds(0,0,drawable.getIntrinsicWidth(),drawable.getIntrinsicHeight());

return drawable;

}

},null);

textFu.setText(spanned);

textFu.setPaintFlags(Paint.STRIKE_THRU_TEXT_FLAG);

代码设置的富文本显示如下：