鸿蒙框架代码功能修改

GaiaXHarmony/GXStretchBinding/GXStretch/src/main/ets/stretch/Node.ts

@@ -6,7 +6,10 @@ import hilog from '@ohos.hilog';
 
 export class Node {
   ptr?: number | null = null;
+  // 经过处理后的样式，可能在复用过程中被改写。
   style?: Style | null = null;
+  // 保存css中的样式
+  cssStyle?: Style | null = null;
   // 父节点
   parent: Node | null = null;
   children: Node[];
@@ -16,6 +19,7 @@ export class Node {
   }
 
   constructor(style: Style, children: Node[] = []) {
+    this.cssStyle = style.clone();
     if (!style.isInit) {
       style.init()
     }

GaiaXHarmony/GXStretchBinding/GXStretch/src/main/ets/stretch/Style.ts

@@ -81,6 +81,16 @@ export class Size<T> {
     this.width = width
     this.height = height
   }
+
+  clone(): Size<T> {
+    let size;
+    if (this.width instanceof Dim && this.height instanceof Dim) {
+      size = new Size(this.width.clone(), this.height.clone())
+    } else {
+      size = new Size(this.width, this.height)
+    }
+    return size
+  }
 }
 
 export class Rect<T> {
@@ -95,6 +105,17 @@ export class Rect<T> {
     this.top = top
     this.bottom = bottom
   }
+
+
+  clone(): Rect<T> {
+    let size;
+    if (this.start instanceof Dim && this.end instanceof Dim && this.top instanceof Dim && this.bottom instanceof Dim) {
+      size = new Rect(this.start.clone(), this.end.clone(), this.top.clone(), this.bottom.clone())
+    } else {
+      size = new Rect(this.start, this.end, this.top, this.bottom)
+    }
+    return size
+  }
 }
 
 export class Dim {
@@ -105,6 +126,11 @@ export class Dim {
     this.type = type
     this.value = value
   }
+
+  clone(): Dim {
+    let dim = new Dim(this.type, this.value)
+    return dim
+  }
 }
 
 export class DimPoints extends Dim {
@@ -151,8 +177,8 @@ export class Style {
   margin: Rect<Dim> = new Rect(Undefined, Undefined, Undefined, Undefined);
   padding: Rect<Dim> = new Rect(Undefined, Undefined, Undefined, Undefined);
   border: Rect<Dim> = new Rect(Undefined, Undefined, Undefined, Undefined);
-  flexGrow: number = 0.0;
-  flexShrink: number = 1.0;
+  flexGrow: number = 0;
+  flexShrink: number = 0;
   flexBasis: Dim = Auto;
   size: Size<Dim> = new Size(Auto, Auto);
   minSize: Size<Dim> = new Size(Auto, Auto);
@@ -174,8 +200,8 @@ export class Style {
     margin: Rect<Dim> = new Rect(Undefined, Undefined, Undefined, Undefined),
     padding: Rect<Dim> = new Rect(Undefined, Undefined, Undefined, Undefined),
     border: Rect<Dim> = new Rect(Undefined, Undefined, Undefined, Undefined),
-    flexGrow: number = 0.0,
-    flexShrink: number = 1.0,
+    flexGrow: number = 0,
+    flexShrink: number = 0,
     flexBasis: Dim = Auto,
     size: Size<Dim> = new Size(Auto, Auto),
     minSize: Size<Dim> = new Size(Auto, Auto),
@@ -293,4 +319,30 @@ export class Style {
       this.isInit = false;
     }
   }
+
+  clone(): Style {
+    let style = new Style();
+    style.display =  this.display
+    style.positionType = this.positionType;
+    style.direction = this.direction;
+    style.flexDirection = this.flexDirection;
+    style.flexWrap = this.flexWrap;
+    style.overflow = this.overflow;
+    style.alignItems = this.alignItems;
+    style.alignSelf = this.alignSelf;
+    style.alignContent = this.alignContent;
+    style.justifyContent = this.justifyContent;
+    style.position = this.position.clone();
+    style.margin = this.margin.clone();
+    style.padding = this.padding.clone();
+    style.border = this.border.clone();
+    style.flexGrow = this.flexGrow;
+    style.flexShrink = this.flexShrink;
+    style.flexBasis = this.flexBasis;
+    style.size = this.size.clone();
+    style.minSize = this.minSize.clone();
+    style.maxSize = this.maxSize.clone();
+    style.aspectRatio = this.aspectRatio;
+    return style;
+  }
 }

GaiaXHarmony/GaiaXCore/GaiaX/BuildProfile.ets

@@ -1,6 +1,17 @@
+/**
+ * Use these variables when you tailor your ArkTS code. They must be of the const type.
+ */
+export const HAR_VERSION = '1.0.0';
+export const BUILD_MODE_NAME = 'debug';
+export const DEBUG = true;
+export const TARGET_NAME = 'default';
+
+/**
+ * BuildProfile Class is used only for compatibility purposes.
+ */
 export default class BuildProfile { 
-	static readonly HAR_VERSION = '1.0.0';
-	static readonly BUILD_MODE_NAME = 'debug';
-	static readonly DEBUG = true;
-	static readonly TARGET_NAME = 'default';
+	static readonly HAR_VERSION = HAR_VERSION;
+	static readonly BUILD_MODE_NAME = BUILD_MODE_NAME;
+	static readonly DEBUG = DEBUG;
+	static readonly TARGET_NAME = TARGET_NAME;
 }

GaiaXHarmony/GaiaXCore/GaiaX/src/main/ets/GXTemplateEngine.ets

@@ -19,7 +19,7 @@ import GXRawFileTemplateSource from './source/GXRawFileTemplateSource';
 import GXRegisterCenter from './GXRegisterCenter';
 import { configAnalyzeIfNeeded } from 'GaiaXAnalyze';
 import { Stretch } from 'gxstretch';
-import { GXInjector,GXImageBuilderParams } from './components/injector/GXInjector';
+import { GXInjector, GXInjectorBuilderParams } from './components/injector/GXInjector';
 
 export default class GXTemplateEngine {
   static instance = new GXTemplateEngine();
@@ -38,9 +38,13 @@ export default class GXTemplateEngine {
     }
   }
 
-  registerImage(imageBuilder:WrappedBuilder<[GXImageBuilderParams]>) {
+  registerImage(imageBuilder: WrappedBuilder<[GXInjectorBuilderParams]>) {
     GXInjector.instance.registerImage(imageBuilder)
   }
+
+  registerCustomView(customViewBuilder: WrappedBuilder<[GXInjectorBuilderParams]>) {
+    GXInjector.instance.registerCustomView(customViewBuilder)
+  }
 }
 
 

GaiaXHarmony/GaiaXCore/GaiaX/src/main/ets/binding/GXRenderManager.ets

@@ -105,10 +105,10 @@ export default class GXRenderManager {
    * 计算和绑定布局
    * @param node
    */
-  static computeAndApplyLayout(node: GXNode) {
+  static computeAndApplyLayout(node: GXNode, isSpecialUpdate: boolean = false) {
     const layout = GXRenderManager.computeLayout(node);
     if (layout != null) {
-      node.applyLayout(layout);
+      node.applyLayout(layout, isSpecialUpdate);
     }
   }
 

GaiaXHarmony/GaiaXCore/GaiaX/src/main/ets/components/GXCustomView.ets

@@ -0,0 +1,156 @@
+/*
+ * Copyright (c) 2021, Alibaba Group Holding Limited;
+ *
+ * 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 GXTemplateContext from '../context/GXTemplateContext'
+import { GXCustomViewBuilderParams, GXInjector } from './injector/GXInjector'
+import GXCustomViewNode from '../node/GXCustomViewNode'
+import { Node } from 'gxstretch';
+
+@Component
+export struct GXCustomView {
+  // 节点属性
+  @Prop node: GXCustomViewNode
+  @Prop gxContext: GXTemplateContext;
+
+  // 创建自定义组件的新实例后，执行其build()函数之前调用
+  aboutToAppear(): void {
+
+  }
+
+  // 析构之前调用，用于free节点和rust指针
+  aboutToDisappear(): void {
+
+  }
+
+  build() {
+    // buildCustomView(this.node);
+    if (GXInjector.instance.injectedCustomView() != null) {
+      Row() {
+        GXInjector.instance.injectedCustomView()?.builder(new GXCustomViewBuilderParams(this.node.data, this.node.className))
+      }
+      .id(this.node.nodeId)
+      .position({ x: this.node.x, y: this.node.y })
+      .size({ width: this.node.width, height: this.node.height })
+      .opacity(this.node.opacity)
+      .shadow(this.node.boxShadow)
+      .borderWidth(this.node.borderWidth)
+      .borderColor(this.node.borderColor)
+      .borderRadius(this.node.borderRadius)
+      .backgroundColor(this.node.backgroundColor)
+      .backgroundImage(this.node.backgroundImage)
+      .linearGradient({
+        direction: this.node.linearGradientDirection,
+        colors: this.node.linearGradientColors
+      })
+      .onClick(() => { // 执行事件
+        this.node.handleEvent(this.node.clickEvent);
+      })
+      .onTouchIntercept(() => { // 调用onTouchIntercept修改该组件的HitTestMode属性
+        return this.node.getHitTestMode();
+      })
+    } else {
+      Text(this.node.className)
+        .fontSize("12fp")
+        .fontColor("red")
+        .id(this.node.nodeId)
+        .position({ x: this.node.x, y: this.node.y })
+        .size({ width: this.node.width, height: this.node.height })
+        .opacity(this.node.opacity)
+        .shadow(this.node.boxShadow)
+        .borderWidth(this.node.borderWidth)
+        .borderColor(this.node.borderColor)
+        .borderRadius(this.node.borderRadius)
+        .backgroundColor(this.node.backgroundColor)
+        .backgroundImage(this.node.backgroundImage)
+        .linearGradient({
+          direction: this.node.linearGradientDirection,
+          colors: this.node.linearGradientColors
+        })
+        .clip(this.node.clip)// 子视图超出父视图进行裁剪
+          // .backdropBlur(3) // 毛玻璃效果
+          // .clip(new Circle({ width: '280px', height: '280px' }))
+          // .mask(new Circle({ width: '280px', height: '280px' }).fill(Color.Gray))
+        .onClick(() => { // 执行事件
+          this.node.handleEvent(this.node.clickEvent);
+        })
+        .onTouchIntercept(() => { // 调用onTouchIntercept修改该组件的HitTestMode属性
+          return this.node.getHitTestMode();
+        })
+        .onAppear(() => {
+        })
+    }
+  }
+}
+
+
+@Builder
+export function buildCustomView(node: GXCustomViewNode) {
+  if (GXInjector.instance.injectedCustomView() != null) {
+    Row() {
+      GXInjector.instance.injectedCustomView()?.builder(new GXCustomViewBuilderParams(node.data, node.className))
+    }
+    .id(node.nodeId)
+    .position({ x: node.x, y: node.y })
+    .size({ width: node.width, height: node.height })
+    .opacity(node.opacity)
+    .shadow(node.boxShadow)
+    .borderWidth(node.borderWidth)
+    .borderColor(node.borderColor)
+    .borderRadius(node.borderRadius)
+    .backgroundColor(node.backgroundColor)
+    .backgroundImage(node.backgroundImage)
+    .linearGradient({
+      direction: node.linearGradientDirection,
+      colors: node.linearGradientColors
+    })
+    .onClick(() => { // 执行事件
+      node.handleEvent(node.clickEvent);
+    })
+    .onTouchIntercept(() => { // 调用onTouchIntercept修改该组件的HitTestMode属性
+      return node.getHitTestMode();
+    })
+  } else {
+    Text(node.className)
+      .fontSize("12fp")
+      .fontColor("red")
+      .id(node.nodeId)
+      .position({ x: node.x, y: node.y })
+      .size({ width: node.width, height: node.height })
+      .opacity(node.opacity)
+      .shadow(node.boxShadow)
+      .borderWidth(node.borderWidth)
+      .borderColor(node.borderColor)
+      .borderRadius(node.borderRadius)
+      .backgroundColor(node.backgroundColor)
+      .backgroundImage(node.backgroundImage)
+      .linearGradient({
+        direction: node.linearGradientDirection,
+        colors: node.linearGradientColors
+      })
+      .clip(node.clip)// 子视图超出父视图进行裁剪
+        // .backdropBlur(3) // 毛玻璃效果
+        // .clip(new Circle({ width: '280px', height: '280px' }))
+        // .mask(new Circle({ width: '280px', height: '280px' }).fill(Color.Gray))
+      .onClick(() => { // 执行事件
+        node.handleEvent(node.clickEvent);
+      })
+      .onTouchIntercept(() => { // 调用onTouchIntercept修改该组件的HitTestMode属性
+        return node.getHitTestMode();
+      })
+      .onAppear(() => {
+      })
+  }
+}

GaiaXHarmony/GaiaXCore/GaiaX/src/main/ets/components/GXGridView.ets

@@ -96,7 +96,6 @@ export default struct GXGridView {
     .padding(this.node.contentInset)
     // .enableScrollInteraction(false) // scrollEnable
     .onScrollIndex((first: number) => {
-      console.info(first.toString())
     })
   }
 }

GaiaXHarmony/GaiaXCore/GaiaX/src/main/ets/components/GXImage.ets

@@ -114,6 +114,11 @@ export function buildImage(node: GXImageNode) {
     .borderColor(node.borderColor)
     .borderRadius(node.borderRadius)
     .backgroundColor(node.backgroundColor)
+    .backgroundImage(node.backgroundImage)
+    .linearGradient({
+      direction: node.linearGradientDirection,
+      colors: node.linearGradientColors
+    })
     .onClick(() => { // 执行事件
       console.log("Column click");
       node.handleEvent(node.clickEvent);
@@ -134,14 +139,16 @@ export function buildImage(node: GXImageNode) {
       .borderColor(node.borderColor)
       .borderRadius(node.borderRadius)
       .backgroundColor(node.backgroundColor)
+      .backgroundImage(node.backgroundImage)
+      .linearGradient({
+        direction: node.linearGradientDirection,
+        colors: node.linearGradientColors
+      })
       .onComplete(() => {
-        console.log('load image complete');
       })
       .onError(() => {
-        console.log('load image fail');
       })
       .onClick(() => { // 执行事件
-        console.log("Column click");
         node.handleEvent(node.clickEvent);
       })
       .onTouchIntercept(() => { // 调用onTouchIntercept修改该组件的HitTestMode属性

GaiaXHarmony/GaiaXCore/GaiaX/src/main/ets/components/GXRichText.ets

@@ -74,7 +74,6 @@ export function buildRichText(node: GXRichTextNode){
   .width(node.width)
   .height(node.height)
   .onClick(() => { // 执行事件
-    console.log("Column click");
     node.handleEvent(node.clickEvent);
   })
   .onTouchIntercept(() => { // 调用onTouchIntercept修改该组件的HitTestMode属性

GaiaXHarmony/GaiaXCore/GaiaX/src/main/ets/components/GXRootView.ets

@@ -77,8 +77,11 @@ export function buildRootView(node: GXRootNode, context: GXTemplateContext) {
   .borderColor(node.borderColor)
   .backgroundColor(node.backgroundColor)
   .backgroundImage(node.backgroundImage)
+  .linearGradient({
+    direction: node.linearGradientDirection,
+    colors: node.linearGradientColors
+  })
   .onClick(() => { // 执行事件
-    console.log("Column click");
     node.handleEvent(node.clickEvent);
   })
   .onTouchIntercept(() => { // 调用onTouchIntercept修改该组件的HitTestMode属性