HarmonyOS ListContainer 图文并排
作者：互联网
1.两个工具类：DateUtils + HttpHelper
2.两个依赖包：okhttp3 + gson
3.装载图片类：Picasso，本地+调试模式，都不能访问本地的网络，运行需要注释装载图片，因为是华为虚拟机
解决方式：内网穿透技术 ，比如：Ngrok ，教程：2021最新HarmonyOS鸿蒙2.0系统应用开发|基础入门教程到实战—更新中…_哔哩哔哩_bilibili
implementation 'com.squareup.okhttp3:okhttp:3.10.0'
compile 'com.google.code.gson:gson:2.6.2'
implementation 'io.openharmony.tpc.thirdlib:picasso:1.0.4'
package com.example.demo1.utils;
import java.text.SimpleDateFormat;
import java.util.Date;
public class DateUtils {
public static String format(long l) {
Date date = new Date(l);
String format = new SimpleDateFormat("yyyy-MM-dd").format(date);
return format;
}
}
package com.example.demo1.utils;
import okhttp3.Call;
import okhttp3.Callback;
import okhttp3.OkHttpClient;
import okhttp3.Request;
public class HttpHelper {
public static HttpHelper instance;
OkHttpClient okHttpClient;
public HttpHelper() {
okHttpClient = new OkHttpClient().newBuilder().build();
}
public static HttpHelper getInstance() {
if (instance == null) {
synchronized (HttpHelper.class) {
if (instance == null) {
instance = new HttpHelper();
}
}
}
return instance;
}
public void doGet(String url, Callback callback) {
Request request = new Request.Builder().url(url).build();
Call call = okHttpClient.newCall(request);
call.enqueue(callback);
}
}
package com.example.demo1.data;
import com.example.demo1.ResourceTable;
import com.example.demo1.utils.DateUtils;
import com.squareup.picasso.Picasso;
import ohos.aafwk.ability.AbilitySlice;
import ohos.agp.components.*;
import ohos.global.resource.Resource;
import ohos.hiviewdfx.HiLog;
import ohos.hiviewdfx.HiLogLabel;
import java.util.List;
public class MovieProvider extends BaseItemProvider {
public final HiLogLabel hiLogLabel = new HiLogLabel(HiLog.LOG_APP, 0x00201, "MovieProvider");
List<Movie> list;
AbilitySlice slice;
public MovieProvider(List<Movie> list, AbilitySlice slice) {
this.list = list;
this.slice = slice;
}
@Override
public int getCount() {
return list != null ? list.size() : 0;
}
@Override
public Object getItem(int i) {
if (list != null && i >= 0 && i < list.size()) {
return list.get(i);
}
return null;
}
@Override
public long getItemId(int i) {
return i;
}
@Override
public Component getComponent(int i, Component component, ComponentContainer componentContainer) {
final Component cpt;
HiLog.debug(hiLogLabel, "getComponent" + i);
if (component == null) {
cpt = LayoutScatter.getInstance(slice)
.parse(ResourceTable.Layout_MovieListItem, null, false);
} else {
cpt = component;
}
Text publishTime = (Text) cpt.findComponentById(ResourceTable.Id_text_publishTime);
Text shortTitle = (Text) cpt.findComponentById(ResourceTable.Id_text_shortTitle);
Text vt = (Text) cpt.findComponentById(ResourceTable.Id_text_vt);
Image vpic = (Image) cpt.findComponentById(ResourceTable.Id_vpic);
publishTime.setText(DateUtils.format(list.get(i).getPublishTime()));
shortTitle.setText(list.get(i).getShortTitle());
vt.setText(list.get(i).getVpic());
//加载图片-------------
// Picasso.get().load(list.get(i).getVpic())
// .placeholder(ResourceTable.Media_icon)
// .resize(100, 100)
// .into(vpic);
return cpt;
}
}
package com.example.demo1.slice;
import com.example.demo1.ResourceTable;
import com.example.demo1.data.Movie;
import com.example.demo1.data.MovieProvider;
import com.example.demo1.utils.HttpHelper;
import com.google.gson.Gson;
import com.google.gson.reflect.TypeToken;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.ListContainer;
import ohos.hiviewdfx.HiLog;
import ohos.hiviewdfx.HiLogLabel;
import ohos.media.photokit.metadata.AVStorage;
import okhttp3.Call;
import okhttp3.Callback;
import okhttp3.Response;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
public class MovieListContainerSlice extends AbilitySlice {
public final HiLogLabel hiLogLabel = new HiLogLabel(HiLog.LOG_APP, 0x00201, "MovieListContainerSlice");
String url = "http://127.0.0.1:5002/videos";
@Override
public void onStart(Intent intent) {
super.onStart(intent);
super.setUIContent(ResourceTable.Layout_MovieListContainer);
initView();//查询数据
}
private void initView() {
ListContainer listContainer = (ListContainer) findComponentById(ResourceTable.Id_movieListContainer);
HttpHelper.getInstance().doGet(url, new Callback() {
@Override
public void onFailure(Call call, IOException e) {
HiLog.debug(hiLogLabel, "onFailure");
HiLog.debug(hiLogLabel, new Gson().toJson(e));
}
@Override
public void onResponse(Call call, Response response) throws IOException {
String str = response.body().string();
List<Movie> list = new Gson().fromJson(str, new TypeToken<List<Movie>>() {
}.getType());
HiLog.debug(hiLogLabel, "onResponse：size：" + list.size());
MovieProvider movieProvider = new MovieProvider(list, MovieListContainerSlice.this);
//更新ui
getUITaskDispatcher().asyncDispatch(new Runnable() {
@Override
public void run() {
listContainer.setItemProvider(movieProvider);
movieProvider.notifyDataChanged();
}
});
}
});
}
@Override
public void onActive() {
super.onActive();
}
@Override
public void onForeground(Intent intent) {
super.onForeground(intent);
}
}
<?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">
<ListContainer
ohos:id="$+id:movieListContainer"
ohos:height="match_parent"
ohos:width="match_parent">
</ListContainer>
</DirectionalLayout>
<?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:left_padding="20vp"
ohos:orientation="vertical"
ohos:top_padding="20vp">
<Image
ohos:id="$+id:vpic"
ohos:height="match_content"
ohos:width="match_content"
ohos:image_src="$media:icon"></Image>
<DirectionalLayout
ohos:height="match_content"
ohos:width="match_content"
ohos:alignment="center"
ohos:orientation="horizontal"
ohos:top_margin="20vp">
<Text
ohos:height="match_content"
ohos:width="match_content"
ohos:text="电影标题："
ohos:text_size="15vp"
/>
<Text
ohos:id="$+id:text_shortTitle"
ohos:height="match_content"
ohos:width="match_content"
ohos:hint="海贼王"
ohos:hint_color="red"
ohos:left_margin="10vp"
ohos:text_size="15vp"
/>
</DirectionalLayout>
<DirectionalLayout
ohos:height="match_content"
ohos:width="match_content"
ohos:alignment="center"
ohos:orientation="horizontal"
ohos:top_margin="20vp">
<Text
ohos:height="match_content"
ohos:width="match_content"
ohos:text="发布时间："
ohos:text_size="15vp"
/>
<Text
ohos:id="$+id:text_publishTime"
ohos:height="match_content"
ohos:width="match_content"
ohos:hint="11-25"
ohos:hint_color="red"
ohos:left_margin="10vp"
ohos:text_size="15vp"
/>
</DirectionalLayout>
<DirectionalLayout
ohos:height="match_content"
ohos:width="match_content"
ohos:alignment="center"
ohos:orientation="horizontal"
ohos:top_margin="20vp">
<Text
ohos:height="match_content"
ohos:width="match_content"
ohos:text="发布简介："
ohos:text_size="15vp"
/>
<Text
ohos:id="$+id:text_vt"
ohos:height="match_content"
ohos:width="match_content"
ohos:hint="阴谋暴力！海贼管家克洛船长"
ohos:hint_color="red"
ohos:left_margin="10vp"
ohos:text_size="15vp"
/>
</DirectionalLayout>
<Component
ohos:height="1vp"
ohos:width="match_parent"
ohos:background_element="gray"></Component>
</DirectionalLayout>
标签：ListContainer,ohos,list,HarmonyOS,new,import,com,public,图文 来源： https://www.cnblogs.com/ligenyun/p/15610564.html