HarmonyOS常用组件和布局

简介

我们把内容呈现在手机屏幕上给用户进行观看的时候，内容的组成就是由一个个的布局和组价元素组成的，所以这里了解一下HarmonyOS开发中常用的组件和布局。

组件

我们把显示在手机或者其他设备上可供用户观看或者操作的元素称之为组件，在harmonyOS中组件的对应对象是 Component，作用是提供内容显示或操作，是界面中所有组件的基类，开发者可以给Component设置事件处理回调（比如点击事件、手势事件）来创建一个可交互的组件。

更多组件内容可以查阅官方文档：常用组件开发指导

一些和Android差别不大的组件，比如Text Image CheckBox RadioButton Switch Scrollview等组件这里就不做过多的介绍了，针对一些和Android差别较大的组件进行介绍。

ListContainer

ListContainer是用来呈现连续、多行数据的组件，包含一系列相同类型的列表项。有些类似于Android里面的ListView，这里就介绍一下数据ListContainer的使用过程，更多的ListContainer自行查阅官方文档进行操作。

• 布局文件添加ListContainer组件

<?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:orientation="vertical">
    <ListContainer
        ohos:id="$+id:data_list"
        ohos:height="match_parent"
        ohos:width="match_parent"
        ohos:layout_alignment="horizontal_center"/>
</DirectionalLayout>

• 编写数据源

private ArrayList<SampleItemEntity> getData(){
   
        ArrayList<SampleItemEntity> initList = new ArrayList<>();
        initList.add(new SampleItemEntity("张三","法外狂徒张三"));
        initList.add(new SampleItemEntity("李四","默罕默德李四"));
        initList.add(new SampleItemEntity("王五","辣鸡米德王五"));
        initList.add(new SampleItemEntity("赵四","尼古拉斯赵四"));
        initList.add(new SampleItemEntity("刘能","默罕默德刘能"));
        return initList;
    }

• 编写Provider，继承至BaseItemProvider

package com.example.demo1.provider;

import com.example.demo1.ResourceTable;
import com.example.demo1.entity.SampleItemEntity;
import ohos.aafwk.ability.AbilitySlice;
import ohos.agp.components.*;

import java.util.List;

public class SampleItemProvider extends BaseItemProvider {
   

    private List<SampleItemEntity> dataList;
    private AbilitySlice abilitySlice;

    public SampleItemProvider(List<SampleItemEntity> dataList, AbilitySlice abilitySlice) {
   
        this.dataList = dataList;
        this.abilitySlice = abilitySlice;
    }

    @Override
    public int getCount() {
   
        return dataList == null ? 0 : dataList.size();
    }

    @Override
    public Object getItem(int i) {
   
        if (dataList != null && i >= 0 && i< dataList.size())
            return dataList.get(i);