[HarmonyOS]——组件&布局&事件概念明确及点击事件

概念明确

组件：屏幕展示出来的元素，都称之为组件

布局：多个组件的摆放方式就是布局，组件必须添加到布局中才能显示出来

事件：就是可以被组件识别的操作

 一、事件介绍

1、什么是事件

事件就是可以被组件识别的操作，也即：就是可以被文本、按钮、图片等组件识别的操作。

2、常见事件

 二、单击事件

单击事件又称点击事件，是开发中使用最多的一种事件，没有之一。

1、单击事件实现步骤

1. 通过id找到组件
2. 给按钮组件设置单击事件
3. 写一个类实现 ClickedListener 接口并重写onClick方法
4. 编写onClick方法体

2、ResourceTable解读

在查找对应的组件时，是使用ResourceTable类+对应组件id的方式找到对应对象。ResourceTable是项目的资源列表类，不需要人为的去定义，只要在Resource中Base下的layout中定义了对应的资源，在运行期间，build中就会生成对应的资源列表，详情如下：

3、单击事件的4种实现方法

下图列出了4种实现方式，但是在实际开发中，常用的有：（1）当前类作为实现类（2）方法引用

XML文件中定义了Button组件：

<?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">

    <Button
        ohos:id="$+id:but1"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:background_element="red"
        ohos:text_size="100"
        ohos:text="点击事件"
        />

</DirectionalLayout>

（1）法1：定义实现类方式

在实现类中，onClick方法中的参数component代表要操作的组件，为了能使用对应组建的方法，需要使用强制类型转换

package com.example.clickthings.slice;

import com.example.clickthings.ResourceTable;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.Button;
import ohos.agp.components.Component;

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

        //1、查找组件
        Button button = (Button)findComponentById(ResourceTable.Id_but1);

        //2、给按钮设置单击事件
        button.setClickedListener(new MyListener());

    }

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

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

class MyListener implements Component.ClickedListener {
    @Override
    public void onClick(Component component) {
        ((Button)component).setText("已经点击了");
    }
}

（2）法2：当前类作为实现类

public class MainAbilitySlice extends AbilitySlice implements Component.ClickedListener {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
        super.setUIContent(ResourceTable.Layout_ability_main);

        //1、查找组件
        Button button = (Button)findComponentById(ResourceTable.Id_but1);

        //2、给按钮设置单击事件
        button.setClickedListener(this);

    }

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

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

    @Override
    public void onClick(Component component) {
        ((Button)component).setText("已经点击了");
    }
}

（3）法3：匿名内部类

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

        //1、查找组件
        Button button = (Button)findComponentById(ResourceTable.Id_but1);

        //2、给按钮设置单击事件
        button.setClickedListener(new Component.ClickedListener() {
            @Override
            public void onClick(Component component) {
                ((Button)component).setText("已经点击了");
            }
        });

    }

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

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

（4）法4：方法引用

直接在对应的XXXAbilitySlice类中定义onClick()方法写点击需要进行的操作。

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

        //1、查找组件
        Button button = (Button)findComponentById(ResourceTable.Id_but1);

        //2、给按钮设置单击事件
        button.setClickedListener(this::onClick);

    }

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

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

    public void onClick(Component component) {
        ((Button)component).setText("已经点击了");
    }
}

笔记本人辛苦整理，转载复制望加文章出处，并推荐【Star星屹程序设计】，谢谢配合