幾種開發UI界面的方式demo Android

下面用demo說明： 

1.######## 用編程的方式開發UI界面 2014年5月13日 上午6:07 ##################

/* 用編程的方式開發UI界面 */

// 建立一個線性佈局管理器

LinearLayout layout = new LinearLayout(this);

// 設置Activity顯示layout

super.setContentView(layout);

// 設置layout中的控件垂直排列

layout.setOrientation(LinearLayout.VERTICAL);

// 建立一個TextView

final TextView tvShow = new TextView(this);

// 建立一個按鈕

Button btn = new Button(this);

btn.setText(R.string.ok);

btn.setLayoutParams(new ViewGroup.LayoutParams(

ViewGroup.LayoutParams.WRAP_CONTENT,

ViewGroup.LayoutParams.WRAP_CONTENT));

// 向layout中添加TextView

layout.addView(tvShow);

// 向layout中添加按鈕

layout.addView(btn);

// 爲按鈕綁定一個監聽事件

btn.setOnClickListener(new OnClickListener()

{

@Override

public void onClick(View v)

{

tvShow.setText("Hello , Android ," + new java.util.Date());

}

});

################### 用編程的方式開發UI界面 end ##################

2.### 使用xml佈局文件和java代碼混合控制UI界面 2014年5月13日 上午6:29 ###

/** 定義一個訪問圖片的數組 */

int[] images = new int[]

{ R.drawable.reader_king_logo, R.drawable.ic_launcher,

R.drawable.reader_king_logo, R.drawable.ic_launcher,

R.drawable.reader_king_logo };

/** 當前的imge下標 */

private int currentImg = 0;

。。。。。。。。。。

setContentView(R.layout.activity_main);

//獲取LinearLayout佈局容器

LinearLayout linearLayout = (LinearLayout)

findViewById(R.id.activity_main_ll_root);

//程序建立ImageView組件

final ImageView image = new ImageView(this);

//將ImageView組件添加到LinearLayout佈局容器中

linearLayout.addView(image);

//初始化時顯示第一張圖片

image.setImageResource(images[0]);

//設置ImageView的點擊事件

image.setOnClickListener(new OnClickListener()

{

@Override

public void onClick(View v)

{

if(currentImg >= 4){

currentImg = -1;

}

//改變ImageView中顯示的圖片

image.setImageResource(images[++currentImg]);

}

});

### 使用xml佈局文件和java代碼混合控制UI界面 2014年5月13日 上午6:29 end ###

3.自定義view

在MainActivity.java中寫以下代碼：

Intent intent = new Intent();

intent.setClass(this, CustomViewActivity.class);

startActivity(intent);

下面是CustomViewActiviy.java的具體代碼：

package com.example.lganroid;

import android.app.Activity;

import android.os.Bundle;

import android.view.MotionEvent;

import android.view.View;

import android.view.View.OnTouchListener;

import android.widget.LinearLayout;

/**

 * 實現跟隨手指的小球

 * 

 * @做者： 劉倩</br>

 * @時間： 2014年5月13日 上午7:05:53</br>

 * @描述： 自定義View的具體實現</br>

 */

public class CustomViewActivity extends Activity

{

@Override

protected void onCreate(Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

// 加載佈局xml文件

setContentView(R.layout.activity_main);

// 獲取佈局文件的LinearLayout容器

LinearLayout linearLayout = (LinearLayout) findViewById(R.id.activity_main_ll_root);

// 建立DrawView組件

final DrawView drawView = new DrawView(this);

// 設置自定義組件的最小寬度和高度

drawView.setMinimumWidth(300);

drawView.setMinimumHeight(500);

// 爲drawView組件綁定Touch事件

drawView.setOnTouchListener(new OnTouchListener()

{

@Override

public boolean onTouch(View v, MotionEvent event)

{

// 修改drawView的currentX和currentY兩個屬性

drawView.currentX = event.getX();

drawView.currentY = event.getY();

// 通知draw組件重繪

drawView.invalidate();

// 返回true表名處理方法已經處理改事件

return true;

}

});

// 將drawView組件添加到Linearlayout中

linearLayout.addView(drawView);

}

}

運行以後就能夠看到隨手指移動的自定義的小紅球。

