ImageKnife/entry/src/main/ets/pages/testManyNetImageLoadWithPag...

108 lines
3.8 KiB
Plaintext

/*
* Copyright (C) 2023 Huawei Device Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { ScaleType, ImageKnifeComponent } from "@ohos/libraryimageknife"
class CommonDataSource <T> implements IDataSource {
private dataArray: T[] = []
private listeners: DataChangeListener[] = []
constructor(element: []) {
this.dataArray = element
}
public getData(index: number) {
return this.dataArray[index]
}
public totalCount(): number {
return this.dataArray.length
}
public addData(index: number, data: T[]): void {
this.dataArray = this.dataArray.concat(data)
this.notifyDataAdd(index)
}
unregisterDataChangeListener(listener: DataChangeListener): void {
const pos = this.listeners.indexOf(listener);
if (pos >= 0) {
this.listeners.splice(pos, 1);
}
}
registerDataChangeListener(listener: DataChangeListener): void {
if (this.listeners.indexOf(listener) < 0) {
this.listeners.push(listener)
}
}
notifyDataAdd(index: number): void {
this.listeners.forEach((listener: DataChangeListener) => {
listener.onDataAdd(index)
})
}
}
@Entry
@Component
struct TestManyNetImageLoadWithPage {
@State hotCommendList:CommonDataSource<string> = new CommonDataSource<string>([])
private data:Array<string> = [
'http://s.yingshidq.com.cn/cover/longbms/2023/08/11/2159934215_1248_702.jpeg',
'http://s.yingshidq.com.cn/imags/poster/2022/08/02/165937334218556809.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/10/4350315060_640_360.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/10/3835072893_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/10/2821936016_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/11/1311714870_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/10/4421772097_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/09/05/5898334347_400_225.png',
'http://s.yingshidq.com.cn/imags/poster/2022/12/06/167031399911862707.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/11/1405851829_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/10/3796501624_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/10/4202181519_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/11/1449894622_1248_702.jpeg',
'http://s.yingshidq.com.cn/cover/longbms/2023/08/10/3756558151_1248_702.jpeg'
]
aboutToAppear() {
this.hotCommendList.addData(this.hotCommendList.totalCount(),this.data)
}
build() {
Scroll() {
Column() {
Grid() {
LazyForEach(this.hotCommendList, (item: string) => {
GridItem() {
ImageKnifeComponent({
imageKnifeOption: {
loadSrc: item,
placeholderSrc: $r('app.media.icon_loading'),
mainScaleType: ScaleType.CENTER_CROP,
placeholderScaleType: ScaleType.CENTER_CROP
}
}).width('100%').height('100%')
}.width('45%').height(200)
}, (item: string) => JSON.stringify(item))
}
.columnsTemplate('1fr 1fr')
.columnsGap(8)
.rowsGap(10)
.width('100%')
.hitTestBehavior(HitTestMode.None)
.maxCount(10)
}.margin({ top: 5 })
}
}
}