HarmonyOS实战——TickTimer定时器组件基本使用

2021年09月15日 阅读数:6
这篇文章主要向大家介绍HarmonyOS实战——TickTimer定时器组件基本使用,主要内容包括基础应用、实用技巧、原理机制等方面,希望对大家有所帮助。

1. TickTimer定时器组件说明:

  • 是Text的子类,因此可使用Text的一些属性
  • 该组件目前有一些bug,后续版本中会修复这些bug的

常见属性:html

属性名 功能说明
format 设置显示的格式
count_down true倒着计时,false正着计时

常见方法:
在这里插入图片描述
基本用法:java

  1. xml文件:
<TickTimer
	ohos:id="$+id:my_tt"
	ohos:height="60vp"
	ohos:width="250vp"
	ohos:padding="10vp"
	ohos:text_size="20fp"
	ohos:text_color="#ffffff"
	ohos:background_element="#0000ff"
	ohos:text_alignment="center"
	ohos:layout_alignment="horizontal_center"
	ohos:top_margin="50vp" />
	//没有设置时间,默认是从1970年1月1日开始。

  • mm:ss 分别表示分钟和秒钟
    在这里插入图片描述

2. 实现案例——计时器

  • 统计一段时间之类作了多少事情,这个时候就须要计时器了app

  • 在定时器下面分别添加开始和结束计时的两个按钮
    在这里插入图片描述ide

  • 新建项目:TickTimerApplication布局

ability_mainthis

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:alignment="center"
    ohos:orientation="vertical">

    <TickTimer
        ohos:id="$+id:ticktimer"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:text_size="30fp"
        ohos:text_color="#FFFFFF"
        ohos:background_element="#0000FF"
        ohos:text_alignment="center"
        ohos:layout_alignment="center"
        />

    <Button
        ohos:id="$+id:start"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:text="开始"
        ohos:text_size="30fp"
        ohos:text_color="#FFFFFF"
        ohos:background_element="#666600"
        ohos:text_alignment="center"
        ohos:layout_alignment="center"
        ohos:top_margin="30vp"
        />

    <Button
        ohos:id="$+id:end"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:text="结束"
        ohos:text_size="30fp"
        ohos:text_color="#FFFFFF"
        ohos:background_element="#666600"
        ohos:text_alignment="center"
        ohos:layout_alignment="center"
        ohos:top_margin="30vp"
        />

</DirectionalLayout>

  • ohos:text_alignment="center":表示的是文本相对于组件是居中的
  • ohos:layout_alignment="center":表示的是TickTimer组件在布局里面是居中的

MainAbilitySlice.net

package com.xdr630.ticktimerapplication.slice;

import com.xdr630.ticktimerapplication.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.Button;
import ohos.agp.components.Component;
import ohos.agp.components.TickTimer;

public class MainAbilitySlice extends AbilitySlice implements Component.ClickedListener {

    TickTimer tickTimer;
    Button start;
    Button end;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);

        //1.找到定时器组件
        tickTimer = (TickTimer) findComponentById(ResourceTable.Id_ticktimer);
        //找到开始和结束两个按钮组件
        start = (Button) findComponentById(ResourceTable.Id_start);
        end = (Button) findComponentById(ResourceTable.Id_end);

        //2.给开始和结束按钮绑定单击事件
        start.setClickedListener(this);
        end.setClickedListener(this);

        //3.给定时器作一些基本设置
        //false:正向计时 0 1 2 3 4 ...
        //true:反向计时 10 9 8 7 6 ...
        tickTimer.setCountDown(false);

        //设置一下计时的格式
        tickTimer.setFormat("mm:ss ");
    }

    @Override
    public void onActive() {
        super.onActive();
    }

    @Override
    public void onForeground(Intent intent) {
        super.onForeground(intent);
    }

    @Override
    //参数表示点击的按钮对象
    public void onClick(Component component) {
        if (component == start){
            //开启定时
            tickTimer.start();
        }else if (component == end){
            //结束计时
            tickTimer.stop();
        }
    }
}
  • 运行:
    在这里插入图片描述code

  • 点击“开始”按钮
    在这里插入图片描述component

  • 点击“结束”按钮后就中止计时了orm

3. TickTimer组件——bug汇总:

  1. 不要用 setBaseTimer 去设置基准时间
  2. 中止以后不用从新开始
  • 若是没有设置基准时间,把时间格式设置以下,就会看到是从何时开始计时的了
    在这里插入图片描述
  • 运行,发现是从时间原点开始
    在这里插入图片描述
  • 因此,若是没有设置基准时间,默认是从时间原点开始计时的
  • 若是设置了基准时间,参数为 0
    在这里插入图片描述
  • 运行:
    在这里插入图片描述
  • 点击“开始”按钮后,瞬间变成了当前的时间开始计时
    在这里插入图片描述
  • 因此,若是设置了基准时间,参数为 0,是从当前时间开始计时的
  • 若是设置了基准时间,参数为非 0 ,具体数值:3600*1000(表示一小时的毫秒值)
    在这里插入图片描述
  • 运行,点击“开始”按钮后,并无对当前时间作一个增长,反而对当前时间作一个减小
    在这里插入图片描述
    在这里插入图片描述
  • 因此,若是设置了基准时间,参数为非 0,也是从当前时间开始计时的,而且还会减小对应增长的时间,说明有 bug

