Android开发三:控制UI界面的4种方法

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

使用XML文件来进行界面布局,可以将布局文件控制UI界面的代码 和逻辑控制的Java代码分离开来。
总体步骤:

  1. 在Android应用的res/layout目录下编写XML布局文件,创建后,R.java会自动收录该布局资源。
  2. 在Activity中使用以下Java代码显示XML文件中布局的内容。
setContentView(R.layout.man);

1.1 修改主Activity文件

在创建时选择Empty Activity则不需要修改,保持代码如下默认即可。

package com.example.demo;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;

public class MainActivity extends Activity {

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

1.2 修改 activity_main.xml 文件即布局文件

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/ic_launcher"
    >
    <!-- 添加提示文字 -->
    <TextView 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/title"
        style="@style/text"
        />
    
    <!-- 添加开始按钮 -->
    <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"
        />
</FrameLayout>

1.3 修改 strings.xml 文件即字符串资源

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

    <string name="app_name">demo</string>
    <string name="hello_world">Hello world!</string>
    <string name="title">标题哦</string>
    <string name="start">单击开即游戏</string>

</resources>

1.4 修改 styles.xml 文件即样式文件

<resources>

    <!--
        Base application theme, dependent on API level. This theme is replaced
        by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
    -->
    <style name="AppBaseTheme" parent="android:Theme.Light">
        <!--
            Theme customizations available in newer API levels can go in
            res/values-vXX/styles.xml, while customizations related to
            backward-compatibility can go here.
        -->
    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
    </style>
    
    <!-- 字体颜色 -->
    <style name="text">
        <item name="android:textSize">24dp</item>
        <item name="android:textColor">#112233</item>
    </style>

</resources>

1.5 启动项目查看效果

这里没有添加额外的图片,所以背景使用的是默认的应用icon,你可以在上面的代码中更改。

1.6 XML控制界面总结

  1. 在MainActivity中调用xml布局文件setContentView(R.layout.main);
  2. xml布局文件中如果引用了@string 字符串值,则需要在 res/values/strings.xml 中创建相应值。
  3. xml布局文件中如果引用了@style 样式值,则需要在 res/values/styles.xml 中创建相应样式

注意:如果则创建的项目直接运行闪退,可能是没有自行生成 MainActivity和layout文件,自己创建即可。

二、使用代码控制UI界面

你Java Swing那样,所有的UI组件都可以通过new关键字创建出来,并添加到布局管理器中。
总体步骤:

  1. 创建布局管理器,并设置其属性
  2. 创建具体的组件,并设置其布局和属性
  3. 将上一步创建的组件添加到布局管理器中。

2.1 创建布局管理器并添加组件

package com.example.demo;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.util.TypedValue;
import android.widget.FrameLayout;
import android.widget.TextView;

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.setBackgroundResource(R.drawable.ic_launcher);  // 使用应用图标作为背景
		setContentView(frameLayout);  // 启用布局
		
		// 创建一个TextView组件
		TextView title = new TextView(this);
		title.setText("使用代码控制布局");
		title.setTextSize(TypedValue.COMPLEX_UNIT_SP, 24);
		title.setTextColor(Color.rgb(200, 0, 70));
		frameLayout.addView(title);
	}
}

2.2 启动查看效果

三、使用XML和Java代码混合控制UI界面

3.1 使用XML创建布局

<?xml version="1.0" encoding="utf-8" ?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/layout">
    
</LinearLayout>

3.2 使用代码添加组件

package com.example.demo;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends Activity {

	private TextView[] textView = new TextView[4];  // 声明4个文字组件
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		LinearLayout layout = (LinearLayout)findViewById(R.id.layout);
		for (int i = 0; i < textView.length; i++) {
			textView[i] = new TextView(this);
			textView[i].setText("这是第
" + i + "个组件		");
			textView[i].setTextColor(Color.rgb(7, 0, 0));
			layout.addView(textView[i]);
		}
	}
}

3.3 启动查看效果

四、创建自定义的View

在Android中,所有的UI界面都是由View类和ViewGroup类及其子类组成的。
其中View类是所有UI组件的基类,
ViewGroup类是容纳这些UI组件的容器,其本身也是View类的子类。

原文地址:https://www.cnblogs.com/amnotgcs/p/14046442.html