@shijiu/jsview-vue 0.9.254 → 0.9.267

package/samples/TextShadowDemo/App.vue

@@ -1,98 +1,98 @@
-<!--
-* 当TextData数据中有blur为0（不显示阴影）时，为了测试会报“StyleFormatCheck.js?058c:447 textShadow: blur shadow above 0(now=2 2 0 #00FF00)”错误
--->
-<script>
-import JsvTextBox from "jsview/utils/JsViewVueWidget/JsvTextBox.vue";
-import { JsvTextStyleClass } from "jsview/utils/JsViewVueTools/JsvStyleClass";
-
-export default {
-  components: {
-    JsvTextBox,
-  },
-  data() {
-    return {
-      TextData: [
-        {
-          id: 0,
-          title: "偏移x,y为0(文字发光)",
-          textShadow: "0 0 3 #00FF00",
-        },
-        {
-          id: 1,
-          title: "blur为0(不显示阴影)",
-          textShadow: "2 2 0 #00FF00",
-        },
-        {
-          id: 2,
-          title: "rgba格式颜色(半透明红)",
-          textShadow: "4 4 3 rgba(255,0,0,0.5)",
-        },
-        {
-          id: 3,
-          title: "#格式颜色(蓝色)",
-          textShadow: "4 4 0.5 #0000EF",
-        },
-      ],
-      font_style: new JsvTextStyleClass({
-        fontSize: "35px",
-        textAlign: "center",
-        lineHeight: "40px",
-      }),
-    };
-  },
-  methods: {
-    onKeyDown(ev) {
-      if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
-        this.$router?.go(-1); // 有router时，是从DemoHomepage进入，回退
-      }
-      return true;
-    },
-  },
-};
-</script>
-
-<template>
-  <jsv-focus-block
-    autoFocus
-    :onAction="{
-      onKeyDown: onKeyDown,
-    }"
-  >
-    <div
-      v-for="item in TextData"
-      :key="item.id"
-      :style="{ left: 320 * item.id }"
-    >
-      <div>
-        <div
-          :style="{
-            width: 320,
-            height: 50,
-            fontSize: '25px',
-            textAlign: 'center',
-            lineHeight: '50px',
-            backgroundColor: item.id % 2 == 0 ? '#00ff00' : '#0000ff',
-          }"
-        >
-          {{ item.title }}
-        </div>
-        <JsvTextBox
-          :verticalAlign="'middle'"
-          :styleToken="'Fixed'"
-          :stylesList="[
-            font_style,
-            {
-              top: 50,
-              width: 320,
-              height: 70,
-              textShadow: item.textShadow,
-              backgroundColor: item.id % 2 == 0 ? '#ffffee' : '#ffff10',
-            },
-          ]"
-        >
-          文字阴影
-        </JsvTextBox>
-      </div>
-    </div>
-  </jsv-focus-block>
+<!--
+* 当TextData数据中有blur为0（不显示阴影）时，为了测试会报“StyleFormatCheck.js?058c:447 textShadow: blur shadow above 0(now=2 2 0 #00FF00)”错误
+-->
+<script>
+import JsvTextBox from "jsview/utils/JsViewVueWidget/JsvTextBox.vue";
+import { JsvTextStyleClass } from "jsview/utils/JsViewVueTools/JsvStyleClass";
+
+export default {
+  components: {
+    JsvTextBox,
+  },
+  data() {
+    return {
+      TextData: [
+        {
+          id: 0,
+          title: "偏移x,y为0(文字发光)",
+          textShadow: "0 0 3 #00FF00",
+        },
+        {
+          id: 1,
+          title: "blur为0(不显示阴影)",
+          textShadow: "2 2 0 #00FF00",
+        },
+        {
+          id: 2,
+          title: "rgba格式颜色(半透明红)",
+          textShadow: "4 4 3 rgba(255,0,0,0.5)",
+        },
+        {
+          id: 3,
+          title: "#格式颜色(蓝色)",
+          textShadow: "4 4 0.5 #0000EF",
+        },
+      ],
+      font_style: new JsvTextStyleClass({
+        fontSize: "35px",
+        textAlign: "center",
+        lineHeight: "40px",
+      }),
+    };
+  },
+  methods: {
+    onKeyDown(ev) {
+      if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
+        this.$router?.go(-1); // 有router时，是从DemoHomepage进入，回退
+      }
+      return true;
+    },
+  },
+};
+</script>
+
+<template>
+  <jsv-focus-block
+    autoFocus
+    :onAction="{
+      onKeyDown: onKeyDown,
+    }"
+  >
+    <div
+      v-for="item in TextData"
+      :key="item.id"
+      :style="{ left: 320 * item.id }"
+    >
+      <div>
+        <div
+          :style="{
+            width: 320,
+            height: 50,
+            fontSize: '25px',
+            textAlign: 'center',
+            lineHeight: '50px',
+            backgroundColor: item.id % 2 == 0 ? '#00ff00' : '#0000ff',
+          }"
+        >
+          {{ item.title }}
+        </div>
+        <JsvTextBox
+          :verticalAlign="'middle'"
+          :styleToken="'Fixed'"
+          :stylesList="[
+            font_style,
+            {
+              top: 50,
+              width: 320,
+              height: 70,
+              textShadow: item.textShadow,
+              backgroundColor: item.id % 2 == 0 ? '#ffffee' : '#ffff10',
+            },
+          ]"
+        >
+          文字阴影
+        </JsvTextBox>
+      </div>
+    </div>
+  </jsv-focus-block>
 </template>

