幀布局(FrameLayout)之跑馬燈，framelayout跑馬燈

幀布局(FrameLayout)之跑馬燈，framelayout跑馬燈

各位看客，今天主要學習的是，布局之幀布局FrameLayout。

這玩意從何而來：FrameLayout  直接繼承至 ViewGroup組件。

它的子項目該受啥控制：它的子項目受FrameLayout.LayoutParams 控制。沒錯，受它控制呢，咱們就可以設定 android.layout_gravity 屬性 (相對於父容器的對齊設定)

它的特點：它為每個加入的組件都建立一個空白地區(一幀)，將組件一個個的疊加在一起，疊加順序是 最後的組件顯示在最上層。

基本概念就是這麼個情況！直接完成跑馬燈樣本

建立項目不多說。

1.準備顏色資源

在 res/values 檔案夾下 建立  一個 color.xml  顏色資源檔

<?xml version="1.0" encoding="utf-8" ?><resources> <color name="l_fl_c_c1">#27AF7D</color> <color name="l_fl_c_c2">#AF2777</color> <color name="l_fl_c_c3">#B1981A</color> <color name="l_fl_c_c4">#9B15D4</color> <color name="l_fl_c_c5">#13A8AA</color> <color name="l_fl_c_c6">#B89009</color></resources>View Code

 

2.建立布局檔案 activity_frame_layout.xml

<?xml version="1.0" encoding="utf-8" ?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#000000"> <TextView android:id="@+id/l_fl_txtv0" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="top|center" android:textColor="#fff" android:text="輪換顏色值測試"/> <TextView android:id="@+id/l_fl_txtv1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="320dp" android:height="320dp" android:layout_gravity="center" android:background="@color/l_fl_c_c1"/> <TextView android:id="@+id/l_fl_txtv2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="280dp" android:height="280dp" android:layout_gravity="center" android:background="@color/l_fl_c_c2"/> <TextView android:id="@+id/l_fl_txtv3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="240dp" android:height="240dp" android:layout_gravity="center" android:background="@color/l_fl_c_c3"/> <TextView android:id="@+id/l_fl_txtv4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="200dp" android:height="200dp" android:layout_gravity="center" android:background="@color/l_fl_c_c4"/> <TextView android:id="@+id/l_fl_txtv5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="160dp" android:height="160dp" android:layout_gravity="center" android:background="@color/l_fl_c_c5"/> <TextView android:id="@+id/l_fl_txtv6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="120dp" android:height="120dp" android:layout_gravity="center" android:background="@color/l_fl_c_c6"/> </FrameLayout>View Code

 

 

3. 後台代碼實現

import java.util.Timer;import java.util.TimerTask;import android.os.Bundle;import android.os.Handler;import android.os.Message;import android.app.Activity;import android.view.Menu;import android.widget.TextView;public class FrameLayoutActivity extends Activity { private int currentColor=0; //顏色資源 final int[] colors=new int[]{ R.color.l_fl_c_c1, R.color.l_fl_c_c2, R.color.l_fl_c_c3, R.color.l_fl_c_c4, R.color.l_fl_c_c5, R.color.l_fl_c_c6}; //控制項ID數組 final int[] txtvIds=new int[]{ R.id.l_fl_txtv1, R.id.l_fl_txtv2, R.id.l_fl_txtv3, R.id.l_fl_txtv4, R.id.l_fl_txtv5, R.id.l_fl_txtv6}; TextView[] txtvs=new TextView[txtvIds.length]; Handler handler=new Handler(){ @Override public void handleMessage(Message msg) { // TODO Auto-generated method stub String mes="輪換顏色值測試（組件ID--顏色值） // "; if(msg.what==200){ for(int i=0;i<txtvIds.length;i++){ txtvs[i].setBackgroundResource(colors[(i+currentColor) % txtvIds.length]); mes+=txtvs[i].getId()+"--"+colors[(i+currentColor) % txtvIds.length]+"//"; } TextView t1= (TextView)findViewById(R.id.l_fl_txtv0); t1.setText(mes); currentColor++; } super.handleMessage(msg); } }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_frame_layout); for(int i=0;i<txtvIds.length;i++){ txtvs[i]=(TextView)findViewById(txtvIds[i]); } //定義一個線程周期 改變currentColor值 new Timer().schedule(new TimerTask() { @Override public void run() { handler.sendEmptyMessage(200); } },0,250); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.frame_layout, menu); return true; }}View Code

註： 這裡為什麼不直接在run()  方法中實現輪換顏色的代碼，因為安卓中 View 和 Ui組件  不是安全執行緒的，規定不允許啟動線程來訪問使用者介面的UI組件。

 

以上就是跑馬燈樣本的實現，大夥可以 去調整 幾個 textview  組件 的  android.layout_gravity 或 layout_margin 等影響布局的屬性，看會發生什麼變化，又會有哪些不變化。

我自己調試出的結果是：不管布局位置怎麼變化，組件顯示的方式都是 後面的組件顯示在最上層。

 

 ^_^  各位看客，如果本文對你有些許協助的話，那就掃一下吧!  ^_^