@shijiu/jsview-vue 1.9.650 → 1.9.720

package/utils/JsViewVueWidget/JsvApic/JsvApic.vue

@@ -20,7 +20,7 @@
  *          play(): 开始播放
 -->
 <script>
-import { ForgeExtension } from "../../../dom/jsv-forge-define";
+import { ForgeExtension } from "../../../../jsview/dom/jsv-forge-define";
 
 let LOOP_DEFAULT = 0;
 let LOOP_INFINITE = 1;
@@ -68,7 +68,7 @@ export default {
   methods: {
     play() {
       if (this.$refs.element) {
-        let main_view = this.$refs.element.jsvMainView;
+        let main_view = this.$refs.element.jsvGetProxyView();
         if (main_view && main_view.ChildViews.length > 0) {
           let target_view = main_view.ChildViews[0];
           if (
@@ -106,7 +106,7 @@ export default {
     },
     stop() {
       if (this.$refs.element) {
-        let main_view = this.$refs.element.jsvMainView;
+        let main_view = this.$refs.element.jsvGetProxyView();
         if (main_view && main_view.ChildViews.length > 0) {
           let target_view = main_view.ChildViews[0];
           if (
@@ -130,7 +130,7 @@ export default {
     }
     if (this.onLoad) {
       if (this.$refs.element) {
-        let main_view = this.$refs.element.jsvMainView;
+        let main_view = this.$refs.element.jsvGetProxyView();
         if (main_view && main_view.ChildViews.length > 0) {
           let target_view = main_view.ChildViews[0];
           if (
@@ -151,7 +151,7 @@ export default {
   beforeUnmount() {
     this.stop();
     if (this.$refs.element) {
-      let main_view = this.$refs.element.jsvMainView;
+      let main_view = this.$refs.element.jsvGetProxyView();
       if (main_view && main_view.ChildViews.length > 0) {
         let target_view = main_view.ChildViews[0];
         if (

package/utils/JsViewVueWidget/JsvFilterView.vue

@@ -11,7 +11,7 @@
  *                                "gray-down": 黑白滤镜(公祭日滤镜)
 -->
 <script setup>
-import { Forge, ForgeExtension } from "../../dom/jsv-forge-define";
+import { Forge, ForgeExtension } from "../../../jsview/dom/jsv-forge-define";
 import { onBeforeUnmount, watchEffect } from "vue";
 
 const props = defineProps({

package/utils/JsViewVueWidget/JsvGrid.vue

@@ -66,7 +66,7 @@
 -->
 <script>
 import { reactive } from "vue";
-import { EdgeDirection } from "jsview/utils/JsViewEngineWidget";
+import { EdgeDirection, FocusMoveType } from "../JsViewEngineWidget";
 
 const TAG = "JsvGrid";
 
@@ -93,15 +93,7 @@ class LineType extends UpdateType {
   }
 }
 
-const FocusMoveType = {
-  NO_ADJUST: 0x00000000,
-  COLUMN_LOOP: 0x00000001,
-  ROW_LOOP: 0x00000001 << 1,
-  COLUMN_FIND_NEAR: 0x00000001 << 2,
-  ROW_FIND_NEAR: 0x00000001 << 3,
-};
-
-export { PageType, LineType, FocusMoveType };
+export { PageType, LineType };
 
 export default {
   props: {
@@ -668,4 +660,4 @@ export default {
       ></slot>
     </div>
   </jsv-focus-block>
-</template>
+</template>

package/utils/JsViewVueWidget/JsvInput/Cursor.vue

@@ -2,11 +2,11 @@
  * @Author: ChenChanghua
  * @Date: 2022-01-20 10:37:01
  * @LastEditors: ChenChanghua
- * @LastEditTime: 2022-01-20 17:07:17
+ * @LastEditTime: 2022-09-02 13:28:59
  * @Description: file content
 -->
 <script>
-import { ref } from "vue";
+import { ref, shallowRef } from "vue";
 export default {
   props: {
     left: Number,
@@ -39,7 +39,9 @@ export default {
       this.visible = show;
     },
   },
-  mounted() {},
+  mounted() {
+    this.startBlink();
+  },
   beforeUnmount() {
     this._cleanInterval();
   },

package/utils/JsViewVueWidget/JsvInput/JsvInput.vue

@@ -2,12 +2,12 @@
  * @Author: ChenChanghua
  * @Date: 2022-01-20 10:35:56
  * @LastEditors: ChenChanghua
- * @LastEditTime: 2022-02-21 10:17:42
+ * @LastEditTime: 2022-09-02 13:44:56
  * @Description: file content
 -->
 <script>
-import { EdgeDirection } from "jsview/utils/JsViewEngineWidget";
-import { Forge, ForgeExtension } from "../../../dom/jsv-forge-define";
+import { EdgeDirection } from "../../JsViewEngineWidget";
+import { Forge, ForgeExtension } from "../../../../jsview/dom/jsv-forge-define";
 import CursorVue from "./Cursor.vue";
 
 const InputType = {
@@ -228,9 +228,9 @@ export default {
           !ifDigital(add_text) &&
           this.type === InputType.NUMBER
         ) {
-          console.log(
-            `onTextChanged add text failed, add_text:${add_text}, when input type is number!`
-          );
+          // console.log(
+          //   `onTextChanged add text failed, add_text:${add_text}, when input type is number!`
+          // );
           if (this.editControlView) {
             this.editControlView.updateCursorOffset(
               this.fullString,
@@ -255,7 +255,7 @@ export default {
 
     // 1:shown 0:hidden
     _onStatusChanged(status) {
-      console.log("OnStatusChanged status", status);
+      // console.log("OnStatusChanged status", status);
     },
 
     _getStringWithFont(str) {
@@ -327,7 +327,7 @@ export default {
 
     add(string) {
       if (this.type === InputType.NUMBER && !ifDigital(string)) {
-        console.log(`The input data:${string} is not number`);
+        // console.log(`The input data:${string} is not number`);
         return;
       }
       const pre_full_str = this.fullString;
@@ -573,8 +573,9 @@ export default {
     },
 
     onFocus() {
-      console.log("Input Focus");
+      // console.log("Input Focus");
       this.isFocus = true;
+      this.$refs.cursor?.startBlink();
       if (this.editControlView && !this.readonly) {
         this.editControlView.showIme(
           this.type,
@@ -586,7 +587,7 @@ export default {
 
     onBlur() {
       this.isFocus = false;
-      console.log("Input Blur");
+      // console.log("Input Blur");
       if (this.editControlView && !this.readonly) {
         this.editControlView.hideIme();
       }
@@ -604,9 +605,7 @@ export default {
       }
       this.clearCursorPauseTimer();
       this.cursorPauseTimeoutToken = setTimeout(() => {
-        if (this.$refs.cursor) {
-          this.$refs.cursor?.startBlink();
-        }
+        this.$refs.cursor?.startBlink();
       }, 500);
     },
     onKeyDown(keyEvent) {
@@ -731,7 +730,9 @@ export default {
     this.textWidth = cur_position > this.width ? cur_position : this.width;
     this.textLeft = this._calculateSlide("", this.value, this.value.length);
   },
-  mounted() {},
+  mounted() {
+    this.$refs.cursor?.startBlink();
+  },
   beforeUnmount() {
     if (this.editControlViewId != -1) {
       const view_store = ForgeExtension.RootActivity

package/utils/JsViewVueWidget/JsvMarquee.vue

@@ -3,239 +3,212 @@
  * JsvMarquee：Vue高阶组件，文字跑马灯
  *      props说明:
  *          text          {String}   文字内容
- *          layoutStyles  {Array|Object}   控件位置信息 [{top: 0, left: 0, width: 0, height: 0}]
- *          fontStyles    {Array|Object}   文字样式
+ *          style         {Object}   样式
  *          slideSpeed    {int}      滚动速度 px/s, 默认60
  *          forceSlide    {boolean}  短文字是否滚动，默认false
 -->
 
-<script>
-import { Forge } from "../../dom/jsv-forge-define";
-import {
-  JsvStyleClass,
-  JsvTextStyleClass,
-  combinedStyles,
-} from "../JsViewVueTools/JsvStyleClass";
+<script setup>
+import { Forge } from "../../../jsview/dom/jsv-forge-define";
+import { getTextWidth } from "./utils";
+import { ref, shallowRef, computed, toRaw, onMounted, onBeforeUnmount } from "vue";
 
-const sDefaultLayoutStyle = new JsvStyleClass({
-  left: 0,
-  top: 0,
-  width: 0,
-  height: 20,
-});
-const sDefaultFontStyle = new JsvTextStyleClass({
-  color: "rgba(255,255,255,1.0)",
-  fontSize: 10,
-  textAlign: "center",
-  lineHeight: "20px",
-});
-const sCommonFontStyle = new JsvTextStyleClass({
-  whiteSpace: "nowrap",
-});
-export default {
-  props: {
-    text: {
-      type: String,
-      default: "",
-    },
-    layoutStyles: {
-      type: [Array, Object],
-      default: () => [sDefaultLayoutStyle],
-    },
-    fontStyles: {
-      type: [Array, Object],
-    },
-    styleToken: String,
-    slideSpeed: {
-      // 60px per second
-      type: Number,
-      default: 60,
-    },
-    forceSlide: {
-      type: Boolean,
-      default: false,
-    },
-    className: {
-      type: String,
+const defaultFontStyle = () => {
+  return {
+    color: "rgba(255,255,255,1.0)",
+    fontSize: 10,
+    textAlign: "start",
+    lineHeight: "20px",
+    whiteSpace: "nowrap",
+    direction: 'ltr'
+  };
+};
+const props = defineProps({
+  text: {
+    type: String,
+    default: "",
+  },
+  style: {
+    type: Object,
+    default() {
+      return {
+        left: 0,
+        top: 0,
+        width: 0,
+        height: 20,
+        color: "rgba(255,255,255,1.0)",
+        fontSize: 10,
+        textAlign: "start",
+        lineHeight: "20px",
+        whiteSpace: "nowrap",
+        direction: 'ltr,'
+      };
     },
   },
-  data() {
-    return {
-      asyncTextLenTimer: -1,
-      rollTimeId: -1,
-      animationCount: 0,
-      LayoutStyle: null,
-      FontStyle: null,
-      FontStyleClass: null,
-      TokenProcessed: null,
-    };
+  slideSpeed: {
+    type: Number,
+    default: 60,
   },
-  setup() {},
-  computed: {
-    _className() {
-      return this.FontStyleClass ? this.FontStyleClass : this.className;
-    },
+  forceSlide: {
+    type: Boolean,
+    default: false,
   },
-  methods: {
-    _asyncStartSlider() {
-      // 清理之前的Slider处理
-      this._resetSlider();
+});
+const slideDiv = shallowRef(null);
+const textDiv = shallowRef(null);
+let animState = 0;
+let animIdleHandler = -1;
+let asyncStartHandler = -1;
+const fontStyle = computed(() => {
+  let { left, top, width, height, ...rest } = props.style;
+  let r = defaultFontStyle();
+  Object.assign(r, rest);
+  if (props.forceSlide) {
+    //滚送时必需start对齐
+    r.textAlign = "start";
+  }
+  return r;
+});
+//rtl文字需要先获得文字宽度
+let textWidth =
+  fontStyle.value.direction == "rtl" ? getTextWidth(props.text, fontStyle.value) : 0;
+const slideDivLeft = computed(() =>
+  fontStyle.value.direction == "rtl" && props.style.width < textWidth
+    ? props.style.width - textWidth
+    : 0
+);
 
-      // 稍进行延迟，以等待JsView的native端描绘文字并回传文字宽度
-      if (this.asyncTextLenTimer < 0) {
-        this.asyncTextLenTimer = setTimeout(() => {
-          if (
-            this.forceSlide ||
-            this.$refs.textRef.clientWidth > this.LayoutStyle.width
-          ) {
-            this._slideNextStep();
-          }
-          this.asyncTextLenTimer = -1;
-        }, 500);
-      }
-    },
-    _resetSlider() {
-      if (this.rollTimeId >= 0) {
-        clearTimeout(this.rollTimeId);
-        this.rollTimeId = -1;
-      }
-      this.animationCount = 0;
-      this.$refs.sliderRef?.jsvMaskView?.StopAnimation();
-    },
-    _slideNextStep() {
-      const text_width = this.$refs.textRef.clientWidth;
-      if (this.animationCount % 2 === 0) {
-        // 文字从原始位置，向左移动出屏幕(每次完整移动，停顿1秒)
-        this.rollTimeId = setTimeout(() => {
-          this.rollTimeId = -1;
-          const anim = new Forge.TranslateFrameAnimation(
-            0,
-            -text_width,
-            this.$props.slideSpeed,
-            true,
-            0,
-            0
-          );
-          anim.SetAnimationListener(
-            new Forge.AnimationListener(
-              null,
-              (ended) => {
-                if (ended) {
-                  // 正常结束，非Cancel时，进行下一个动作
-                  this._slideNextStep();
-                }
-              },
-              null
-            )
-          );
-          anim.Enable(Forge.AnimationEnable.ReleaseAfterEndCallback);
-          this.$refs.sliderRef.jsvMaskView.StartAnimation(anim);
-          this.animationCount += 1;
-        }, 1000);
-      } else {
-        // 文字从右边屏幕外部，移动回屏幕中的文字原始位置
-        const anim = new Forge.TranslateFrameAnimation(
-          this.LayoutStyle.width,
-          0,
-          this.$props.slideSpeed,
-          true,
-          this.LayoutStyle.width,
-          0
-        );
-        anim.SetAnimationListener(
-          new Forge.AnimationListener(
-            null,
-            (ended) => {
-              if (ended) {
-                // 正常结束，非Cancel时，进行下一个动作
-                this._slideNextStep();
-              }
-            },
-            null
-          )
-        );
-        this.$refs.sliderRef.jsvMaskView.StartAnimation(anim);
-        this.animationCount += 1;
-      }
-    },
-    _AnalyzeStyleChange() {
-      if (this.$props.styleToken !== this.TokenProcessed) {
-        // Token变化时，重新解析style array
-        let style_list;
-        if (this.layoutStyles instanceof Array) {
-          style_list = this.layoutStyles;
-        } else {
-          style_list = [this.layoutStyles];
-        }
-        const layout_set = combinedStyles(style_list, true);
-        this.LayoutStyle = layout_set.combinedStyle;
-        if (this.fontStyles) {
-          if (this.fontStyles instanceof Array) {
-            if (this.fontStyles[0] instanceof JsvStyleClass) {
-              style_list = [...this.fontStyles, sCommonFontStyle];
-            } else {
-              style_list = this.fontStyles.map(
-                (item) => new JsvStyleClass(item)
-              );
-              style_list.push(sCommonFontStyle);
+const slideStep = () => {
+  if (animState == 0) {
+    // 文字从原始位置，移动出屏幕(每次完整移动，停顿1秒)
+    let start = 0,
+      end = fontStyle.value.direction == "rtl" ? textWidth : -textWidth;
+    animIdleHandler = setTimeout(() => {
+      animIdleHandler = -1;
+      const anim = new Forge.TranslateFrameAnimation(
+        start,
+        end,
+        props.slideSpeed,
+        true,
+        0,
+        0
+      );
+      anim.SetAnimationListener(
+        new Forge.AnimationListener(
+          null,
+          (ended) => {
+            if (ended) {
+              // 正常结束，非Cancel时，进行下一个动作
+              slideStep();
             }
-          } else {
-            style_list = [
-              this.fontStyles instanceof JsvStyleClass
-                ? this.fontStyles
-                : new JsvStyleClass(this.fontStyles),
-              sCommonFontStyle,
-            ];
+          },
+          null
+        )
+      );
+      anim.Enable(Forge.AnimationEnable.ReleaseAfterEndCallback);
+      toRaw(slideDiv.value).jsvGetProxyView(true).StartAnimation(anim);
+      animState = 1;
+    }, 1000);
+  } else {
+    // 文字从屏幕外部，移动回屏幕中的文字原始位置
+    let start =
+        fontStyle.value.direction == "rtl" ? -props.style.width : props.style.width,
+      end = 0;
+    const anim = new Forge.TranslateFrameAnimation(
+      start,
+      end,
+      props.slideSpeed,
+      true,
+      props.style.width,
+      0
+    );
+    anim.SetAnimationListener(
+      new Forge.AnimationListener(
+        null,
+        (ended) => {
+          if (ended) {
+            // 正常结束，非Cancel时，进行下一个动作
+            slideStep();
           }
-          const font_set = combinedStyles(style_list);
-          this.FontStyle = font_set.combinedStyle;
-          this.FontStyleClass = font_set.combinedClass;
-        }
+        },
+        null
+      )
+    );
+    toRaw(slideDiv.value.jsvGetProxyView(true)).StartAnimation(anim);
+    animState = 0;
+  }
+};
 
-        if (this.FontStyleClass && this.FontStyleClass.length === 0) {
-          this.FontStyleClass = null;
-        }
-        this.TokenProcessed = this.styleToken;
-      }
-    },
-  },
-  created() {
-    this._AnalyzeStyleChange();
-  },
-  mounted() {
-    this._asyncStartSlider();
-  },
-  unmounted() {
-    // 清理所有异步处理，并停止Slider动作
-    if (this.asyncTextLenTimer >= 0) {
-      clearTimeout(this.asyncTextLenTimer);
-      this.asyncTextLenTimer = -1;
+const stopSlide = () => {
+  if (animIdleHandler > 0) {
+    clearTimeout(animIdleHandler);
+    animIdleHandler = -1;
+  }
+  animState = 0;
+  toRaw(slideDiv.value?.jsvGetProxyView(true))?.StopAnimation();
+};
+
+const asyncStartAnim = () => {
+  stopSlide();
+  // 稍进行延迟，以等待JsView的native端描绘文字并回传文字宽度
+  if (asyncStartHandler > 0) {
+    clearTimeout(asyncStartHandler);
+  }
+  asyncStartHandler = setTimeout(() => {
+    if (textWidth <= 0) {
+      textWidth = textDiv.value.clientWidth;
     }
-    this._resetSlider();
-  },
+    if (props.forceSlide || textWidth > props.style.width) {
+      slideStep();
+    }
+    asyncStartHandler = -1;
+  }, 500);
 };
+
+onMounted(() => {
+  if (fontStyle.value.direction == "ltr") {
+    //普通的ltr文字异步通过clientWidth获取文字宽度
+    asyncStartAnim();
+  } else {
+    if (props.forceSlide || textWidth > props.style.width) {
+      slideStep();
+    }
+  }
+});
+
+onBeforeUnmount(() => {
+  clearTimeout(asyncStartHandler);
+  asyncStartHandler = -1;
+  stopSlide();
+});
 </script>
 
 <template>
-  <div :style="{ ...LayoutStyle, overflow: 'hidden' }">
+  <div
+    :style="{
+      left: style.left,
+      top: style.top,
+      width: style.width,
+      height: style.height,
+      overflow: 'hidden',
+    }"
+  >
     <div
-      ref="sliderRef"
+      ref="slideDiv"
       :style="{
-        left: 0,
+        left: slideDivLeft,
         top: 0,
-        width: LayoutStyle.width,
-        height: LayoutStyle.height,
+        width: style.width,
+        height: style.height,
       }"
     >
       <div
-        ref="textRef"
-        :className="_className"
-        :style="{ ...FontStyle, height: LayoutStyle.height }"
-        :jsv_text_align_minwidth="LayoutStyle.width"
-        jsv-inherit-class="2"
+        ref="textDiv"
+        :style="{ ...fontStyle, height: style.height }"
+        :jsv_text_align_minwidth="style.width"
       >
         {{ text }}
       </div>
     </div>
   </div>
-</template>
+</template>

package/utils/JsViewVueWidget/JsvMaskClipDiv.vue

@@ -12,7 +12,7 @@
  *
 -->
 <script>
-import { Forge, ForgeExtension } from "../../dom/jsv-forge-define";
+import { Forge, ForgeExtension } from "../../../jsview/dom/jsv-forge-define";
 export default {
   props: {
     class: {
@@ -110,7 +110,7 @@ export default {
       const canvas = window.originDocument.createElement("canvas");
       canvas.style.width = this.style.width + "px";
       canvas.style.height = this.style.height + "px";
-      this.$refs.innerView?.jsvMaskView.Element.appendChild(canvas);
+      this.$refs.innerView?.jsvGetProxyView(true).Element.appendChild(canvas);
 
       const clip_image = new Image();
       const bg_image = new Image();