package/samples/TextureSize/App.vue

@@ -1,142 +1,142 @@
-<script>
-import { Vue } from "vue-class-component";
-import jpegDemo from "./jpegDemo.jpeg";
-import pngDemo from "./pngDemo.png";
-import pngNoAlphaDemo from "./pngNoAlphaDemo.png";
-import bmpDemo from "./bmpDemo.bmp";
-
-class App extends Vue {
-  constructor(props) {
-    super(props);
-
-    this.jpegDemo = jpegDemo;
-    this.pngDemo = pngDemo;
-    this.pngNoAlphaDemo = pngNoAlphaDemo;
-    this.bmpDemo = bmpDemo;
-  }
-
-  onKeyDown(ev) {
-    // 8:Backspace, 27:Escape, 10000:盒子返回键
-    if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
-      if (window.JsView) {
-        window.JsView.setGlobalConfig({
-          texCache: -1,
-        });
-      }
-
-      this.$router?.go(-1); // 有router时，回退
-      return true;
-    }
-    return false;
-  }
-}
-export default App;
-</script>
-<template>
-  <jsv-focus-block autoFocus :onKeyDown="onKeyDown">
-    <div class="allBgc">
-      <div class="block">
-        <div :style="{ left: 0, top: 0 }">
-          <div class="leftFont top0">
-            {{ `原图加载\n内存占用由图片尺寸决定` }}
-          </div>
-          <div class="leftFont top250">
-            {{
-              `指定尺寸加载\n内存占用由给定尺寸决定，图片质量下降，但更省内存`
-            }}
-          </div>
-        </div>
-
-        <div :style="{ left: 220, top: 0 }">
-          <img alt="" class="graphSize top0" :src="bmpDemo" />
-          <img
-            alt=""
-            class="graphSize top250"
-            jsvImgScaledownTex
-            :src="bmpDemo"
-          />
-          <div class="underFont">
-            {{ `bmp图片\n指定尺寸噪点明显更大` }}
-          </div>
-        </div>
-
-        <div :style="{ left: 440, top: 0 }">
-          <img alt="" class="graphSize top0" :src="jpegDemo" />
-          <img
-            alt=""
-            class="graphSize top250"
-            jsvImgScaledownTex
-            :src="jpegDemo"
-          />
-          <div class="underFont">
-            {{ "jpg/jpeg图片" }}
-          </div>
-        </div>
-
-        <div :style="{ left: 660, top: 0 }">
-          <img alt="" class="graphSize top0" :src="pngDemo" />
-          <img
-            alt=""
-            class="graphSize top250"
-            jsvImgScaledownTex
-            :src="pngDemo"
-          />
-          <div class="underFont">
-            {{ `png有透明图片\n指定尺寸有明显锯齿` }}
-          </div>
-        </div>
-
-        <div :style="{ left: 880, top: 0 }">
-          <img alt="" class="graphSize top0" :src="pngNoAlphaDemo" />
-          <img
-            alt=""
-            class="graphSize top250"
-            jsvImgScaledownTex
-            :src="pngNoAlphaDemo"
-          />
-          <div class="underFont">
-            {{ `png无透明图片` }}
-          </div>
-        </div>
-      </div>
-    </div>
-  </jsv-focus-block>
-</template>
-<style scoped>
-.allBgc {
-  width: 1920;
-  height: 1080;
-  background-color: #334c4c;
-}
-.block {
-  left: 20;
-  top: 50;
-}
-.leftFont {
-  left: 0;
-  width: 210;
-  height: 200;
-  color: #ffffff;
-  font-size: 30px;
-}
-.top0 {
-  top: 0;
-}
-.top250 {
-  top: 250;
-}
-.graphSize {
-  left: 0;
-  width: 200;
-  height: 200;
-  border-radius: 15px 15px 15px 15px;
-}
-.underFont {
-  left: 0;
-  top: 500;
-  width: 200;
-  height: 200;
-  color: #ffffff;
-  font-size: 20px;
-}
+<script>
+import { Vue } from "vue-class-component";
+import jpegDemo from "./jpegDemo.jpeg";
+import pngDemo from "./pngDemo.png";
+import pngNoAlphaDemo from "./pngNoAlphaDemo.png";
+import bmpDemo from "./bmpDemo.bmp";
+
+class App extends Vue {
+  constructor(props) {
+    super(props);
+
+    this.jpegDemo = jpegDemo;
+    this.pngDemo = pngDemo;
+    this.pngNoAlphaDemo = pngNoAlphaDemo;
+    this.bmpDemo = bmpDemo;
+  }
+
+  onKeyDown(ev) {
+    // 8:Backspace, 27:Escape, 10000:盒子返回键
+    if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
+      if (window.JsView) {
+        window.JsView.setGlobalConfig({
+          texCache: -1,
+        });
+      }
+
+      this.$router?.go(-1); // 有router时，回退
+      return true;
+    }
+    return false;
+  }
+}
+export default App;
+</script>
+<template>
+  <jsv-focus-block autoFocus :onKeyDown="onKeyDown">
+    <div class="allBgc">
+      <div class="block">
+        <div :style="{ left: 0, top: 0 }">
+          <div class="leftFont top0">
+            {{ `原图加载\n内存占用由图片尺寸决定` }}
+          </div>
+          <div class="leftFont top250">
+            {{
+              `指定尺寸加载\n内存占用由给定尺寸决定，图片质量下降，但更省内存`
+            }}
+          </div>
+        </div>
+
+        <div :style="{ left: 220, top: 0 }">
+          <img alt="" class="graphSize top0" :src="bmpDemo" />
+          <img
+            alt=""
+            class="graphSize top250"
+            jsvImgScaledownTex
+            :src="bmpDemo"
+          />
+          <div class="underFont">
+            {{ `bmp图片\n指定尺寸噪点明显更大` }}
+          </div>
+        </div>
+
+        <div :style="{ left: 440, top: 0 }">
+          <img alt="" class="graphSize top0" :src="jpegDemo" />
+          <img
+            alt=""
+            class="graphSize top250"
+            jsvImgScaledownTex
+            :src="jpegDemo"
+          />
+          <div class="underFont">
+            {{ "jpg/jpeg图片" }}
+          </div>
+        </div>
+
+        <div :style="{ left: 660, top: 0 }">
+          <img alt="" class="graphSize top0" :src="pngDemo" />
+          <img
+            alt=""
+            class="graphSize top250"
+            jsvImgScaledownTex
+            :src="pngDemo"
+          />
+          <div class="underFont">
+            {{ `png有透明图片\n指定尺寸有明显锯齿` }}
+          </div>
+        </div>
+
+        <div :style="{ left: 880, top: 0 }">
+          <img alt="" class="graphSize top0" :src="pngNoAlphaDemo" />
+          <img
+            alt=""
+            class="graphSize top250"
+            jsvImgScaledownTex
+            :src="pngNoAlphaDemo"
+          />
+          <div class="underFont">
+            {{ `png无透明图片` }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </jsv-focus-block>
+</template>
+<style scoped>
+.allBgc {
+  width: 1920;
+  height: 1080;
+  background-color: #334c4c;
+}
+.block {
+  left: 20;
+  top: 50;
+}
+.leftFont {
+  left: 0;
+  width: 210;
+  height: 200;
+  color: #ffffff;
+  font-size: 30px;
+}
+.top0 {
+  top: 0;
+}
+.top250 {
+  top: 250;
+}
+.graphSize {
+  left: 0;
+  width: 200;
+  height: 200;
+  border-radius: 15px 15px 15px 15px;
+}
+.underFont {
+  left: 0;
+  top: 500;
+  width: 200;
+  height: 200;
+  color: #ffffff;
+  font-size: 20px;
+}
 </style>