Android——控制UI界面

一、使用XML布局文件控制UI界面

res\layout\activity_main.xml代码如下：

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

    xmlns:tools="http://schemas.android.com/tools"

    android:id="@+id/FrameLayout1"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:background="@drawable/background">

<TextView 

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

	android:text="@string/title"

	style="@style/text"

    >

</TextView>

<TextView

    android:id="@+id/startButton"

	android:layout_gravity="center_vertical|center_horizontal"

	android:text="@string/start"

	android:layout_width="wrap_content"

	android:layout_height="wrap_content"

	style="@style/text"

    >

    

</TextView>

</FrameLayout>

一个TextView组件用于显示提示文字，一个在窗体正中间显示开始游戏按钮

其中res\values\styles.xml代码如下

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

	<style name="text">

	    <item name="android:textSize">24dp</item>

	    <item name="android:textColor">#111111</item>

	</style>

</resources>

用于指定应用的样式，指定文字的大小和颜色。

最后在主活动中也就是MainActivity中，应用一下代码指定应用的布局文件。

setContentView(R.layout.activity_main);

二、用代码来控制UI界面

package com.basil_lee.ui;



import android.os.Bundle;

import android.app.ActionBar.LayoutParams;

import android.app.Activity;

import android.app.AlertDialog;

import android.content.DialogInterface;

import android.graphics.Color;

import android.util.TypedValue;

import android.view.Gravity;

import android.view.Menu;

import android.view.View;

import android.view.View.OnClickListener;

import android.view.ViewGroup;

import android.widget.FrameLayout;

import android.widget.TextView;

import android.widget.Toast;



public class MainActivity extends Activity {



	@Override

	protected void onCreate(Bundle savedInstanceState) {

		super.onCreate(savedInstanceState);

		//setContentView(R.layout.activity_main);

		FrameLayout frameLayout=new FrameLayout(this);//创建帧布局管理器

		frameLayout.setBackgroundDrawable(this.getResources().getDrawable(R.drawable.background));//设置背景图片

		setContentView(frameLayout);//设置在Activity中显示frameLayout

		//创建一个TextView组件

		TextView text1=new TextView(this);

		text1.setText("在代码中控制UI界面");

		text1.setTextSize(TypedValue.COMPLEX_UNIT_PX,24);//设置文字的大小，单位为像素

		text1.setTextColor(Color.rgb(1, 1, 1));

		frameLayout.addView(text1);

		//创建另外一个TextView组件

		TextView text2=new TextView(this);

		text2.setText("单击进入游戏。。。。。。");

		text2.setTextSize(TypedValue.COMPLEX_UNIT_PX,50);//设置文字的大小，单位为像素

		text2.setTextColor(Color.rgb(1, 1, 1));

		LayoutParams params=new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,

				ViewGroup.LayoutParams.WRAP_CONTENT);//创建保存布局参数的对象

		params.gravity=Gravity.CENTER_HORIZONTAL|Gravity.CENTER_VERTICAL;

		text2.setLayoutParams(params);

		//为text2组件添加单击事件，并将组件添加到布局管理器中

		text2.setOnClickListener(new OnClickListener() {

			public void onClick(View arg0) {

				new AlertDialog.Builder(MainActivity.this).setTitle("系统提示")

					.setMessage("游戏有风险，进入需谨慎，真的要进入吗？")

					.setPositiveButton("确定", new DialogInterface.OnClickListener() {

						public void onClick(DialogInterface arg0, int arg1) {

							Toast.makeText(MainActivity.this, "进入游戏", Toast.LENGTH_LONG).show();

						}

					}).setNegativeButton("退出",new DialogInterface.OnClickListener() {

						public void onClick(DialogInterface arg0, int arg1) {

							Toast.makeText(MainActivity.this, "退出游戏", Toast.LENGTH_LONG).show();

							finish();

						}

					}).show();

			}

		});

		

	   frameLayout.addView(text2);

	}



}

三、虽然完全通过XML布局文件控制UI界面，实现起来比较方便快捷，但是有失灵活性；而完全通过Java代码控制UI界面，虽然比较灵活，但是开发过程比较繁琐。因此常常两者结合。

首先是界面布局代码：

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

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

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="horizontal"

    android:background="@drawable/background"

       android:id="@+id/mylayout">



</LinearLayout>

然后Java代码如下：

    setContentView(R.layout.test);

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

        for(int i=0;i<imgPath.length;i++){

            img[i]=new ImageView(this);//创建一个ImageView组件

            img[i].setImageResource(imgPath[i]);

            img[i].setPadding(5, 5, 5, 5);//设置ImageView组件的内边距

            LayoutParams params=new LayoutParams(153,148);//设置组件的宽度和高度

            img[i].setLayoutParams(params);//为ImageView组件设置布局参数

            linearLayout.addView(img[i]);//将ImageView组件添加到布局管理器中

        }

以上代码在窗体中横向并列的显示4张图片

四、除了以上三种我们还可以开发自定义的View

开发自定义的View组件大致分为以下三个步骤：

• 创建一个继承android.view.View类的View类，并且重写构造方法
• 根据需要重写相应的方法。
• 在项目中创建并实例化自定义的View类，并将其添加到布局管理器中。

下面是类似飞机大战中的一个例子：

class MyView extends View{

	

	public float bitMapX;

	public float bitMapY;

	public MyView(Context context) {

		super(context);

		bitMapX=750;

		bitMapY=750;

	}

	@Override

	protected void onDraw(Canvas canvas) {

		// TODO Auto-generated method stub

		super.onDraw(canvas);

		Paint paint=new Paint();

		Bitmap bitmap=BitmapFactory.decodeResource(getResources(),R.drawable.air1);

		canvas.drawBitmap(bitmap, bitMapX,bitMapY,paint);

		if(bitmap.isRecycled()){

			bitmap.recycle();

		}

	}

}

　　

	protected void onCreate(Bundle savedInstanceState) {

		super.onCreate(savedInstanceState);

		setContentView(R.layout.test2);

		FrameLayout frameLayout=(FrameLayout)findViewById(R.id.mylayout);

		final MyView air=new MyView(getApplicationContext());

		air.setOnTouchListener(new OnTouchListener() {

			

			@Override

			public boolean onTouch(View arg0, MotionEvent arg1) {

				air.bitMapX=arg1.getX();

				air.bitMapY=arg1.getY();

				air.invalidate();

				return true;

			}

		});

		frameLayout.addView(air);

这样就可以使飞机那种图片跟随者手指去移动了。

以上就是三种UI的控制方法。