不停的切换颜色

一、第一步当然是要创建我们的项目,忽略!(如果初学请参照上一次内容)

1、我们今天要学习的式帧式布局,通过切换颜色案例来讲解,主要式要事项点击开始,三个文本框就不停的切换颜色,点击暂停就停止切换颜色,概念模糊以下图为参照理解:
不停的切换颜色

二界面设计

1、在xml文件中写入代码,实现三个不同大小的框重叠,添加开始和暂停按钮代码如下

<?xml version="1.0" encoding="utf-8"?>

<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/tvBottom"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_gravity="center"
        android:background="#ff0000"
        android:text="@string/bottom"
        android:textColor="#ffff00"
        android:textSize="30sp" />

    <TextView
        android:id="@+id/tvMiddle"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_gravity="center"
        android:background="#0000ff"
        android:text="@string/middle"
        android:textColor="#ffff00"
        android:textSize="30sp" />

    <TextView
        android:id="@+id/tvTop"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:background="#00ff00"
        android:text="@string/top"
        android:textColor="#ffff00"
        android:textSize="30sp" />
</FrameLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
    <Button
        android:id="@+id/btnStart"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:layout_marginRight="25dp"
        android:onClick="doSwitchColor"
        android:text="@string/start"
        android:textSize="20sp" />

    <Button
        android:id="@+id/btnPause"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:layout_marginLeft="25dp"
        android:onClick="doSwitchColor"
        android:text="@string/pause"
        android:textSize="20sp" />

</LinearLayout>

效果图不停的切换颜色
2、字符串文件
不停的切换颜色

三、实现功能(点击开始就循环切换颜色,暂停就停止切换颜色)

不停的切换颜色
附上代码:
package net.lbd.switchcolor;

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 tvBottom;
private TextView tvMiddle;
private TextView tvTop;
private int clickCount;
private int[] colors;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // 利用布局资源文件设置用户界面
    setContentView(R.layout.activity_main);
    // 通过资源标识获得控件实例
    tvBottom = findViewById(R.id.tvBottom);
    tvMiddle = findViewById(R.id.tvMiddle);
    tvTop = findViewById(R.id.tvTop);

// }
// /**
// * 切换颜色单击事件处理方法
// *
// * @param view
// */
// public void doSwitchColor(View view) {
// // 累加按钮单击次数
// clickCount++;
// // 单击次数对3求余
// clickCount = clickCount % 3;
// // 判断次数是0、1、2
// switch (clickCount) {
// case 0:
// // 红——蓝——绿
// colors = new int[]{Color.RED, Color.BLUE, Color.GREEN};
// break;
// case 1:
// // 蓝——绿——红
// colors = new int[]{Color.BLUE, Color.GREEN, Color.RED};
// break;
// case 2:
// // 绿——红——蓝
// colors = new int[]{Color.GREEN, Color.RED, Color.BLUE};
// break;
// }

    //修改颜色切换的算法
    // 初始化颜色数组
    colors = new int[] {Color.RED, Color.BLUE, Color.GREEN};
}

/**
 * 切换颜色单击事件处理方法
 *
 * @param view
 */
public void doSwitchColor(View view) {
    // 切换颜色
    int temp = colors[0];
    colors[0] = colors[1];
    colors[1] = colors[2];
    colors[2] = temp;
    // 设置三层标签的颜色
    tvBottom.setBackgroundColor(colors[0]);
    tvMiddle.setBackgroundColor(colors[1]);
    tvTop.setBackgroundColor(colors[2]);
}

}

四、总结

今天重点有俩个,第一是帧式布局,二十是我们上此 讲的事件处理,而且这次的事件处理和上次的也有所不同,虽然都同样的 原理但是用的东西是不一样的,这是布局的主要特点在于

上一篇:flutter设置沉浸式状态栏


下一篇:[Flutter Key]Key的学习笔记