基础UI控件 Cannas Drawable 复杂的TextView

UI的呈现 & UI事件

一、UI就是View

android中，UI就是View，所有界面组件继承于View类

动态生成界面代码例子：

package com.example.chenjinhua.graphic;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.LinearLayout;

public class CustomViewActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        LinearLayout linearLayout = new LinearLayout(this);

        //相当于xml里设置LinearLayout的宽高为MATCH_PARENT.
        linearLayout.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.MATCH_PARENT));

        Button button = new Button(this);
        button.setText("jinhua Button");

        //把Button加进父容器里.
        linearLayout.addView(button);

        setContentView(linearLayout);
    }
}

运行结果，模拟器显示为：

用Hierarchy View查看层级关系：

（1）、除了LinearLayout和Button，其余都是系统自动生成的；
（2）、FrameLayout以及TextView是Graphic这行.

界面显示机制：Canvas 和 Drawable

用Canvas画元素：

CustomView类：

package jinhua.demo.view;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.view.View;

//定义一个类继承View
public class CustomView extends View {

    public CustomView(Context context) {
        super(context);
    }

    //重写onDraw方法
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        Paint paint = new Paint();
        paint.setColor(Color.BLUE);
        canvas.drawRect(10,10,80,80,paint);

    }
}

CustomViewActivity代码：

package com.example.chenjinhua.graphic;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;

import jinhua.demo.view.CustomView;

public class CustomViewActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(new CustomView(this));
    }
}

用Drawable类来获取Drawable类型资源：

Drawable的好处：用了一种简单的方式替代了canvas，且和资源文件关联起来了。
Drawable必须setBounds()。

DrawableView类：

package com.example.chenjinhua.drawableview;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.drawable.BitmapDrawable;
import android.view.View;

/**
 * Created by chenjinhua on 16/2/15.
 */
public class DrawableView extends View {
    BitmapDrawable bitmapDrawable;


    public DrawableView(Context context) {
        super(context);

        bitmapDrawable = (BitmapDrawable) getResources().getDrawable(R.drawable.girl);
        bitmapDrawable.setBounds(10,10,135,150);

    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        bitmapDrawable.draw(canvas);
    }
}

DrawableViewActivity类：

package com.example.chenjinhua.drawableview;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class DrawableViewActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        DrawableView drawableView = new DrawableView(this);
        setContentView(drawableView);
    }
}

二、TextView
1、View的通用属性
2、设置autoLink
3、设置图片
4、HTML
5、更灵活的Span
6、设置跑马灯
7、事件
8、关于主题

例子 - 设置图片和设置autoLink

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="hello jinhua,。电话是：18818209888,邮箱是[email protected],新浪主页是http://www.baidu.com"
        android:textSize="20sp"
        android:textColor="#ff0000"
        android:hint="no data"
        android:singleLine="false"
        android:drawableLeft="@drawable/girl"
        android:drawablePadding="10dp"
        android:layout_marginLeft="10dp"
        android:autoLink="web"
        android:textColorLink="#0000ff"
        android:background="@drawable/girl"/>

</LinearLayout>

其中 android:drawableLeft=”@drawable/girl”//设置左边图片;
android:background=”@drawable/girl” //设置背景图

android:autoLink="web";//web链接可跳转
android:autoLink="phone"; //phone电话可跳转
android:autoLink="all"//底层支持的都可以跳转android:textColorLink="#0000ff" //设置链接颜色

所有xml文件里的属性设置，也可以用代码在Activity里设置，如下用TextView显示从Html字符串中可显示的样式文本（使用Spanned）：

package com.example.chenjinhua.formwidgit;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.text.Html;
import android.text.Spanned;
import android.widget.TextView;

public class FormWidgitActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_form_widgit);
        showTextView();
    }

    public void showTextView(){
       TextView textView1 = (TextView)findViewById(R.id.textView1);
        String html = "<body>中国你好</body>"
                + "<b>中国你好</b>"
                +"<h1>中国你好</h1>"
                +"<font color='#0000ff'>中国你好</font>"
                + "<img src='Qhttps://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png' />";
        Spanned spanned = Html.fromHtml(html);
        textView1.setText(spanned);
    }
}

定义了一个showTextView()方法，该方法覆盖了xml文件里定义的TextView的文本内容；
TextView.setText(“String”)方法里的String是spanned;
从运行结果看出未显示html里图片，要实现图片的显示需要使用Html.fromHtml的另外一个重构方法。

运行结果为：

TextView显示Html图片（图片来源于Drawable资源）：

package com.example.chenjinhua.formwidgit;

import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.text.Html;
import android.text.Spanned;
import android.widget.TextView;

import static android.text.Html.fromHtml;

public class FormWidgitActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_form_widgit);
        showTextView();
    }

    public void showTextView(){
       TextView textView1 = (TextView)findViewById(R.id.textView1);
        String html = "<body>中国你好</body>"
                + "<b>中国你好</b>"
                +"<h1>中国你好</h1>"
                +"<font color='#0000ff'>中国你好</font>"
                + "<img src='Qhttps://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png' />";
        Html.ImageGetter imageGetter = new Html.ImageGetter(){
            @Override
            public Drawable getDrawable(String s) {
                if(s != null){
                    BitmapDrawable bitmapDrawable = (BitmapDrawable) getResources().getDrawable(R.drawable.girl);
                    bitmapDrawable.setBounds(0,0,bitmapDrawable.getIntrinsicWidth(),bitmapDrawable.getIntrinsicHeight());
                    return bitmapDrawable;
                }else{
                    return null;
                }

            }
        };

        Spanned spanned = fromHtml(html,imageGetter,null);
        textView1.setText(spanned);
    }
}

运行结果为：

注意Drawable必须setBounds()。否则默认图片都不显示。

更灵活的Span - Android字符串中加图片或者修改字符串样式：

SpannableString、SpannableStringBuilder与String的关系：
首先SpannableString、SpannableStringBuilder基本上与String差不多，也是用来存储字符串，但它们俩的特殊就在于有一个SetSpan（）函数，能给这些存储的String添加各种格式或者称样式（Span），将原来的String以不同的样式显示出来，比如在原来String上加下划线、加背景色、改变字体颜色、用图片把指定的文字给替换掉，等等。所以，总而言之，SpannableString、SpannableStringBuilder与String一样， 首先也是传字符串，但SpannableString、SpannableStringBuilder可以对这些字符串添加额外的样式信息，但String则不行。

package com.example.chenjinhua.formwidgit;

import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.text.SpannableString;
import android.text.Spanned;
import android.text.style.ImageSpan;
import android.widget.TextView;

public class FormWidgitActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_form_widgit);
        showTextView();
    }

    public void showTextView(){
       TextView textView1 = (TextView)findViewById(R.id.textView1);

        BitmapDrawable bitmapDrawable = (BitmapDrawable) getResources().getDrawable(R.drawable.girl);
        bitmapDrawable.setBounds(0,0,bitmapDrawable.getIntrinsicWidth(),bitmapDrawable.getIntrinsicHeight());

        //构造SpannedString
        SpannableString spannableString = new SpannableString("今天天气真是棒，红色打电话图片");
        ImageSpan imageSpan = new ImageSpan(bitmapDrawable,ImageSpan.ALIGN_BASELINE);
        spannableString.setSpan(imageSpan,13,14,Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
        textView1.setText(spannableString);
    }
}

运行结果为：

设置跑马灯：
xml属性添加设置为：

        android:singleLine="true"
        android:ellipsize="marquee"
        android:focusable="true"
        android:focusableInTouchMode="true"
        android:marqueeRepeatLimit="marquee_forever"