一、介绍
- 有时候我们在设计安卓用户面时,有种需求,一个控件会层叠在另一个控件上,此时用线性布局就无法实现,就得使用一个新的布局——帧式布局。
二、讲解
![](https://i-blog.csdnimg.cn/blog_migrate/c2afbac8699df29b1c19812501a2f798.png)
(一)帧式布局概述
1、布局特点
- 帧式布局是一种层叠式的布局,后添加的控件会层叠在先添加的控件上。
2、继承关系图
- FrameLayout类是ViewGroup的子类
3、常用属性
![](https://i-blog.csdnimg.cn/blog_migrate/4b5cea91f68627b8b998d9652d3cad83.png)
(二)案例演示:切换颜色
1、创建安卓应用
- 基于
Empty Activity
创建安卓应用 - SwitchColor
- 单击【Finish】按钮
2、主布局资源文件
- 主布局资源文件 -
activity_main.xml
3、字符串资源文件
<resources>
<string name="app_name">帧式布局:切换颜色</string>
<string name="top">顶层</string>
<string name="middle">中层</string>
<string name="bottom">底层</string>
<string name="switch_color">切换颜色</string>
</resources>
4、主界面实现功能
- 主界面类 -
MainActivity
- 定义变量
- 通过资源标识符获取控件实例
- 编写切换颜色单击事件处理方法
- 查看完整代码
package net.hw.switch_color;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
private TextView tvTop;
private TextView tvMiddle;
private TextView tvBottom;
private int clickCount; // 按钮单击次数
private int[] colors; // 颜色数组
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// 利用布局资源文件设置用户界面
setContentView(R.layout.activity_main);
// 通过资源标识符获取控件实例
tvTop = findViewById(R.id.tv_top);
tvMiddle = findViewById(R.id.tv_middle);
tvBottom = findViewById(R.id.tv_bottom);
}
/**
* 切换颜色单击事件处理方法
*
* @param view
*/
public void doSwitchColor(View view) {
// 累加按钮单击次数
clickCount++;
// 只有三种颜色切换,因此单击次数对3求余
clickCount = clickCount % 3;
// 根据单击次数确定颜色方案[底层,中层,顶层]
switch (clickCount) {
case 0: // 颜色方案:[红,绿,蓝]
colors = new int[] {Color.RED, Color.GREEN, Color.BLUE};
break;
case 1: // 颜色方案:[绿,蓝,红]
colors = new int[] {Color.GREEN, Color.BLUE, Color.RED};
break;
case 2: // 颜色方案;[蓝,红,绿]
colors = new int[] {Color.BLUE, Color.RED, Color.GREEN};
break;
}
// 根据颜色方案来设置三层标签背景色
tvBottom.setBackgroundColor(colors[0]);
tvMiddle.setBackgroundColor(colors[1]);
tvTop.setBackgroundColor(colors[2]);
}
}
5、启动应用,查看效果
6、优化切换颜色算法
- 采用左移算法切换颜色
- 启动应用,查看效果
- 当切换颜色比较多,这个算法还得优化,采用循环结构来切换颜色
- 查看优化后的代码
package net.hw.switch_color;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
public class MainActivity extends AppCompatActivity {
private TextView tvTop;
private TextView tvMiddle;
private TextView tvBottom;
private int[] colors; // 颜色数组
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// 利用布局资源文件设置用户界面
setContentView(R.layout.activity_main);
// 通过资源标识符获取控件实例
tvTop = findViewById(R.id.tv_top);
tvMiddle = findViewById(R.id.tv_middle);
tvBottom = findViewById(R.id.tv_bottom);
// 初始化颜色数组
colors = new int[] {Color.RED, Color.GREEN, Color.BLUE};
}
/**
* 切换颜色单击事件处理方法
*
* @param view
*/
public void doSwitchColor(View view) {
// 通过颜色数组切换颜色 [采用左移算法]
int temp = colors[0];
for (int i = 0; i < colors.length - 1; i++) {
colors[i] = colors[i + 1];
}
colors[colors.length - 1] = temp;
// 根据颜色方案来设置三层标签背景色
tvBottom.setBackgroundColor(colors[0]);
tvMiddle.setBackgroundColor(colors[1]);
tvTop.setBackgroundColor(colors[2]);
}
}