UI (1) 简单的画布

画画 可以在 view 和SurfaceView上面画

SurfaceView继承view 更加平滑 适合动画

在view上画画

最简单的 需要什么呢：

1 得到画布：继承view实现onDraw（）在他里面画画了。他决定了 你画的是什么形状 比如 菱形椭圆等待呢个

2得到画笔：设置Paint (画笔)  决定了你是 用铅笔 毛笔等等  决定粗细 颜色 硬度等等

    其中有一个函数叫Invalidate()

    作用是刷新 画完刷一下 开始画 。可以画出闪烁等样子了。。

    如果在子线程中 就要用postInvalidate（）方法了。这个等于发送一个handler

    在主线程中更新界面

ui都是由view和viewGroup组成的

view理解为各种控件

viewGroup理解为LinearLayout 等各种布局 。。。

空间要在布局里面才可以显示 不然就乱了。。

所以android定义的是 

                    ViewGroup

        ViewGroup                view

view        view                view  view

这个结构就可看出 所有要定义 控件先定义一个布局

在界面上定义一个Butten按钮方法两种

1动态定义

package  com.example.view;

import  java.util.concurrent.ConcurrentHashMap;

import  android.app.Activity;
import  android.os.Bundle;
import  android.view.View;
import  android.view.View.OnClickListener;
import  android.widget.Button;
import  android.widget.LinearLayout;
import  android.widget.Toast;
import  android.widget.LinearLayout.LayoutParams;

public  class  CustomViewActivity  extends  Activity {

    @Override
    protected  void  onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super .onCreate(savedInstanceState);

        LinearLayout linearLayout =  new  LinearLayout( this );
        linearLayout.setLayoutParams( new  LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.WRAP_CONTENT)

        );
        Button button =  new  Button( this );
        button.setText( "wang button" );
        button.setLayoutParams( new  LayoutParams(
                android.view.ViewGroup.LayoutParams.WRAP_CONTENT,
                android.view.ViewGroup.LayoutParams.WRAP_CONTENT));


        setContentView(linearLayout);
    }
}

一般都是 setContentView(R.layout.xx);的形式 但xml和LinearLayout都是view所以也可以

这样就 完全没有xml定义了button。

1 xml定义

text.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:layout_width= "match_parent"
        android:layout_height= "wrap_content"
         />

    <Button
        android:id= "@+id/AA"
        android:layout_width= "wrap_content"
        android:layout_height= "wrap_content"
        android:text= "@string/hello_world"  />

</RelativeLayout>

在activity中setContentView(linearLayout);改为setContentView(R.layout.text);

下面就画一个简单的 红色正方形 写上字 有监听事件的

activity中

package  com.example.view;

import  java.util.concurrent.ConcurrentHashMap;

import  android.app.Activity;
import  android.os.Bundle;
import  android.view.View;
import  android.view.View.OnClickListener;
import  android.widget.Button;
import  android.widget.LinearLayout;
import  android.widget.Toast;
import  android.widget.LinearLayout.LayoutParams;

public  class  CustomViewActivity  extends  Activity {

    @Override
    protected  void  onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super .onCreate(savedInstanceState);


        CostomView cv =  new  CostomView( this );
        cv.setOnClickListener( new  OnClickListener() {

            @Override
            public  void  onClick(View v) {
                // TODO Auto-generated method stub

                Toast.makeText(CustomViewActivity. this ,  "hello word" ,  1 ).show();
            }
        });
        setContentView(cv);
    }
}

CostomView中

package  com.example.view;

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

public  class  CustomView  extends  View {

    private  Paint paint;

    public  CustomView(Context context) {
        super (context);
        // TODO Auto-generated constructor stub
    }

    @Override
    protected  void  onDraw(Canvas canvas) {
        // TODO Auto-generated method stub
        super .onDraw(canvas);

        paint= new  Paint();
        paint.setColor(Color.RED);


        //drawRect
        canvas.drawRect( 10 ,  10 ,  90 ,  90 , paint);

//      canvas.clipRect(20, 50, 180, 170);//裁剪
        canvas.rotate(40f);
        canvas.save();

        //drawText
        paint.setColor(Color.BLACK);
        canvas.drawText( "helloview" ,  20 ,  20 , paint);
        //drawOval
        paint.setColor(Color.BLUE);
        paint.setAntiAlias( true );

        RectF oval =  new  RectF( 20 ,  10 ,  100 ,  120 );
        canvas.drawOval(oval, paint);
        canvas.restore();
//      canvas.setMatrix(matrix);

    }
}

其中canvas.save()保存斜的画布 为正常的。。canvas.restore();取出保存的内容 。感觉很难理解。。

我们如果单独处理一张图片的时候，而且不想影响其他部分的绘制

上面代码 就让 红色的方形 不懂 文字和椭圆 转了

​

用canvas画图

常用的draw****

drawRect 长方形 矩形

drawCircle 园

drawOval椭圆

drawPath 路径  不规则图形

drawLine    一条线

drawPoint    一个点

drawText        画一个文字

drawColor    画一个背景色

drawBitmap 画一个图片