Compare commits
2 Commits
6155594aa8
...
96123267a0
Author | SHA1 | Date |
---|---|---|
|
96123267a0 | |
|
aa69b84c22 |
|
@ -35,17 +35,17 @@ import {
|
||||||
import { collections } from '@kit.ArkTS'
|
import { collections } from '@kit.ArkTS'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct ImageTransformation {
|
struct ImageTransformation {
|
||||||
@Local imageKnifeOption: ImageKnifeOption = new ImageKnifeOption({
|
@State imageKnifeOption: ImageKnifeOption = {
|
||||||
loadSrc: $r('app.media.pngSample'),
|
loadSrc: $r('app.media.pngSample'),
|
||||||
placeholderSrc: $r("app.media.loading"),
|
placeholderSrc: $r("app.media.loading"),
|
||||||
errorholderSrc: $r("app.media.app_icon"),
|
errorholderSrc: $r("app.media.app_icon"),
|
||||||
objectFit: ImageFit.Contain
|
objectFit: ImageFit.Contain
|
||||||
})
|
}
|
||||||
@Local isRound: boolean = false;
|
@State isRound: boolean = false;
|
||||||
@Local isContrast: boolean = false;
|
@State isContrast: boolean = false;
|
||||||
@Local isRotate: boolean = false;
|
@State isRotate: boolean = false;
|
||||||
isBlur: boolean = false
|
isBlur: boolean = false
|
||||||
isBrightness: boolean = false
|
isBrightness: boolean = false
|
||||||
isGrayScale: boolean = false;
|
isGrayScale: boolean = false;
|
||||||
|
@ -412,14 +412,14 @@ struct ImageTransformation {
|
||||||
if (this.isMask) {
|
if (this.isMask) {
|
||||||
transformations.push(new MaskTransformation($r('app.media.mask_starfish')));
|
transformations.push(new MaskTransformation($r('app.media.mask_starfish')));
|
||||||
}
|
}
|
||||||
this.imageKnifeOption = new ImageKnifeOption({
|
this.imageKnifeOption = {
|
||||||
loadSrc: $r('app.media.pngSample'),
|
loadSrc: $r('app.media.pngSample'),
|
||||||
placeholderSrc: $r("app.media.loading"),
|
placeholderSrc: $r("app.media.loading"),
|
||||||
errorholderSrc: $r("app.media.app_icon"),
|
errorholderSrc: $r("app.media.app_icon"),
|
||||||
objectFit: ImageFit.Contain,
|
objectFit: ImageFit.Contain,
|
||||||
border: { radius: this.isRound ? { topLeft: 50, bottomRight: 50 } : 0 },
|
border: { radius: this.isRound ? { topLeft: 50, bottomRight: 50 } : 0 },
|
||||||
transformation: transformations.length > 0 ? new MultiTransTransformation(transformations) : undefined
|
transformation: transformations.length > 0 ? new MultiTransTransformation(transformations) : undefined
|
||||||
})
|
}
|
||||||
if (this.isCropCircle) {
|
if (this.isCropCircle) {
|
||||||
this.imageKnifeOption.objectFit = ImageFit.Cover;
|
this.imageKnifeOption.objectFit = ImageFit.Cover;
|
||||||
this.imageKnifeOption.border = { radius: 150 };
|
this.imageKnifeOption.border = { radius: 150 };
|
||||||
|
|
|
@ -83,12 +83,6 @@ struct Index {
|
||||||
|
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
// Button(this.getResourceString($r('app.string.Multiple_images')) + " + LazyForEach").margin({top:10}).onClick(()=>{
|
|
||||||
// router.push({
|
|
||||||
// uri: 'pages/ManyPhotoShowPage',
|
|
||||||
//
|
|
||||||
// });
|
|
||||||
// })
|
|
||||||
Button(this.getResourceString($r('app.string.Multiple_images')) + " + reuse + LazyForeach").margin({top:10}).onClick(()=>{
|
Button(this.getResourceString($r('app.string.Multiple_images')) + " + reuse + LazyForeach").margin({top:10}).onClick(()=>{
|
||||||
router.push({
|
router.push({
|
||||||
uri: 'pages/UserPage',
|
uri: 'pages/UserPage',
|
||||||
|
|
|
@ -15,11 +15,11 @@
|
||||||
import { ImageKnifeComponent, ImageKnifeOption } from '@ohos/libraryimageknife';
|
import { ImageKnifeComponent, ImageKnifeOption } from '@ohos/libraryimageknife';
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct ListPage {
|
struct ListPage {
|
||||||
|
|
||||||
private data: string[] = []
|
private data: string[] = []
|
||||||
@Local ImageKnifeOption: ImageKnifeOption = new ImageKnifeOption({ loadSrc: $r('app.media.startIcon')})
|
@State ImageKnifeOption: ImageKnifeOption = { loadSrc: $r('app.media.startIcon')}
|
||||||
|
|
||||||
|
|
||||||
aboutToAppear(): void {
|
aboutToAppear(): void {
|
||||||
|
|
|
@ -12,26 +12,26 @@
|
||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { ImageKnifeComponent,ImageKnifeOption } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct LongImagePage {
|
struct LongImagePage {
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Scroll() {
|
Scroll() {
|
||||||
|
|
||||||
// Image("https://wx2.sinaimg.cn/mw690/006HyQKGgy1hnqp08dw09j30u04twu0x.jpg").objectFit(ImageFit.Auto).height(300)
|
// Image("https://wx2.sinaimg.cn/mw690/006HyQKGgy1hnqp08dw09j30u04twu0x.jpg").objectFit(ImageFit.Auto).height(300)
|
||||||
|
|
||||||
// Image($r("app.media.aaa")).objectFit(ImageFit.Auto).width(200)
|
// Image($r("app.media.aaa")).objectFit(ImageFit.Auto).width(200)
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption: new ImageKnifeOption({
|
imageKnifeOption: {
|
||||||
loadSrc:"https://wx2.sinaimg.cn/mw690/006HyQKGgy1hnqp08dw09j30u04twu0x.jpg",
|
loadSrc:"https://wx2.sinaimg.cn/mw690/006HyQKGgy1hnqp08dw09j30u04twu0x.jpg",
|
||||||
//src:$r("app.media.aaa"),
|
//src:$r("app.media.aaa"),
|
||||||
placeholderSrc: $r("app.media.loading"),
|
placeholderSrc: $r("app.media.loading"),
|
||||||
errorholderSrc: $r("app.media.failed"),
|
errorholderSrc: $r("app.media.failed"),
|
||||||
objectFit: ImageFit.Auto
|
objectFit: ImageFit.Auto
|
||||||
})
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
.height('100%') .width('100%')
|
.height('100%') .width('100%')
|
||||||
|
|
|
@ -1,3 +1,17 @@
|
||||||
|
/*
|
||||||
|
* 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 { router } from '@kit.ArkUI'
|
import { router } from '@kit.ArkUI'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
|
|
|
@ -16,18 +16,18 @@ import { ImageKnifeComponent, ImageKnifeOption } from '@ohos/libraryimageknife';
|
||||||
|
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct SignatureTestPage {
|
struct SignatureTestPage {
|
||||||
@Local imageKnifeOption1: ImageKnifeOption =new ImageKnifeOption(
|
@State imageKnifeOption1: ImageKnifeOption =
|
||||||
{
|
{
|
||||||
loadSrc: $r('app.media.icon'),
|
loadSrc: $r('app.media.icon'),
|
||||||
placeholderSrc:$r("app.media.loading"),
|
placeholderSrc:$r("app.media.loading"),
|
||||||
});
|
};
|
||||||
@Local imageKnifeOption2: ImageKnifeOption =new ImageKnifeOption(
|
@State imageKnifeOption2: ImageKnifeOption =
|
||||||
{
|
{
|
||||||
loadSrc: $r('app.media.icon'),
|
loadSrc: $r('app.media.icon'),
|
||||||
placeholderSrc:$r("app.media.loading"),
|
placeholderSrc:$r("app.media.loading"),
|
||||||
});
|
};
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Scroll() {
|
Scroll() {
|
||||||
|
@ -37,11 +37,11 @@ struct SignatureTestPage {
|
||||||
Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
|
Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
|
||||||
Button($r('app.string.Load'))
|
Button($r('app.string.Load'))
|
||||||
.onClick(() => {
|
.onClick(() => {
|
||||||
this.imageKnifeOption1 = new ImageKnifeOption({
|
this.imageKnifeOption1 = {
|
||||||
loadSrc: 'https://img-blog.csdn.net/20140514114029140',
|
loadSrc: 'https://img-blog.csdn.net/20140514114029140',
|
||||||
placeholderSrc:$r("app.media.loading"),
|
placeholderSrc:$r("app.media.loading"),
|
||||||
signature: "1"
|
signature: "1"
|
||||||
})
|
}
|
||||||
}).margin({ top: 5, left: 3 })
|
}).margin({ top: 5, left: 3 })
|
||||||
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(300).height(300)
|
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(300).height(300)
|
||||||
}.width('100%').backgroundColor(Color.Pink)
|
}.width('100%').backgroundColor(Color.Pink)
|
||||||
|
@ -50,11 +50,11 @@ struct SignatureTestPage {
|
||||||
Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
|
Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
|
||||||
Button($r('app.string.Load'))
|
Button($r('app.string.Load'))
|
||||||
.onClick(() => {
|
.onClick(() => {
|
||||||
this.imageKnifeOption2 = new ImageKnifeOption({
|
this.imageKnifeOption2 = {
|
||||||
loadSrc: 'https://img-blog.csdn.net/20140514114029140',
|
loadSrc: 'https://img-blog.csdn.net/20140514114029140',
|
||||||
placeholderSrc:$r("app.media.loading"),
|
placeholderSrc:$r("app.media.loading"),
|
||||||
signature: new Date().getTime().toString()
|
signature: new Date().getTime().toString()
|
||||||
})
|
}
|
||||||
}).margin({ top: 5, left: 3 })
|
}).margin({ top: 5, left: 3 })
|
||||||
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption2 }).width(300).height(300)
|
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption2 }).width(300).height(300)
|
||||||
}.width('100%').backgroundColor(Color.Pink)
|
}.width('100%').backgroundColor(Color.Pink)
|
||||||
|
|
|
@ -12,10 +12,10 @@
|
||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { ImageKnifeComponent ,ImageKnifeOption} from '@ohos/libraryimageknife';
|
import { ImageKnifeComponent } from '@ohos/libraryimageknife';
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TestCommonImage {
|
struct TestCommonImage {
|
||||||
private data: Array<string> = []
|
private data: Array<string> = []
|
||||||
aboutToAppear(): void {
|
aboutToAppear(): void {
|
||||||
|
@ -30,13 +30,13 @@ struct TestCommonImage {
|
||||||
FlowItem() {
|
FlowItem() {
|
||||||
Column(){
|
Column(){
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption: new ImageKnifeOption({
|
imageKnifeOption: {
|
||||||
loadSrc: item,
|
loadSrc: item,
|
||||||
placeholderSrc: $r("app.media.loading"),
|
placeholderSrc: $r("app.media.loading"),
|
||||||
errorholderSrc: $r("app.media.failed"),
|
errorholderSrc: $r("app.media.failed"),
|
||||||
objectFit: ImageFit.Contain,
|
objectFit: ImageFit.Contain,
|
||||||
signature: "aaa"
|
signature: "aaa"
|
||||||
})
|
}
|
||||||
}).width("50%").height(200)
|
}).width("50%").height(200)
|
||||||
}
|
}
|
||||||
}.height(200)
|
}.height(200)
|
||||||
|
|
|
@ -12,34 +12,34 @@
|
||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { ImageKnifeComponent,ImageKnifeOption } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TestErrorHolderPage {
|
struct TestErrorHolderPage {
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Column() {
|
Column() {
|
||||||
Text("ImageKnifeComponent1").fontSize(20)
|
Text("ImageKnifeComponent1").fontSize(20)
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption: new ImageKnifeOption({
|
imageKnifeOption: {
|
||||||
loadSrc: "abc",
|
loadSrc: "abc",
|
||||||
errorholderSrc:$r('app.media.failed')
|
errorholderSrc:$r('app.media.failed')
|
||||||
})
|
}
|
||||||
}).width(200).height(200)
|
}).width(200).height(200)
|
||||||
Text("ImageKnifeComponent2").fontSize(20)
|
Text("ImageKnifeComponent2").fontSize(20)
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption: new ImageKnifeOption({
|
imageKnifeOption: {
|
||||||
loadSrc: "abc",
|
loadSrc: "abc",
|
||||||
errorholderSrc:$r('app.media.startIcon')
|
errorholderSrc:$r('app.media.startIcon')
|
||||||
})
|
}
|
||||||
}).width(200).height(200)
|
}).width(200).height(200)
|
||||||
Text("ImageKnifeComponent2").fontSize(20)
|
Text("ImageKnifeComponent2").fontSize(20)
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption: new ImageKnifeOption({
|
imageKnifeOption: {
|
||||||
loadSrc: "abc",
|
loadSrc: "abc",
|
||||||
errorholderSrc:$r('app.media.mask_starfish')
|
errorholderSrc:$r('app.media.mask_starfish')
|
||||||
})
|
}
|
||||||
}).width(200).height(200)
|
}).width(200).height(200)
|
||||||
}
|
}
|
||||||
.height('100%') .width('100%')
|
.height('100%') .width('100%')
|
||||||
|
|
|
@ -15,9 +15,9 @@
|
||||||
import { ImageKnifeComponent,ImageKnifeOption } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent,ImageKnifeOption } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TestPrefetchToFileCachePage {
|
struct TestPrefetchToFileCachePage {
|
||||||
@Local imageKnifeOption: ImageKnifeOption = new ImageKnifeOption({
|
@State imageKnifeOption: ImageKnifeOption = {
|
||||||
loadSrc:"https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658",
|
loadSrc:"https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658",
|
||||||
placeholderSrc:$r('app.media.loading'),
|
placeholderSrc:$r('app.media.loading'),
|
||||||
headerOption:[
|
headerOption:[
|
||||||
|
@ -26,7 +26,7 @@ struct TestPrefetchToFileCachePage {
|
||||||
value:"单个"
|
value:"单个"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
})
|
}
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Column() {
|
Column() {
|
||||||
|
|
|
@ -15,11 +15,11 @@
|
||||||
import { IndexComponent } from "@ohos/libraryimageknife"
|
import { IndexComponent } from "@ohos/libraryimageknife"
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TestHspPreLoadImage {
|
struct TestHspPreLoadImage {
|
||||||
build() {
|
build() {
|
||||||
Column() {
|
Column() {
|
||||||
IndexComponent()
|
IndexComponent()
|
||||||
}.width("100%").height('100%')
|
}.width("100%").height('100%')
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -12,9 +12,9 @@
|
||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { ImageKnifeComponent,ImageKnifeOption } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
@ObservedV2
|
@Observed
|
||||||
export class MsgModel {
|
export class MsgModel {
|
||||||
id: string
|
id: string
|
||||||
cId: string
|
cId: string
|
||||||
|
@ -30,10 +30,10 @@ export class MsgModel {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// @Reusable
|
@Reusable
|
||||||
@ComponentV2
|
@Component
|
||||||
export struct MsgItem {
|
export struct MsgItem {
|
||||||
@Param count: number = 0
|
count: number = 0
|
||||||
private data: Array<string> = [
|
private data: Array<string> = [
|
||||||
"http://e.hiphotos.baidu.com/image/pic/item/a1ec08fa513d2697e542494057fbb2fb4316d81e.jpg",
|
"http://e.hiphotos.baidu.com/image/pic/item/a1ec08fa513d2697e542494057fbb2fb4316d81e.jpg",
|
||||||
"http://c.hiphotos.baidu.com/image/pic/item/30adcbef76094b36de8a2fe5a1cc7cd98d109d99.jpg",
|
"http://c.hiphotos.baidu.com/image/pic/item/30adcbef76094b36de8a2fe5a1cc7cd98d109d99.jpg",
|
||||||
|
@ -59,37 +59,37 @@ export struct MsgItem {
|
||||||
build(){
|
build(){
|
||||||
if (this.count % 2 == 0 && this.count <6){
|
if (this.count % 2 == 0 && this.count <6){
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption:new ImageKnifeOption({
|
imageKnifeOption:{
|
||||||
loadSrc:$r("app.media.startIcon"),
|
loadSrc:$r("app.media.startIcon"),
|
||||||
placeholderSrc:$r("app.media.loading")
|
placeholderSrc:$r("app.media.loading")
|
||||||
}),syncLoad:true
|
},syncLoad:true
|
||||||
})
|
})
|
||||||
}else if (this.count > 6 && this.count - 6 < this.data.length){
|
}else if (this.count > 6 && this.count - 6 < this.data.length){
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption:new ImageKnifeOption({
|
imageKnifeOption:{
|
||||||
loadSrc:this.data[this.count - 6],
|
loadSrc:this.data[this.count - 6],
|
||||||
placeholderSrc:$r("app.media.loading")
|
placeholderSrc:$r("app.media.loading")
|
||||||
}),syncLoad:true
|
},syncLoad:true
|
||||||
})
|
})
|
||||||
}else {
|
}else {
|
||||||
ImageKnifeComponent({
|
ImageKnifeComponent({
|
||||||
imageKnifeOption:new ImageKnifeOption({
|
imageKnifeOption:{
|
||||||
loadSrc:$r("app.media.pngSample"),
|
loadSrc:$r("app.media.pngSample"),
|
||||||
placeholderSrc:$r("app.media.loading")
|
placeholderSrc:$r("app.media.loading")
|
||||||
}),syncLoad:true
|
},syncLoad:true
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct ImageTestPage {
|
struct ImageTestPage {
|
||||||
count : number = 0
|
count : number = 0
|
||||||
rCount: number = 0
|
rCount: number = 0
|
||||||
scroller: Scroller = new Scroller()
|
scroller: Scroller = new Scroller()
|
||||||
@Local list: MsgModel[] = []
|
@State list: MsgModel[] = []
|
||||||
@Local imageSize: number =100
|
@State imageSize: number =100
|
||||||
handAdd(){
|
handAdd(){
|
||||||
this.count++
|
this.count++
|
||||||
const msgItem = new MsgModel('add_id'+this.count, 'addBody'+this.count,'cId'+ this.count)
|
const msgItem = new MsgModel('add_id'+this.count, 'addBody'+this.count,'cId'+ this.count)
|
||||||
|
|
|
@ -15,15 +15,15 @@
|
||||||
import { ImageKnifeComponent, ImageKnife, ImageKnifeOption, CacheStrategy } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent, ImageKnife, ImageKnifeOption, CacheStrategy } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TestIsUrlExist {
|
struct TestIsUrlExist {
|
||||||
@Local imageKnifeOption: ImageKnifeOption = new ImageKnifeOption({
|
@State imageKnifeOption: ImageKnifeOption = {
|
||||||
loadSrc: $r('app.media.startIcon'),
|
loadSrc: $r('app.media.startIcon'),
|
||||||
placeholderSrc: $r('app.media.loading'),
|
placeholderSrc: $r('app.media.loading'),
|
||||||
errorholderSrc:$r('app.media.failed')
|
errorholderSrc:$r('app.media.failed')
|
||||||
})
|
}
|
||||||
@Local source: PixelMap | string | Resource = $r("app.media.startIcon")
|
@State source: PixelMap | string | Resource = $r("app.media.startIcon")
|
||||||
@Local source1: PixelMap | string | Resource = $r("app.media.startIcon")
|
@State source1: PixelMap | string | Resource = $r("app.media.startIcon")
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Column() {
|
Column() {
|
||||||
|
|
|
@ -15,19 +15,19 @@
|
||||||
import { ImageKnifeComponent,ImageKnife,ImageKnifeOption } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent,ImageKnife,ImageKnifeOption } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TestPrefetchToFileCachePage {
|
struct TestPrefetchToFileCachePage {
|
||||||
@Local imageKnifeOption: ImageKnifeOption = new ImageKnifeOption({
|
@State imageKnifeOption: ImageKnifeOption = {
|
||||||
loadSrc:$r('app.media.startIcon'),
|
loadSrc:$r('app.media.startIcon'),
|
||||||
placeholderSrc:$r('app.media.loading'),
|
placeholderSrc:$r('app.media.loading'),
|
||||||
errorholderSrc:$r('app.media.failed')
|
errorholderSrc:$r('app.media.failed')
|
||||||
})
|
}
|
||||||
async preload(url:string) {
|
async preload(url:string) {
|
||||||
let fileCachePath = await ImageKnife.getInstance().preLoadCache(url)
|
let fileCachePath = await ImageKnife.getInstance().preLoadCache(url)
|
||||||
console.log("preload-fileCachePath=="+ fileCachePath)
|
console.log("preload-fileCachePath=="+ fileCachePath)
|
||||||
}
|
}
|
||||||
async preload1(url:string) {
|
async preload1(url:string) {
|
||||||
let fileCachePath = await ImageKnife.getInstance().preLoadCache(new ImageKnifeOption({ loadSrc: url }))
|
let fileCachePath = await ImageKnife.getInstance().preLoadCache({ loadSrc: url })
|
||||||
console.log("preload-fileCachePath1=="+ fileCachePath)
|
console.log("preload-fileCachePath1=="+ fileCachePath)
|
||||||
}
|
}
|
||||||
build() {
|
build() {
|
||||||
|
|
|
@ -15,16 +15,16 @@
|
||||||
import { ImageKnifeComponent, ImageKnife, ImageKnifeOption, CacheStrategy } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent, ImageKnife, ImageKnifeOption, CacheStrategy } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TestRemoveCache {
|
struct TestRemoveCache {
|
||||||
@Local imageKnifeOption: ImageKnifeOption = new ImageKnifeOption({
|
@State imageKnifeOption: ImageKnifeOption = {
|
||||||
loadSrc: $r('app.media.startIcon'),
|
loadSrc: $r('app.media.startIcon'),
|
||||||
placeholderSrc: $r('app.media.loading'),
|
placeholderSrc: $r('app.media.loading'),
|
||||||
errorholderSrc:$r('app.media.failed')
|
errorholderSrc:$r('app.media.failed')
|
||||||
})
|
}
|
||||||
@Local source: PixelMap | string | Resource = $r("app.media.startIcon");
|
@State source: PixelMap | string | Resource = $r("app.media.startIcon");
|
||||||
@Local source1: PixelMap | string | Resource = $r("app.media.startIcon");
|
@State source1: PixelMap | string | Resource = $r("app.media.startIcon");
|
||||||
@Local url: string = '';
|
@State url: string = '';
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Column() {
|
Column() {
|
||||||
|
|
|
@ -17,17 +17,17 @@ import matrix4 from '@ohos.matrix4'
|
||||||
|
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct TransformPage {
|
struct TransformPage {
|
||||||
private custom_scale:number = 1
|
private custom_scale:number = 1
|
||||||
@Local matrix1:object = matrix4.identity().scale({ x: 1, y: 1 })
|
@State matrix1:object = matrix4.identity().scale({ x: 1, y: 1 })
|
||||||
@Local ImageKnifeOption: ImageKnifeOption = new ImageKnifeOption({
|
@State ImageKnifeOption: ImageKnifeOption = {
|
||||||
loadSrc: $r("app.media.rabbit"),
|
loadSrc: $r("app.media.rabbit"),
|
||||||
placeholderSrc: $r("app.media.loading"),
|
placeholderSrc: $r("app.media.loading"),
|
||||||
errorholderSrc: $r("app.media.app_icon"),
|
errorholderSrc: $r("app.media.app_icon"),
|
||||||
objectFit: ImageFit.Contain,
|
objectFit: ImageFit.Contain,
|
||||||
border: { radius: 50 }
|
border: { radius: 50 }
|
||||||
})
|
}
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Column() {
|
Column() {
|
||||||
|
|
|
@ -15,50 +15,24 @@
|
||||||
import { ImageKnifeComponent, ImageKnifeOption } from '@ohos/libraryimageknife'
|
import { ImageKnifeComponent, ImageKnifeOption } from '@ohos/libraryimageknife'
|
||||||
|
|
||||||
// const logger = new imUtils.logger.IMLogger('Avatar')
|
// const logger = new imUtils.logger.IMLogger('Avatar')
|
||||||
@ObservedV2
|
|
||||||
export class MyStorage {
|
class MyImageOption extends ImageKnifeOption {
|
||||||
static instance:MyStorage | undefined = undefined
|
account?: string
|
||||||
static getInstance(){
|
|
||||||
if(MyStorage.instance == undefined) {
|
|
||||||
MyStorage.instance = new MyStorage()
|
|
||||||
}
|
|
||||||
return MyStorage.instance
|
|
||||||
}
|
|
||||||
@Trace WeLink_Mob_fontSize_multiple: number = 1
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ComponentV2
|
@Component
|
||||||
export struct UserAvatar {
|
export struct UserAvatar {
|
||||||
|
@Prop @Watch('userInfoUpdate') userInfo: string = ""
|
||||||
// @Prop userInfo: string = ""
|
// @Prop userInfo: string = ""
|
||||||
imgSize: number = 100
|
imgSize: number = 100
|
||||||
radius: number = 12
|
radius: number = 12
|
||||||
borderSize: number = 0
|
borderSize: number = 0
|
||||||
imgSizes: number = 1
|
imgSizes: number = 1
|
||||||
@Local ImageKnifeOption: ImageKnifeOption = new ImageKnifeOption()
|
@State ImageKnifeOption: ImageKnifeOption = new ImageKnifeOption()
|
||||||
|
@StorageProp('WeLink_Mob_fontSize_multiple') @Watch('updateImgSize') WeLink_Mob_fontSize_multiple: number = 0
|
||||||
scalable: boolean = true;
|
scalable: boolean = true;
|
||||||
@Local calcImgSize: number = 100
|
@State calcImgSize: number = 100
|
||||||
@Param userInfo: string = ""
|
|
||||||
@Monitor('userInfo')
|
|
||||||
userInfoUpdate() {
|
|
||||||
// if (uri === 'userInfo' && this.imageKnifeOption.account !== this.userInfo.contactId) return;
|
|
||||||
// // logger.info(`userInfoUpdate uri=${uri} oldAcc=${this.imageKnifeOption.loadSrc} nowAcc=${this.userInfo.externalHeadUrl}`)
|
|
||||||
// if (this.userInfo.externalHeadUrl === this.imageKnifeOption.loadSrc && this.userInfo.infoUpdateTime.getTime()
|
|
||||||
// .toString() === this.imageKnifeOption?.signature?.getKey()) return;
|
|
||||||
this.ImageKnifeOption = new ImageKnifeOption({
|
|
||||||
//TODO:写死loadSRC,场景:变更组件大小,所有图片不显示
|
|
||||||
loadSrc: this.userInfo,
|
|
||||||
placeholderSrc: $r('app.media.loading'),
|
|
||||||
errorholderSrc: $r('app.media.failed'),
|
|
||||||
border: { radius:20,width:5,color:$r('app.color.start_window_background') },
|
|
||||||
objectFit:ImageFit.Contain
|
|
||||||
// signature: new ObjectKey(this.userInfo.infoUpdateTime.getTime().toString())
|
|
||||||
})
|
|
||||||
}
|
|
||||||
@Local storage: MyStorage = MyStorage.getInstance()
|
|
||||||
@Monitor('storage.WeLink_Mob_fontSize_multiple')
|
|
||||||
updateImgSize() {
|
|
||||||
this.setImageSize()
|
|
||||||
}
|
|
||||||
aboutToAppear(): void {
|
aboutToAppear(): void {
|
||||||
this.userInfoUpdate()
|
this.userInfoUpdate()
|
||||||
this.setImageSize()
|
this.setImageSize()
|
||||||
|
@ -67,19 +41,39 @@ export struct UserAvatar {
|
||||||
setImageSize() {
|
setImageSize() {
|
||||||
if (!this.scalable) {
|
if (!this.scalable) {
|
||||||
this.calcImgSize = this.imgSize
|
this.calcImgSize = this.imgSize
|
||||||
} else if (this.storage.WeLink_Mob_fontSize_multiple < 0.9) {
|
} else if (this.WeLink_Mob_fontSize_multiple < 0.9) {
|
||||||
this.calcImgSize = this.imgSize * 0.9
|
this.calcImgSize = this.imgSize * 0.9
|
||||||
} else if (this.storage.WeLink_Mob_fontSize_multiple > 1.6) {
|
} else if (this.WeLink_Mob_fontSize_multiple > 1.6) {
|
||||||
this.calcImgSize = this.imgSize * 1.6
|
this.calcImgSize = this.imgSize * 1.6
|
||||||
} else {
|
} else {
|
||||||
this.calcImgSize = this.imgSize * this.storage.WeLink_Mob_fontSize_multiple
|
this.calcImgSize = this.imgSize * this.WeLink_Mob_fontSize_multiple
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
updateImgSize() {
|
||||||
|
this.setImageSize()
|
||||||
|
}
|
||||||
|
|
||||||
aboutToReuse(param: ESObject) {
|
aboutToReuse(param: ESObject) {
|
||||||
this.userInfoUpdate()
|
this.userInfoUpdate()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
userInfoUpdate() {
|
||||||
|
// if (uri === 'userInfo' && this.imageKnifeOption.account !== this.userInfo.contactId) return;
|
||||||
|
// // logger.info(`userInfoUpdate uri=${uri} oldAcc=${this.imageKnifeOption.loadSrc} nowAcc=${this.userInfo.externalHeadUrl}`)
|
||||||
|
// if (this.userInfo.externalHeadUrl === this.imageKnifeOption.loadSrc && this.userInfo.infoUpdateTime.getTime()
|
||||||
|
// .toString() === this.imageKnifeOption?.signature?.getKey()) return;
|
||||||
|
this.ImageKnifeOption = {
|
||||||
|
//TODO:写死loadSRC,场景:变更组件大小,所有图片不显示
|
||||||
|
loadSrc: this.userInfo,
|
||||||
|
placeholderSrc: $r('app.media.loading'),
|
||||||
|
errorholderSrc: $r('app.media.failed'),
|
||||||
|
border: { radius:20,width:5,color:$r('app.color.start_window_background') },
|
||||||
|
objectFit:ImageFit.Contain
|
||||||
|
// signature: new ObjectKey(this.userInfo.infoUpdateTime.getTime().toString())
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
Row() {
|
Row() {
|
||||||
// Image(this.imageKnifeOption.loadSrc)
|
// Image(this.imageKnifeOption.loadSrc)
|
||||||
|
@ -93,12 +87,12 @@ export struct UserAvatar {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Image(this.userInfo)
|
// Image(this.userInfo)
|
||||||
// Text((this.imageKnifeOption.loadSrc as string).split('/')[8])
|
// Text((this.imageKnifeOption.loadSrc as string).split('/')[8])
|
||||||
// .position({ x: 0, y: 0 })
|
// .position({ x: 0, y: 0 })
|
||||||
// .zIndex(9)
|
// .zIndex(9)
|
||||||
// .fontSize(12)
|
// .fontSize(12)
|
||||||
// .fontColor('#ff0000')
|
// .fontColor('#ff0000')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -18,15 +18,15 @@ import { photoAccessHelper } from '@kit.MediaLibraryKit';
|
||||||
|
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
@ComponentV2
|
@Component
|
||||||
struct DataShareUriLoadPage {
|
struct DataShareUriLoadPage {
|
||||||
@Local imageKnifeOption1: ImageKnifeOption =
|
@State imageKnifeOption1: ImageKnifeOption =
|
||||||
new ImageKnifeOption({
|
{
|
||||||
loadSrc: $r('app.media.icon'),
|
loadSrc: $r('app.media.icon'),
|
||||||
|
|
||||||
placeholderSrc: $r('app.media.loading'),
|
placeholderSrc: $r('app.media.loading'),
|
||||||
errorholderSrc: $r('app.media.failed')
|
errorholderSrc: $r('app.media.failed')
|
||||||
});
|
};
|
||||||
|
|
||||||
|
|
||||||
build() {
|
build() {
|
||||||
|
@ -43,10 +43,10 @@ struct DataShareUriLoadPage {
|
||||||
let photoViewPicker = new photoAccessHelper.PhotoViewPicker();
|
let photoViewPicker = new photoAccessHelper.PhotoViewPicker();
|
||||||
let photoSelectResult: photoAccessHelper.PhotoSelectResult = await photoViewPicker.select(photoSelectOptions);
|
let photoSelectResult: photoAccessHelper.PhotoSelectResult = await photoViewPicker.select(photoSelectOptions);
|
||||||
uris = photoSelectResult.photoUris;
|
uris = photoSelectResult.photoUris;
|
||||||
this.imageKnifeOption1 = new ImageKnifeOption({
|
this.imageKnifeOption1 = {
|
||||||
loadSrc: uris[0],
|
loadSrc: uris[0],
|
||||||
placeholderSrc:$r('app.media.loading')
|
placeholderSrc:$r('app.media.loading')
|
||||||
})
|
}
|
||||||
}).margin({ top: 5, left: 3 })
|
}).margin({ top: 5, left: 3 })
|
||||||
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(300).height(300)
|
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(300).height(300)
|
||||||
}.width('100%').backgroundColor(Color.Pink)
|
}.width('100%').backgroundColor(Color.Pink)
|
||||||
|
|
|
@ -3,7 +3,6 @@
|
||||||
"pages/Index",
|
"pages/Index",
|
||||||
"pages/ListPage",
|
"pages/ListPage",
|
||||||
"pages/SingleImage",
|
"pages/SingleImage",
|
||||||
"pages/ManyPhotoShowPage",
|
|
||||||
"pages/LongImagePage",
|
"pages/LongImagePage",
|
||||||
"pages/TransformPage",
|
"pages/TransformPage",
|
||||||
"pages/UserPage",
|
"pages/UserPage",
|
||||||
|
|
|
@ -69,5 +69,3 @@ export { CropTransformation } from './src/main/ets/transform/CropTransformation'
|
||||||
export { MaskTransformation } from './src/main/ets/transform/MaskTransformation'
|
export { MaskTransformation } from './src/main/ets/transform/MaskTransformation'
|
||||||
|
|
||||||
export { SepiaTransformation } from './src/main/ets/transform/SepiaTransformation'
|
export { SepiaTransformation } from './src/main/ets/transform/SepiaTransformation'
|
||||||
|
|
||||||
export { DownsampleStrategy } from './src/main/ets/downsampling/DownsampleStartegy'
|
|
Loading…
Reference in New Issue