HarmonyOS开发44:ListContainer实现微信主界面

首先修改 itemview.xml:

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


    <Image
        ohos:id="$+id:img"
        ohos:height="match_content"
        ohos:width="match_content"/>

    <DirectionalLayout
        ohos:height="50vp"
        ohos:width="240vp"
        ohos:left_margin="10vp"
        ohos:orientation="vertical">

        <Text
            ohos:id="$+id:title"
            ohos:height="20vp"
            ohos:width="240vp"
            ohos:text="标题"
            ohos:text_size="20fp"
            ohos:top_margin="5vp"
            />

        <Text
            ohos:id="$+id:msg"
            ohos:height="15vp"
            ohos:width="240vp"
            ohos:text="消息"
            ohos:text_size="15fp"
            ohos:top_margin="5vp"
            />
    </DirectionalLayout>

    <Text
        ohos:id="$+id:time"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:text="00:00"
        ohos:text_size="20fp"/>

</DirectionalLayout>

再修改domain中的Item.java

package com.example.listcontainerapplication2.domain;

public class Item {
          
   
    private int img;
    private String title;
    private String message;
    private String time;

    public Item() {
          
   
    }

    public Item(int img, String title, String message, String time) {
          
   
        this.img = img;
        this.title = title;
        this.message = message;
        this.time = time;
    }

    public int getImg() {
          
   
        return img;
    }

    public void setImg(int img) {
          
   
        this.img = img;
    }

    public String getTitle() {
          
   
        return title;
    }

    public void setTitle(String title) {
          
   
        this.title = title;
    }

    public String getMessage() {
          
   
        return message;
    }

    public void setMessage(String message) {
          
   
        this.message = message;
    }

    public String getTime() {
          
   
        return time;
    }

    public void setTime(String time) {
          
   
        this.time = time;
    }
}

同时将以前用到的加到代码当中

修改MainAbilitySlice.java

//以后这些数据并不是在app中写的,而是服务器中传进来的
    public ArrayList<Item> getData() {
          
   
        //应该:访问服务器,获取要展示的数据
        ArrayList<Item> list = new ArrayList<>();
        //给集合添加数据
        for (int i = 0; i < 100; i++) {
          
   
            list.add(new Item(ResourceTable.Media_photo, "标题", "item" + i, "00:00"));
        }
        return list;
    }

最后来修改一下ItemProvider.java

package com.example.listcontainerapplication2.provider;

import com.example.listcontainerapplication2.ResourceTable;
import com.example.listcontainerapplication2.domain.Item;
import com.example.listcontainerapplication2.utils.ToastUtils;
import ohos.aafwk.ability.AbilitySlice;
import ohos.agp.components.*;

import java.util.ArrayList;

public class ItemProvider extends BaseItemProvider implements Component.ClickedListener, Component.LongClickedListener {
          
   

    private ArrayList<Item> list = new ArrayList<>();
    private AbilitySlice abilitySlice;

    public ItemProvider(ArrayList<Item> list, AbilitySlice abilitySlice) {
          
   
        this.list = list;
        this.abilitySlice = abilitySlice;
    }

    @Override
    public int getCount() {
          
   
        if (list == null) {
          
   
            return 0;
        }
        return list.size();
    }

    @Override
    public Object getItem(int i) {
          
   
        if (list == null) {
          
   
            return null;
        }
        return list.get(i);
    }

    @Override
    public long getItemId(int i) {
          
   
        return i;
    }

    @Override
    public Component getComponent(int i, Component component, ComponentContainer componentContainer) {
          
   

        if (component == null) {
          
   
            component = LayoutScatter.getInstance(abilitySlice).parse(ResourceTable.Layout_itemview, null, false);
        }

        DirectionalLayout dl = (DirectionalLayout) component;

        dl.setClickedListener(this);
        dl.setLongClickedListener(this);

        Item item = list.get(i);
        Image img = (Image) dl.findComponentById(ResourceTable.Id_img);
        Text title = (Text) dl.findComponentById(ResourceTable.Id_title);
        Text msg = (Text) dl.findComponentById(ResourceTable.Id_msg);
        Text time = (Text) dl.findComponentById(ResourceTable.Id_time);

        img.setImageAndDecodeBounds(item.getImg());
        title.setText(item.getTitle());
        msg.setText(item.getMessage());
        time.setText(item.getTime());

        return dl;
    }

    @Override
    public void onClick(Component component) {
          
   
        ToastUtils.showDialog(abilitySlice, "跳转聊天界面");
    }

    @Override
    public void onLongClicked(Component component) {
          
   
        ToastUtils.showDialog(abilitySlice, "显示设置弹框");
    }
}

实现效果:

经验分享 程序员 微信小程序 职场和发展