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

/*
 * Copyright (C) 2024 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 { ImageKnifeComponent,ImageKnifeOption } from '@ohos/libraryimageknife'

@ObservedV2
export class MsgModel {
  id: string
  cId: string
  body: string
  status: number

  constructor(id: string, body: string, cId?: string) {
    this.id = id
    this.body = body
    this.status = -1
    this.cId = cId || ''
  }
}


// @Reusable
@ComponentV2
export struct MsgItem {
  @Param count: number = 0
  private data: Array<string> = [
    "http://e.hiphotos.baidu.com/image/pic/item/a1ec08fa513d2697e542494057fbb2fb4316d81e.jpg",
    "http://c.hiphotos.baidu.com/image/pic/item/30adcbef76094b36de8a2fe5a1cc7cd98d109d99.jpg",
    "http://h.hiphotos.baidu.com/image/pic/item/7c1ed21b0ef41bd5f2c2a9e953da81cb39db3d1d.jpg",
    "http://g.hiphotos.baidu.com/image/pic/item/55e736d12f2eb938d5277fd5d0628535e5dd6f4a.jpg",
    "http://e.hiphotos.baidu.com/image/pic/item/4e4a20a4462309f7e41f5cfe760e0cf3d6cad6ee.jpg",
    "http://b.hiphotos.baidu.com/image/pic/item/9d82d158ccbf6c81b94575cfb93eb13533fa40a2.jpg",
    "http://e.hiphotos.baidu.com/image/pic/item/4bed2e738bd4b31c1badd5a685d6277f9e2ff81e.jpg",
    "http://g.hiphotos.baidu.com/image/pic/item/0d338744ebf81a4c87a3add4d52a6059252da61e.jpg",
    "http://a.hiphotos.baidu.com/image/pic/item/f2deb48f8c5494ee5080c8142ff5e0fe99257e19.jpg",
    "http://f.hiphotos.baidu.com/image/pic/item/4034970a304e251f503521f5a586c9177e3e53f9.jpg",
    "http://b.hiphotos.baidu.com/image/pic/item/279759ee3d6d55fbb3586c0168224f4a20a4dd7e.jpg",
    "http://img2.xkhouse.com/bbs/hfhouse/data/attachment/forum/corebbs/2009-11/2009113011534566298.jpg",
    "http://a.hiphotos.baidu.com/image/pic/item/e824b899a9014c087eb617650e7b02087af4f464.jpg",
    "http://c.hiphotos.baidu.com/image/pic/item/9c16fdfaaf51f3de1e296fa390eef01f3b29795a.jpg",
    "http://d.hiphotos.baidu.com/image/pic/item/b58f8c5494eef01f119945cbe2fe9925bc317d2a.jpg",
    "http://h.hiphotos.baidu.com/image/pic/item/902397dda144ad340668b847d4a20cf430ad851e.jpg",
    "http://b.hiphotos.baidu.com/image/pic/item/359b033b5bb5c9ea5c0e3c23d139b6003bf3b374.jpg",
    "http://a.hiphotos.baidu.com/image/pic/item/8d5494eef01f3a292d2472199d25bc315d607c7c.jpg",
    "http://b.hiphotos.baidu.com/image/pic/item/e824b899a9014c08878b2c4c0e7b02087af4f4a3.jpg",
    "http://g.hiphotos.baidu.com/image/pic/item/6d81800a19d8bc3e770bd00d868ba61ea9d345f2.jpg",
  ]
  build(){
    if (this.count % 2 == 0 && this.count <6){
      ImageKnifeComponent({
        imageKnifeOption:new ImageKnifeOption({
          loadSrc:$r("app.media.startIcon"),
          placeholderSrc:$r("app.media.loading")
        }),syncLoad:true
      })
    }else if (this.count > 6 && this.count - 6 < this.data.length){
      ImageKnifeComponent({
        imageKnifeOption:new ImageKnifeOption({
          loadSrc:this.data[this.count - 6],
          placeholderSrc:$r("app.media.loading")
        }),syncLoad:true
      })
    }else {
      ImageKnifeComponent({
        imageKnifeOption:new ImageKnifeOption({
          loadSrc:$r("app.media.pngSample"),
          placeholderSrc:$r("app.media.loading")
        }),syncLoad:true
      })
    }
  }
}

@Entry
@ComponentV2
struct ImageTestPage {
  count : number = 0
  rCount: number = 0
  scroller: Scroller = new Scroller()
  @Local list: MsgModel[] = []
  @Local imageSize: number =100
  handAdd(){
    this.count++
    const msgItem = new MsgModel('add_id'+this.count, 'addBody'+this.count,'cId'+ this.count)
    this.list.push(msgItem)
    setTimeout(()=> {
      msgItem.status = 1
    },3000)
    this.scroller.scrollEdge(Edge.Bottom)
  }

  build(){
    Column(){
      Row(){
        Button("addItem").onClick(()=> {
          this.handAdd()
        })
        Button("remove").onClick(()=> {
          this.list.splice(0,1)
        })
      }
      Row(){
        Text($r('app.string.Click_on_add'))
          .onClick(()=> {
            this.imageSize = this.imageSize + 50
          })
          .width('50%').backgroundColor(0x88ff0000).textAlign(TextAlign.Center).height(50)
        Text($r('app.string.Click_on_reduce'))
          .onClick(()=> {
            this.imageSize = Math.max(this.imageSize - 50, 0)
          })
          .width('50%').backgroundColor(0x88ff0000).textAlign(TextAlign.Center).height(50)
      }.height(50).width('100%')

      List({space: 20, scroller: this.scroller }) {
        ForEach(this.list, (item: MsgModel)=> {
          ListItem(){
            MsgItem({count : this.count}).width(this.imageSize).height(this.imageSize);
          }
        },(item:MsgModel)=> item.id)
      }.width('100%').height('auto').layoutWeight(1)
    }
    .width('100%')
    .height('100%')
  }
}