android五種佈局-霓虹燈效果實現

[color=red][size=small][align=center]android五種佈局-霓虹燈效果實現[/align][/size][/color]

view子類是android用戶界面表示的基本單元
view類的一些子類被稱爲widges工具;它提供了文本框和按鈕類的UI對象的完整實現;
ViewGroup是view的一個擴展,可以容納多個view;,他可以創建由互相聯繫的view組成的符合控件
佈局:
FramelLayout-幀佈局;
LinearLaout--線性佈局;
TableLayout--表格佈局;
RealativeLayout--相對佈局;
Layout佈局文件的命名---(禁止用大寫字母來參與文件的命名)
一、 LinearLayout(線性佈局)
“LinearLayout”翻譯成中文是“線性佈局”,所謂線性佈局就是在該標籤下的所有子
元素會根據其orientation屬性的值來決定是按行或者是按列逐個顯示。
示例main.xml佈局文件如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >



<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/name_text" />


<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"

/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/ok_button"
/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/no_button"
/>

</LinearLayout>


二、 RelativeLayout(相對佈局)
相對佈局中的視圖組件是按相互之間的相對位置來確定的,並不是線性佈局中的必須
按行或按列單個顯示。示例佈局文件如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"

>


<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="@string/button_zh"
android:id="@+id/main"
/>


<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="@string/button_ys"
android:layout_above="@+id/main"
android:layout_toLeftOf="@+id/main"
/>

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="@string/button_yx"
android:layout_above="@+id/main"
android:layout_toRightOf="@+id/main"

/>


<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="@string/button_zs"
android:layout_below="@+id/main"
android:layout_toRightOf="@+id/main"

/>


<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="@string/button_zx"
android:layout_below="@+id/main"
android:layout_toLeftOf="@+id/main"

/>
</RelativeLayout>


三、 線性佈局與相對佈局嵌套使用
佈局之間可以相互嵌套使用,以完成更爲複雜的佈局效果。舉例來說,下面是一個線性佈局當中包含了相對佈局的界面:
<?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="vertical" >

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="70dp"
>

<TextView
android:id="@+id/name_nest"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text="@string/name_text" />

<EditText
android:layout_width="150dp"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:layout_toRightOf="@+id/name_nest" >

<requestFocus />
</EditText>
</RelativeLayout>

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="70dp"
>

<TextView
android:id="@+id/password_nest"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text="@string/password_text" />

<EditText
android:layout_width="150dp"
android:layout_height="30dp"
android:layout_toRightOf="@+id/password_nest" />
</RelativeLayout>

<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="120dp"
>

<Button
android:id="@+id/button_re"
android:layout_width="50dp"
android:layout_height="35dp"
android:text="@string/login" />

<Button
android:layout_width="50dp"
android:layout_height="35dp"
android:layout_marginLeft="30dp"
android:layout_toRightOf="@+id/button_re"
android:text="@string/register" />
</RelativeLayout>

</LinearLayout>


四、 表格佈局:
表格佈局的風格跟HTML中的表格比較接近,只是所採用的標籤不同。
<TableLayout>是頂級元素,說明採用的是表格佈局
<TableRow>定義一個行
<TextView>定義一個單元格的內容
示例佈局文件內容如下:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="*"
>

<TableRow>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/name"
/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/sex"

/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/age"

/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/weight"

/>

</TableRow>
<TableRow>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/nameh"
/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/sexh"

/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/ageh"

/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/weighth"

/>

</TableRow>
</TableLayout>




五、 FrameLayout幀佈局()
幀佈局中的每一個組件都代表一個畫面,默認以屏幕左上角作爲(0,0)座標,按組件 定義的先後順序依次逐屏顯示,後面出現的會覆蓋前面的畫面。用該佈局可以實現動畫效果。
接下來,我們用三幅圖片實現一隻小鳥飛翔的動畫效果。首先準備好三張連續的小鳥飛行圖片。
接着新建一個android project項目;
編寫main.xml文件:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:gravity="center" >

<TextView

android:id="@+id/view1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:width="210px"
android:height="50px"

/>
<TextView

android:id="@+id/view2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:width="180px"
android:height="50px"

/>
<TextView

android:id="@+id/view3"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:width="150px"
android:height="50px"

