【Android】使用FrameLayout布局实现霓虹灯效果
FrameLayout是五大布局中最简单的一个布局。
在这个布局中,整个界面被当成一块空白备用区域,所有的子元素都不能被指定放置的位置。
它们统统放于这块区域的左上角,并且后面的子元素直接覆盖在前面的子元素之上,将前面的子元素部分和全部遮挡。
显示效果如下,第一个TextView被第二个TextView完全遮挡,第三个TextView遮挡了第二个TextView的部分位置。
我们可以利用这个FrameLayout布局的特性实现一个简单的霓虹灯效果。
Activity代码
package com.app.test01; import android.app.Activity; import android.os.Bundle; import android.os.Handler; import android.view.View; public class FrameLayoutActivity extends Activity implements Runnable{ //定义5个颜色值 private int[] colors = new int[]{0xFFFF0000,0xFF0000FF,0xFF00FFFF,0xFFFF00FF,0xFF00FF00}; //每一个颜色值的索引 private int[] nextColorPoints = new int[]{1,2,3,4,0}; //当前值的索引 private int currentColorPoint = 0; private View[] views; private Handler handler; @Override protected void onCreate(Bundle savedInstanceState) { // TODO Auto-generated method stub super.onCreate(savedInstanceState); setContentView(R.layout.activity_frame); views = new View[]{findViewById(R.id.textView5),findViewById(R.id.textView4), findViewById(R.id.textView3),findViewById(R.id.textView2),findViewById(R.id.textView1)}; handler = new Handler(); handler.postDelayed(this, 300); } @Override public void run() { // TODO Auto-generated method stub int nextColorPoint = currentColorPoint; for (int i = views.length-1; i>=0; i--) { views[i].setBackgroundColor(colors[nextColorPoint]); nextColorPoint = nextColorPoints[nextColorPoint]; } currentColorPoint++; if (currentColorPoint == 5) { currentColorPoint = 0; } handler.postDelayed(this, 300); } }
布局文件
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:andro android:layout_width="match_parent" android:layout_height="match_parent" > <TextView android: android:layout_width="300dp" android:layout_height="300dp" android:text="TextView" android:layout_gravity="center"/> <TextView android: android:layout_width="240dp" android:layout_height="240dp" android:text="TextView" android:layout_gravity="center"/> <TextView android: android:layout_width="180dp" android:layout_height="180dp" android:text="TextView" android:layout_gravity="center"/> <TextView android: android:layout_width="120dp" android:layout_height="120dp" android:text="TextView" android:layout_gravity="center"/> <TextView android: android:layout_width="60dp" android:layout_height="60dp" android:text="TextView" android:layout_gravity="center"/> </FrameLayout>