4.自定義控件屬性（其一）

package com.example.lganroid;

import android.content.Context;

import android.content.res.TypedArray;

import android.graphics.Canvas;

import android.graphics.Paint;

import android.graphics.Paint.Style;

import android.util.AttributeSet;

import android.view.View;

/**

 * 自定義控件的屬性

 * 

 * @做者： 劉倩</br>

 * @時間： 2014年5月13日 上午7:16:49</br>

 * @描述： 自定義控件的屬性，主要包括顏色和大小</br>

 */

public class CustomView extends View

{

/** 聲明畫筆 */

private Paint mPaint;

/** 要顯示的字符串 */

private String mText = "hello";

/**

* 有參構造函數

* 

* @param context

*            上下文

* @param attrs

*            屬性

*/

public CustomView(Context context, AttributeSet attrs)

{

super(context, attrs);

// 初始化畫筆

mPaint = new Paint();

// TypedArray是存放資源的數組，經過上下文獲得這個數組，attrs是構造函數傳進來的，對應attrs.xml

TypedArray typedArray = context.obtainStyledAttributes(attrs,

R.styleable.CustomView);

// 得到xml裏定義的屬性，格式爲 名稱_屬性名 後面是默認值

int textColor = typedArray.getColor(R.styleable.CustomView_textColor,

0xFFFFFFFF);

float textSize = typedArray.getDimension(

R.styleable.CustomView_textSize, 35);

mPaint.setColor(textColor);

mPaint.setTextSize(textSize);

// 爲了保持之後使用該屬性一致性，返回一個綁定資源結束的信號給資源

typedArray.recycle();

}

@Override

protected void onDraw(Canvas canvas)

{

super.onDraw(canvas);

mPaint.setStyle(Style.FILL);

canvas.drawText(mText, 10, 60, mPaint);

}

}

在main.xml中的引用以下：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:test="http://schemas.android.com/apk/res/com.example.lganroid"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <com.example.lganroid.CustomView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        test:textColor="#f00"

        test:textSize="20sp" />

 </LinearLayout>

在attrs.xml中配置以下：

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <declare-styleable name="CustomView">

        <attr name="textColor" format="color" />

        <attr name="textSize" format="dimension" />

    </declare-styleable>

</resources>

5.自定義控件屬性（其二）

package com.example.lganroid;

import android.annotation.SuppressLint;

import android.content.Context;

import android.graphics.Canvas;

import android.graphics.Color;

import android.util.AttributeSet;

import android.widget.Button;

import android.widget.LinearLayout;

/**

 * 自定義線性佈局

 * 

 * @做者： 劉倩</br>

 * @時間： 2014年5月13日 下午7:28:33</br>

 * @描述： 自定義線性佈局，在其中添加一個按鈕，並設置按鈕的文字，大小和顏色</br>

 */

public class CustomView2 extends LinearLayout

{

/** 按鈕顯示的文字 */

private String BtnText;

public CustomView2(Context context)

{

super(context);

}

public CustomView2(Context context, AttributeSet attrs)

{

super(context, attrs);

//聲明按鈕的id

int resourceId = -1;

//聲明按鈕

Button btn = new Button(context);

//從佈局文件得到按鈕的id

resourceId = attrs.getAttributeResourceValue(null, "BtnText", 0);

if(resourceId >0 ){

BtnText = context.getResources().getText(resourceId).toString();

}else{

BtnText = "";

}

btn.setText(BtnText);

//設置按鈕文字的顏色爲紅色

btn.setTextColor(Color.RED);

//設置按鈕中的字體大小爲18像素

btn.setTextSize(18);

//將按鈕加載到線性佈局中

addView(btn);

//設置佈局的排列方式爲垂直排列

this.setGravity(LinearLayout.VERTICAL);

}

@SuppressLint("NewApi")

public CustomView2(Context context, AttributeSet attrs, int defStyle)

{

super(context, attrs, defStyle);

}

@Override

protected void onDraw(Canvas canvas)

{

super.onDraw(canvas);

}

}

在main.xml中的配置：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:test="http://schemas.android.com/apk/res/com.example.lganroid"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

    <com.example.lganroid.CustomView2

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        BtnText="@string/app_name"

         />

</LinearLayout>