1/* 2 * Copyright (c) 2025 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16import XComponentContext from '../../interface/XComponentContext'; 17 18@Entry 19@Component 20struct MatrixDrawing { 21 private xComponentContext: XComponentContext | undefined = undefined; 22 23 build() { 24 Column() { 25 XComponent({ id: 'basicEffectXComponent', type: XComponentType.SURFACE, libraryname: 'entry' }) 26 .onLoad((xComponentContext) => { 27 this.xComponentContext = xComponentContext as XComponentContext; 28 }) 29 .backgroundColor(Color.White) 30 .width('100%') 31 .height('70%') 32 Flex({ 33 direction: FlexDirection.Row, 34 wrap: FlexWrap.Wrap, 35 justifyContent: FlexAlign.Start, 36 alignItems: ItemAlign.Start 37 }) { 38 Button($r('app.string.DrawingMatrixBasic')) 39 .onClick((): void => { 40 if (this.xComponentContext) { 41 this.xComponentContext.draw('CanvasGet', 'MatrixBasic'); 42 } 43 }) 44 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 45 Button($r('app.string.DrawingTranslation')) 46 .onClick((): void => { 47 if (this.xComponentContext) { 48 this.xComponentContext.draw('CanvasGet', 'TranslationOperation'); 49 } 50 }) 51 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 52 Button($r('app.string.DrawingPreTranslation')) 53 .onClick((): void => { 54 if (this.xComponentContext) { 55 this.xComponentContext.draw('CanvasGet', 'PreTranslationOperation'); 56 } 57 }) 58 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 59 Button($r('app.string.DrawingPostTranslation')) 60 .onClick((): void => { 61 if (this.xComponentContext) { 62 this.xComponentContext.draw('CanvasGet', 'PostTranslationOperation'); 63 } 64 }) 65 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 66 Button($r('app.string.DrawingRotation')) 67 .onClick((): void => { 68 if (this.xComponentContext) { 69 this.xComponentContext.draw('CanvasGet', 'RotationOperation'); 70 } 71 }) 72 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 73 Button($r('app.string.DrawingPreRotation')) 74 .onClick((): void => { 75 if (this.xComponentContext) { 76 this.xComponentContext.draw('CanvasGet', 'PreRotationOperation'); 77 } 78 }) 79 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 80 Button($r('app.string.DrawingPostRotation')) 81 .onClick((): void => { 82 if (this.xComponentContext) { 83 this.xComponentContext.draw('CanvasGet', 'PostRotationOperation'); 84 } 85 }) 86 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 87 Button($r('app.string.DrawingScale')) 88 .onClick((): void => { 89 if (this.xComponentContext) { 90 this.xComponentContext.draw('CanvasGet', 'ScaleOperation'); 91 } 92 }) 93 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 94 Button($r('app.string.DrawingPreScale')) 95 .onClick((): void => { 96 if (this.xComponentContext) { 97 this.xComponentContext.draw('CanvasGet', 'PreScaleOperation'); 98 } 99 }) 100 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 101 Button($r('app.string.DrawingPostScale')) 102 .onClick((): void => { 103 if (this.xComponentContext) { 104 this.xComponentContext.draw('CanvasGet', 'PostScaleOperation'); 105 } 106 }) 107 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 108 Button($r('app.string.DrawingConcat')) 109 .onClick((): void => { 110 if (this.xComponentContext) { 111 this.xComponentContext.draw('CanvasGet', 'ConcatOperation'); 112 } 113 }) 114 .margin({ top: 5, bottom: 5, left: 5, right: 5 }) 115 } 116 .width('100%') 117 .height('30%') 118 } 119 } 120}