目錄
一、使用XML布局文件控制UI界面
使用XML文件來進行界面布局,可以將布局文件控制UI界面的代碼 和邏輯控制的Java代碼分離開來。
總體步驟:
- 在Android應用的res/layout目錄下編寫XML布局文件,創建后,R.java會自動收錄該布局資源。
- 在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控制界面總結
- 在MainActivity中調用xml布局文件
setContentView(R.layout.main);
- xml布局文件中如果引用了@string 字符串值,則需要在 res/values/strings.xml 中創建相應值。
- xml布局文件中如果引用了@style 樣式值,則需要在 res/values/styles.xml 中創建相應樣式
注意:如果則創建的項目直接運行閃退,可能是沒有自行生成 MainActivity和layout文件,自己創建即可。
二、使用代碼控制UI界面
你Java Swing那樣,所有的UI組件都可以通過new關鍵字創建出來,並添加到布局管理器中。
總體步驟:
- 創建布局管理器,並設置其屬性
- 創建具體的組件,並設置其布局和屬性
- 將上一步創建的組件添加到布局管理器中。
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("這是第\n" + i + "個組件\t\t");
textView[i].setTextColor(Color.rgb(7, 0, 0));
layout.addView(textView[i]);
}
}
}
3.3 啟動查看效果
四、創建自定義的View
在Android中,所有的UI界面都是由View類和ViewGroup類及其子類組成的。
其中View類是所有UI組件的基類,
ViewGroup類是容納這些UI組件的容器,其本身也是View類的子類。