diff --git a/data/Preferences/entry/src/main/ets/common/ThemeDesktop.ets b/data/Preferences/entry/src/main/ets/common/ThemeDesktop.ets index a518e58246a7aa1c6c8a9f39414f5be9abde3d69..7bba891ed81a1088d47135f8ecc8ff09ea0a29b8 100644 --- a/data/Preferences/entry/src/main/ets/common/ThemeDesktop.ets +++ b/data/Preferences/entry/src/main/ets/common/ThemeDesktop.ets @@ -39,7 +39,7 @@ export default struct ThemeDesktop { ForEach(this.themeDatas, (item: arrayType) => { GridItem() { Column() { - Image(item.image) + Image(item.image!) .width(70) .height(70) .objectFit(ImageFit.Fill) diff --git a/media/Image/photomodify/src/main/ets/components/pages/ChoicePhoto.ets b/media/Image/photomodify/src/main/ets/components/pages/ChoicePhoto.ets index 0e65eb612064263b662c60bfde93f0a90b5da24b..90ff661566a7c8afefbcb36bc77c035d2470d789 100644 --- a/media/Image/photomodify/src/main/ets/components/pages/ChoicePhoto.ets +++ b/media/Image/photomodify/src/main/ets/components/pages/ChoicePhoto.ets @@ -23,7 +23,7 @@ const TAG: string = 'ChoicePhoto' @Component export struct ChoicePhoto { - @State whichShow: Array = [true, false] + @State whichShow: boolean[] = [true, false] @State medias: Array = [] @State choiceShow: Array = [$r('app.string.choice_photo'), $r('app.string.choice_video')] @State taskShow: Array = [$r('app.media.photo'), $r('app.media.video')] @@ -34,9 +34,10 @@ export struct ChoicePhoto { @State isChoice: boolean = false @State nextText: string = '' @State isLand: boolean = false - private mediaLibraryInstance: mediaLibrary.MediaLibrary = mediaLibrary.getMediaLibrary(getContext(this) as any) + private mediaLibraryInstance: mediaLibrary.MediaLibrary = mediaLibrary.getMediaLibrary(getContext(this)) private listener = mediaQuery.matchMediaSync('screen and (min-aspect-ratio: 1.5) or (orientation: landscape)') - onLand = (mediaQueryResult) => { + + onLand(mediaQueryResult: mediaQuery.MediaQueryResult) { if (mediaQueryResult.matches) { this.isLand = true } else { @@ -52,7 +53,8 @@ export struct ChoicePhoto { } } - @Builder showChoiceBuild(backGround: string, showNumber: number) { + @Builder + showChoiceBuild(backGround: string, showNumber: number) { Column() { Text(showNumber === 0 ? '' : `${showNumber}`) .fontSize(14) @@ -70,14 +72,14 @@ export struct ChoicePhoto { async getFileAssetsFromType(mediaType: mediaLibrary.MediaType) { logger.info(TAG, `getFileAssetsFromType`) - let context = getContext(this) as any + let context = getContext(this) as Context let mediaLibraryInstance = mediaLibrary.getMediaLibrary(context) if (!mediaLibraryInstance) { return } logger.info(TAG, `mediaLibraryInstance = ${JSON.stringify(mediaLibraryInstance)}`) let fileKeyObj = mediaLibrary.FileKey - let fetchOp = { + let fetchOp: mediaLibrary.MediaFetchOptions = { selections: `${fileKeyObj.MEDIA_TYPE}=?`, selectionArgs: [`${mediaType}`], } @@ -89,12 +91,12 @@ export struct ChoicePhoto { logger.info(TAG, `this.medias = ${JSON.stringify(this.medias)}`) } - convertContext(context: any) { + convertContext(context: Context): Context { return context } - async convertResourceToString(resource: Resource) { - return await this.convertContext(getContext(this)).resourceManager.getString(resource) + async convertResourceToString(resource: Resource): Promise { + return await this.convertContext(getContext(this)).resourceManager.getString(resource.id) } async aboutToAppear() { @@ -104,7 +106,7 @@ export struct ChoicePhoto { this.getFileAssetsFromType(mediaLibrary.MediaType.IMAGE) } - getMaxHeight() { + getMaxHeight(): ConstraintSizeOptions { if (!this.isLand && this.isChoice) { return { maxHeight: '64%' } } else if (!this.isLand && !this.isChoice) { @@ -150,7 +152,7 @@ export struct ChoicePhoto { if (this.isChoice === false) { return } - this.mediaUris = this.choiceMedias.map((item) => { + this.mediaUris = this.choiceMedias.map((item: mediaLibrary.FileAsset) => { return item.uri }) router.push({ @@ -167,37 +169,40 @@ export struct ChoicePhoto { Column() { Row() { - ForEach(this.choiceShow, (item, index) => { + ForEach(this.choiceShow, (item: Resource, index?: number) => { Column() { - Text(item) - .fontSize(20) - .fontWeight(500) - .fontColor(this.whichShow[index] === true ? '#0000000' : '#99182431') - .onClick(() => { - this.whichShow.fill(false) - if (this.whichShow.length > index) { - this.whichShow[index] = true - } - this.medias = [] - if (index == 0) { - this.getFileAssetsFromType(mediaLibrary.MediaType.IMAGE) - } else { - prompt.showDialog({ message: $r('app.string.user_tip') }) - this.choiceMedias = [] - this.isShowChoices = new Array(this.medias.length).fill(false) - } - }) - if (this.whichShow[index]) { - Divider() - .vertical(false) - .strokeWidth(3) - .color('#ffff0000') - .lineCap(LineCapStyle.Round) - .width('40%') - .margin({ top: 4 }) + if (index !== undefined) { + Text(item) + .fontSize(20) + .fontWeight(500) + .fontColor(this.whichShow[index] === true ? '#0000000' : '#99182431') + .onClick(() => { + this.whichShow.fill(false) + if (this.whichShow.length > index) { + if (index) { + this.whichShow[index] = true + } + } + this.medias = [] + if (index == 0) { + this.getFileAssetsFromType(mediaLibrary.MediaType.IMAGE) + } else { + prompt.showDialog({ message: $r('app.string.user_tip') }) + this.choiceMedias = [] + this.isShowChoices = new Array(this.medias.length).fill(false) + } + }) + if (this.whichShow[index]) { + Divider() + .vertical(false) + .strokeWidth(3) + .color('#ffff0000') + .lineCap(LineCapStyle.Round) + .width('40%') + .margin({ top: 4 }) + } } - } - .width('30%') + }.width('30%') }) } .margin({ top: 20 }) @@ -206,7 +211,7 @@ export struct ChoicePhoto { Scroll() { Column() { Grid() { - ForEach(this.medias, (item, index) => { + ForEach(this.medias, (item: mediaLibrary.FileAsset, index?: number) => { GridItem() { Stack({ alignContent: Alignment.TopEnd }) { Image(item.uri) @@ -214,8 +219,7 @@ export struct ChoicePhoto { .height('100%') .borderRadius(10) .objectFit(ImageFit.Fill) - - if (this.isShowChoices[index]) { + if (index !== undefined && this.isShowChoices[index]) { this.showChoiceBuild('#e92f4f', this.choiceMedias.indexOf(item) + 1) } else { this.showChoiceBuild('#ffb7b4b4', 0) @@ -224,22 +228,24 @@ export struct ChoicePhoto { .width('100%') .height('100%') .onClick(() => { - this.isShowChoices[index] = !this.isShowChoices[index] - if (this.isShowChoices[index]) { - if (this.choiceMedias.length > 5) { - prompt.showDialog({ message: $r('app.string.choice_number') }) - this.isShowChoices[index] = !this.isShowChoices[index] - return - } - this.choiceMedias.push(item) - } else { - if (this.choiceMedias.indexOf(item) != -1) { - this.choiceMedias.splice(this.choiceMedias.indexOf(item), 1) + if (index !== undefined) { + this.isShowChoices[index] = !this.isShowChoices[index] + if (this.isShowChoices[index]) { + if (this.choiceMedias.length > 5) { + prompt.showDialog({ message: $r('app.string.choice_number') }) + this.isShowChoices[index] = !this.isShowChoices[index] + return + } + this.choiceMedias.push(item) + } else { + if (this.choiceMedias.indexOf(item) != -1) { + this.choiceMedias.splice(this.choiceMedias.indexOf(item), 1) + } } } }) - } - .aspectRatio(1) + }.aspectRatio(1) + }) } .columnsTemplate('1fr 1fr 1fr 1fr') @@ -257,7 +263,7 @@ export struct ChoicePhoto { if (this.isChoice) { Grid() { - ForEach(this.choiceMedias, (item, index) => { + ForEach(this.choiceMedias, (item: mediaLibrary.FileAsset, index?: number) => { GridItem() { Stack({ alignContent: Alignment.TopEnd }) { Image(item.uri) @@ -269,12 +275,14 @@ export struct ChoicePhoto { .height(20) .margin({ top: 5, right: 5 }) .onClick(() => { - for (let i = 0;i < this.medias.length; i++) { - if (this.choiceMedias[index] && this.isShowChoices.length > i && this.medias[i] === this.choiceMedias[index]) { - this.isShowChoices[i] = false + if (index !== undefined) { + for (let i = 0;i < this.medias.length; i++) { + if (this.choiceMedias[index] && this.isShowChoices.length > i && this.medias[i] === this.choiceMedias[index]) { + this.isShowChoices[i] = false + } } + this.choiceMedias.splice(index, 1) } - this.choiceMedias.splice(index, 1) }) } .width('100%') @@ -298,18 +306,19 @@ export struct ChoicePhoto { } Row() { - ForEach(this.taskShow, (item, index) => { - Column() { - Image(item) - .width(30) - .height(30) + ForEach(this.taskShow, (item: Resource, index?: number) => { + if (index !== undefined) { + Column() { + Image(item) + .width(30) + .height(30) - Text(this.textShow[index]) - .fontSize(14) - .fontColor('#99182431') - .margin({ top: 2 }) + Text(this.textShow[index]) + .fontSize(14) + .fontColor('#99182431') + .margin({ top: 2 }) + }.width('50%') } - .width('50%') }) } .margin({ top: 8 }) diff --git a/media/Image/photomodify/src/main/ets/components/pages/EditPage.ets b/media/Image/photomodify/src/main/ets/components/pages/EditPage.ets index ddf525dcec41a6f663c6f259504b6bf2aa2ac1be..06ccf2507c4744b0e5b5e17ac37bbb2627374e05 100644 --- a/media/Image/photomodify/src/main/ets/components/pages/EditPage.ets +++ b/media/Image/photomodify/src/main/ets/components/pages/EditPage.ets @@ -20,9 +20,15 @@ import { logger } from '../util/Logger' const TAG: string = 'EditPage' + +interface MediaUris extends Object { + mediaUris: Array + isLand: boolean +} + @Component export struct EditPage { - @State mediaUris: Array = router.getParams()['mediaUris'] + @State mediaUris: Array = (router.getParams() as MediaUris).mediaUris @State pixelMaps: Array = [] @State tasks: Array = [$r('app.media.scale'), $r('app.media.crop'), $r('app.media.rotate')] @State tempTasks: Array = [$r('app.media.scale'), $r('app.media.crop'), $r('app.media.rotate')] @@ -37,28 +43,27 @@ export struct EditPage { @State cropFrontShows: Array = new Array(4).fill(false) @State tasksFrontShows: Array = new Array(3).fill(false) @State borderShows: Array = new Array(this.mediaUris.length).fill(false) - @State pixelMap: image.PixelMap = undefined - @State tempPixelMap: image.PixelMap = undefined + @State pixelMap: image.PixelMap = {} as image.PixelMap + @State tempPixelMap: image.PixelMap = {} as image.PixelMap @State single: number = 0 @State isCrop: boolean = false @State isScale: boolean = false @State scaleSliderValue: number = 0 @State selectIndex: number = 0 @State isLand: boolean = false - private mediaLibraryInstance: mediaLibrary.MediaLibrary = mediaLibrary.getMediaLibrary(getContext(this) as any) - + private mediaLibraryInstance: mediaLibrary.MediaLibrary = mediaLibrary.getMediaLibrary(getContext(this) as Context) flushPage() { this.tempPixelMap = this.pixelMap - this.pixelMap = undefined + this.pixelMap = {} as image.PixelMap this.pixelMap = this.tempPixelMap } - async queryFile(dataUri: string) { + async queryFile(dataUri: string): Promise { logger.info(TAG, `enter queryFile`) let fileKeyObj = mediaLibrary.FileKey logger.info(TAG, `fileKeyObj = ${fileKeyObj}`) - let fetchOp = { + let fetchOp: mediaLibrary.MediaFetchOptions = { selections: '', selectionArgs: [], uri: dataUri @@ -66,33 +71,33 @@ export struct EditPage { const fetchFileResult = await this.mediaLibraryInstance.getFileAssets(fetchOp) logger.info(TAG, `fetchFileResult = ${JSON.stringify(fetchFileResult)} ,count = ${JSON.stringify(fetchFileResult.getCount())}`) if (!fetchFileResult) { - return + return {} as mediaLibrary.FileAsset } const fileAsset = await fetchFileResult.getFirstObject() if (!fileAsset) { - return + return {} as mediaLibrary.FileAsset } logger.info(TAG, `fileAsset = ${JSON.stringify(fileAsset)}`) return fileAsset } - async getPixelMap(uri: string) { + async getPixelMap(uri: string): Promise { let fileAssert: mediaLibrary.FileAsset = await this.queryFile(uri) if (!fileAssert) { - return + return {} as image.PixelMap } let fd = await fileAssert.open('Rw') if (!fd) { - return + return {} as image.PixelMap } logger.info(TAG, `fd = ${fd}`) let imageSourceApi = image.createImageSource(fd) if (!imageSourceApi) { - return + return {} as image.PixelMap } let pixmap = await imageSourceApi.createPixelMap() if (!pixmap) { - return + return {} as image.PixelMap } return pixmap } @@ -127,10 +132,10 @@ export struct EditPage { } async aboutToAppear() { - logger.info(TAG, `enter aboutToAppear uris = ${JSON.stringify(router.getParams()['mediaUris'])}`) + logger.info(TAG, `enter aboutToAppear uris = ${JSON.stringify(this.mediaUris)}`) this.pixelMaps = [] - if(router.getParams() && router.getParams()['isLand']){ - this.isLand = router.getParams()['isLand'] + if (router.getParams() && (router.getParams() as MediaUris).isLand) { + this.isLand = (router.getParams() as MediaUris).isLand } for (let i = 0; i < this.mediaUris.length; i++) { let pixelMap = await this.getPixelMap(this.mediaUris[i]) @@ -198,29 +203,31 @@ export struct EditPage { if (!this.isCrop && !this.isScale) { Row() { - ForEach(this.pixelMaps, (item, index) => { - Image(item) - .width(60) - .height(60) - .borderRadius(15) - .margin({ left: 8 }) - .border({ - style: BorderStyle.Solid, - width: 2, - color: (this.borderShows[index] === true ? '#e92f4f' : '#ffffff') - }) - .onClick(async () => { - if (this.pixelMap === item) { - return - } - this.borderShows.fill(false) - if (this.borderShows.length > index) { - this.borderShows[index] = true - } - this.single = 0 - this.pixelMap = item - this.selectIndex = index - }) + ForEach(this.pixelMaps, (item: image.PixelMap, index?: number) => { + if (index !== undefined) { + Image(item) + .width(60) + .height(60) + .borderRadius(15) + .margin({ left: 8 }) + .border({ + style: BorderStyle.Solid, + width: 2, + color: (this.borderShows[index] === true ? '#e92f4f' : '#ffffff') + }) + .onClick(async () => { + if (this.pixelMap === item) { + return + } + this.borderShows.fill(false) + if (this.borderShows.length > index) { + this.borderShows[index] = true + } + this.single = 0 + this.pixelMap = item + this.selectIndex = index + }) + } }) Row() { Image($r('app.media.add')) @@ -244,40 +251,44 @@ export struct EditPage { } else if (this.isCrop) { Row() { - ForEach(this.cropMedias, (item, index) => { + ForEach(this.cropMedias, (item: Resource, index?: number) => { Column() { Image(item) .width(30) .height(30) - Text(this.cropRatios[index]) - .fontSize(15) - .fontColor(this.cropFrontShows[index] === true ? '#e92f4f' : '#acabab') - .margin({ top: 5 }) + if (index !== undefined) { + Text(this.cropRatios[index]) + .fontSize(15) + .fontColor(this.cropFrontShows[index] === true ? '#e92f4f' : '#acabab') + .margin({ top: 5 }) + } } .layoutWeight(1) .onClick(async () => { - this.cropMedias = this.tempCropMedias.map((item) => { + this.cropMedias = this.tempCropMedias.map((item: Resource) => { return item }) - if (index === 0) { - if (this.mediaUris.length > this.selectIndex && this.pixelMaps.length > this.selectIndex) { - this.pixelMap = await this.getPixelMap(this.mediaUris[this.selectIndex]) - this.pixelMaps[this.selectIndex] = this.pixelMap + if (index !== undefined) { + if (index === 0) { + if (this.mediaUris.length > this.selectIndex && this.pixelMaps.length > this.selectIndex) { + this.pixelMap = await this.getPixelMap(this.mediaUris[this.selectIndex]) + this.pixelMaps[this.selectIndex] = this.pixelMap + } + } + else if (index === 1) { + await this.cropImage(1) + } else if (index === 2) { + await this.cropImage(3 / 4) + } else if (index === 3) { + await this.cropImage(9 / 16) + } + if (this.cropMedias.length > index && this.cropChoiceMedias.length > index) { + this.cropMedias[index] = this.cropChoiceMedias[index] + } + this.cropFrontShows.fill(false) + if (this.cropFrontShows.length > index) { + this.cropFrontShows[index] = true } - } - else if (index === 1) { - await this.cropImage(1) - } else if (index === 2) { - await this.cropImage(3 / 4) - } else if (index === 3) { - await this.cropImage(9 / 16) - } - if (this.cropMedias.length > index && this.cropChoiceMedias.length > index) { - this.cropMedias[index] = this.cropChoiceMedias[index] - } - this.cropFrontShows.fill(false) - if (this.cropFrontShows.length > index) { - this.cropFrontShows[index] = true } }) }) @@ -286,24 +297,26 @@ export struct EditPage { .margin({ top: 15 }) } else if (this.isScale) { Row() { - ForEach(this.scaleMedias, (item, index) => { - Column() { - Image(item) - .height(30) - .width(30) - Text(this.scaleTexts[index]) - .fontSize(15) - .margin({ top: 5 }) - } - .layoutWeight(1) - .onClick(async () => { - if (index === 0) { - await this.pixelMap.scale(0.8, 0.8) - } else if (index === 1) { - await this.pixelMap.scale(1.25, 1.25) + ForEach(this.scaleMedias, (item: Resource, index?: number) => { + if (index !== undefined) { + Column() { + Image(item) + .height(30) + .width(30) + Text(this.scaleTexts[index]) + .fontSize(15) + .margin({ top: 5 }) } - this.flushPage() - }) + .layoutWeight(1) + .onClick(async () => { + if (index === 0) { + await this.pixelMap.scale(0.8, 0.8) + } else if (index === 1) { + await this.pixelMap.scale(1.25, 1.25) + } + this.flushPage() + }) + } }) } .width('100%') @@ -325,47 +338,49 @@ export struct EditPage { .margin({ top: 8 }) Row() { - ForEach(this.tasks, (item, index) => { - Column() { - Image(item) - .width(30) - .height(30) - Text(this.taskText[index]) - .fontSize(15) - .fontColor(this.tasksFrontShows[index] === true ? '#e92f4f' : '#acabab') - } - .height(60) - .width(60) - .layoutWeight(1) - .onClick(async () => { - if (index === 0) { - this.isScale = !this.isScale - this.isCrop = false - } else if (index === 1) { - this.isCrop = !this.isCrop - this.isScale = false - } else if (index === 2) { - await this.pixelMap.rotate(90) - this.isCrop = false - this.isScale = false - this.flushPage() - - } - this.tasksFrontShows.fill(false) - if (this.tasksFrontShows.length > index) { - this.tasksFrontShows[index] = true - } - this.tasks = this.tempTasks.map((item) => { - return item - }) - if (this.tasks.length > index && this.choiceTasks.length > index) { - this.tasks[index] = this.choiceTasks[index] + ForEach(this.tasks, (item: Resource, index?: number) => { + if (index !== undefined) { + Column() { + Image(item) + .width(30) + .height(30) + Text(this.taskText[index]) + .fontSize(15) + .fontColor(this.tasksFrontShows[index] === true ? '#e92f4f' : '#acabab') } - this.cropFrontShows.fill(false) - this.cropMedias = this.tempCropMedias.map((item) => { - return item + .height(60) + .width(60) + .layoutWeight(1) + .onClick(async () => { + if (index === 0) { + this.isScale = !this.isScale + this.isCrop = false + } else if (index === 1) { + this.isCrop = !this.isCrop + this.isScale = false + } else if (index === 2) { + await this.pixelMap.rotate(90) + this.isCrop = false + this.isScale = false + this.flushPage() + + } + this.tasksFrontShows.fill(false) + if (this.tasksFrontShows.length > index) { + this.tasksFrontShows[index] = true + } + this.tasks = this.tempTasks.map((item: Resource) => { + return item + }) + if (this.tasks.length > index && this.choiceTasks.length > index) { + this.tasks[index] = this.choiceTasks[index] + } + this.cropFrontShows.fill(false) + this.cropMedias = this.tempCropMedias.map((item: Resource) => { + return item + }) }) - }) + } }) } .width('100%')