/>
<TextView

android:id="@+id/view4"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:width="120px"
android:height="50px"

/>
<TextView

android:id="@+id/view5"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:width="90px"
android:height="50px"

/>
<TextView

android:id="@+id/view6"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:width="60px"
android:height="50px"

/>
<TextView

android:id="@+id/view7"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:width="30px"
android:height="50px"

/>
</LinearLayout>

String.xml文件
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="color1">#330000</color>
<color name="color2">#550000</color>
<color name="color3">#770000</color>
<color name="color4">#990000</color>
<color name="color5">#bb0000</color>
<color name="color6">#dd0000</color>
<color name="color7">#ff0000</color>
</resources>

Activity.java文件:

package cn.haozi;

import java.util.Timer;
import java.util.TimerTask;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.widget.TextView;

public class NeoncolorActivity extends Activity {

public int currentColor = 0;

final int[] colorid = new int[] {

R.color.color7, R.color.color6, R.color.color5, R.color.color4,
R.color.color3, R.color.color2, R.color.color1,

};
final int[] names = new int[] {

R.id.view1, R.id.view2, R.id.view3, R.id.view4, R.id.view5, R.id.view6,
R.id.view7,

};

TextView[] textView = new TextView[7];

public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

for (int i = 0; i < 7; i++) {
textView[i] = (TextView) findViewById(names[i]);

}

/*
* Handler主要用於異步消息的處理:當發出一個消息之後,首先進入一個消息隊列,
* 發送消息的函數即刻返回,而另外一個部分逐個的在消息隊列中將消息取出,然後對消息進行出來, 就是發送消息和接收消息不是同步的處理
*/
final Handler handler = new Handler() {

// 發送信息
public void handleMessage(Message msg) {
// what:自定義的消息內容,可以爲一切數據類型,對象也包括的
if (msg.what == 01122) {
// 依次改變7個textView的顏色
for (int i = 0; i < 7 - currentColor; i++) {
textView[i].setBackgroundResource(colorid[i
+ currentColor]);

}

for (int i = 7 - currentColor, j = 0; i < 7; i++, j++) {
textView[i].setBackgroundResource(colorid[j]);

}

}

super.handleMessage(msg);

}

};
// 定義一個線程去改變currentColor的變量值

new Timer().schedule(new TimerTask() {

@Override
public void run() {
currentColor++;

if (currentColor >= 6) {
currentColor = 0;

}
// 發送一條消息通知系統改變背景顏色
Message m = new Message();
// 給消息定義一個標識
m.what = 01122;
handler.sendMessage(m);
}
}, 0, 100);
}
}


說明:
由於FrameLayout中後出現的UI控件會覆蓋前面出現的UI控件,每次只能顯示一個UI控
件,因此,我們可以通過在Activity中對每次顯示的圖片內容進行切換以實現動畫效果。或
許你會想到開啓一條線程來控制切換,但在非主線程中不能更新UI界面,所以,我們使用了
Android提供的消息通訊類Handler。該類可以實現非主線程和負責UI的主線程之間的通信,
進而間接實現非主線程更新UI界面。由於sleep方法中的
sendMessageDelayed(obtainMessage(0),delayMillis);本身會延遲發送一個消息,該消息
會被框架傳遞給handleMessage事件。我們在handleMessage()方法中再次調用sleep()方法,
形成一個循環調用。在我們對界面進行點擊之前,兩個方法會一直循環調用。前景圖片也會
不斷的切換,進而實現動畫的效果。

android 常用的距離單位;
[color=blue][/color]PX(像素):每個px對應屏幕上的一個點;
[color=blue]dip或dp(device independent pixels,設備獨立像素);[/color]一種基於屏幕密度的抽象單位。在每寸160點的顯示器上,1dip=1px。但是隨着屏幕密度的改變,dip於px的換算會發生改變。

[color=blue]sp(scaled pixels,比例像素):[/color]處理字體的大小,可以根據用戶的字體大小首選項進行縮放。

[color=blue]in(英寸) :[/color]標準的長度單位;

[color=blue]mm(毫米):[/color]標準的產度單位;

[color=cyan]pt(磅):[/color]標準長度的單位,1/72英寸
發佈了93 篇原創文章 · 獲贊 132 · 訪問量 21萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章