总结:

  • 若是没有设置基准时间,默认是从时间原点开始计时的

  • 若是设置基准时间,参数为0,是从当前时间开始计时的

  • 若是设置基准时间,参数为非0,也是从当前时间开始计时的

  • 因此,tickTimer.setBaseTime(); 这个方法是有 bug 的,暂时不要用这个方法,相信之后HarmonyOS在更新的时候会修复这个 bug

  • 还有一个 bug,把时间格式设置为分秒计时
    在这里插入图片描述

  • 运行后,它不是从 0 秒开始计时的,而是从运行开始项目后就开始了,当你点击“开始”按钮后,就会发现已经开始计时了,按下结束再开始,也不是从刚刚暂停的时间再开始计时的,而是一直日后面计时
    请添加图片描述

  • 虽然点击告终束,在这个APP界面当中时间再也不跳动,可是在系统的底层,时间并无中止

建议:

  1. 该组件目前仍是有 bug 的
  2. 计时器一旦点击结束以后,就不要从新开始再计时了,也就是说每一个计时器只用一次就好了

4. TickTimer定时器案例——统计10秒内按钮点击的次数

  • 使用定时器统计10秒以内按了多少次?

需求:

  • 最上面是TickTimer定时器,中间的是文本显示次数,下面是“开始计时”按钮,当点击了这个按钮以后,按钮上面的文字就会变成“请疯狂点我”,而后就不断的点击这个按钮,点击一次,上面显示的文本就会增长一次计数,此时,定时器也会不断走动的状态,当到达10秒钟以后,“请疯狂点我”按钮里面的文字就会显示“游戏结束了”,中间的按钮就会展现我在 10秒以内一共点击了多少按钮次数
    在这里插入图片描述

  • 新建项目:TickTimerPracticeApplication

ability_main

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:alignment="center"
    ohos:orientation="vertical">

    <TickTimer
        ohos:id="$+id:ticktimer"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:text_size="30fp"
        ohos:text_color="#FFFFFF"
        ohos:background_element="#0000FF"
        ohos:text_alignment="center"
        ohos:layout_alignment="center"
        />

    <Text
        ohos:id="$+id:count"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:top_margin="10vp"
        ohos:text="0次"
        ohos:text_size="30fp"
        />

    <Button
        ohos:id="$+id:but"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:top_margin="10vp"
        ohos:text_size="30fp"
        ohos:text="开始计时"
        ohos:background_element="#FF0000"
        />



</DirectionalLayout>

  • 定时器的格式:00:01 ,能够用 ticktimer.setText(); 获取到定时器如今的时间,不过如今是字符串的表示,如:“00:01”,因此还须要把它变为毫秒值
  • 添加一个方法进行转换
    在这里插入图片描述
    在这里插入图片描述

MainAbilitySlice

package com.xdr630.ticktimerpracticeapplication.slice;

import com.xdr630.ticktimerpracticeapplication.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.Button;
import ohos.agp.components.Component;
import ohos.agp.components.Text;
import ohos.agp.components.TickTimer;

import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.Date;

public class MainAbilitySlice extends AbilitySlice implements Component.ClickedListener, TickTimer.TickListener {

        TickTimer ticktimer;
        Text text;
        Button but;

    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);

        //1.找到三个组件对象
        ticktimer = (TickTimer) findComponentById(ResourceTable.Id_ticktimer);
        text = (Text) findComponentById(ResourceTable.Id_count);
        but = (Button) findComponentById(ResourceTable.Id_but);

        //2.给按钮绑定单击事件
        but.setClickedListener(this);

        //3.给定时器作一些基本设置
        //false:正向计时 1 2 3 4 ...
        //true:反向计时 10 9 8 7 ...
        ticktimer.setCountDown(false);

        //设置计时格式
        ticktimer.setFormat("mm:ss");

        //4.给定时器绑定定时事件
        ticktimer.setTickListener(this);
    }

    @Override
    public void onActive() {
        super.onActive();
    }

    @Override
    public void onForeground(Intent intent) {
        super.onForeground(intent);
    }


    //判断是不是第一次被点击
    //true:表示第一次被点击
    //false,表示不是第一次被点击
    boolean first = true;

    //定义一个变量用了统计点击的次数
    int count = 0;

    //记录游戏开始的时间
    long startTime = 0;

    @Override
    public void onClick(Component component) {
        //当该方法被调用,证实按钮被点击了一次
        count++;

        //判断当前是不是第一次被点击
        if (first){
            //第一次点击了
            //记录游戏开始的时间
            //要获取定时器如今的时间
            //ticktimer.getText();//”00:01“
            startTime = StringToLong(ticktimer.getText());
            //修改按钮里面的文本内容
            but.setText("请疯狂点我");
            //修改标记
            first = false;
            //开启定时器
            ticktimer.start();
        }
        //若是不是第一次点击
        //那么就不须要作上面的事情,直接修改文本的内容就能够了
        text.setText(count + "次");
    }

    //当定时器开始计时的时候,就会不断去调用onTickTimerUpdate这个方法
    //tickTimer表示计时器的对象
    @Override
    public void onTickTimerUpdate(TickTimer tickTimer) {
        //1.获取当前定时器的时间,并把时间变为毫秒值
        long nowTime = StringToLong(tickTimer.getText());
        //2.判断nowTime跟startTime之间的差有没有超过10秒
        if ((nowTime - startTime) >= 10000){
            tickTimer.stop();
            text.setText("最终成绩为:" + count + "次");
            but.setText("游戏结束了");
            //取消按钮的点击事件
            but.setClickable(false);
        }
    }

    //做用:把字符串类型的时间变成毫秒值(long)
    public long StringToLong(String time) {
        SimpleDateFormat sdf = new SimpleDateFormat("mm:ss");
        Date  date = null;
        try {
            date = sdf.parse(time);
        } catch (ParseException e) {
            e.printStackTrace();
        }
        long result = date.getTime();
        return result;
    }
}

  • 运行:
    请添加图片描述