+
+
+
+
+
+
diff --git a/ace/ace_standard/src/main/js/default/pages/option/router/index.js b/ace/ace_standard/src/main/js/default/pages/option/router/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..94ba7b35979db4d830219996bbfce66b454557ba
--- /dev/null
+++ b/ace/ace_standard/src/main/js/default/pages/option/router/index.js
@@ -0,0 +1,516 @@
+/**
+ * Copyright (c) 2022 Shenzhen kaiHong Digital Industry Development Co., Ltd.
+ * 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 prompt from '@system.prompt';
+
+var options = {
+ duration: 1500,
+ easing: 'friction',
+ delay: 100,
+ fill: 'forwards',
+ iterations: 2,
+ direction: 'normal',
+};
+var frames = [
+ {
+ transform: {
+ translate: '-120px',
+ rotate:'10deg',
+ scale:0.2,
+ skew:'40deg'
+ },
+ opacity: 0.1,
+ offset: 0.0,
+ width: '40%',
+ height:'20px',
+ backgroundColor:'#ff0000',
+ backgroundPosition:'10px 20px',
+ transformOrigin:'left top'
+ },
+ {
+ transform: {
+ translateX: '0px',
+ translateY: '5px',
+ rotateX:'10deg',
+ rotateY:'10deg',
+ scaleX:0.5,
+ scaleY:0.7,
+ skewX:'22deg',
+ skewY:'30deg'
+ },
+ opacity: 0.6,
+ offset: 2.0,
+ width: '60%',
+ height:'30px',
+ backgroundColor:'#ff00ff',
+ backgroundPosition:'15px 25px',
+ transformOrigin:'center top'
+ },
+ {
+ transform: {
+ translateX: '100px',
+ translateY: '0px',
+ translateZ: '20px',
+ rotateX:'0deg',
+ rotateY:'0deg',
+ rotateZ:'30deg',
+ scaleX:1,
+ scaleY:1,
+ scaleZ:2,
+ skewX:'0',
+ skewY:'0',
+ skewZ:'30deg'
+ },
+ opacity: 1,
+ offset: 0.0,
+ width: '100%',
+ height:'30px',
+ backgroundColor:'#ffff00',
+ backgroundPosition:'0px',
+ transformOrigin:'center center'
+ },
+];
+
+export default {
+
+ onMenuSelected(e) {
+ prompt.showToast({
+ message: e.value
+ })
+ },
+ onTextClick1() {
+ this.$element('apiMenu1').show({x:120,y:10});
+ },
+ onTextClick2() {
+ this.$element('apiMenu2').show({x:120,y:80});
+ },
+ onTextClick3() {
+ this.$element('apiMenu3').show({x:120,y:150});
+ },
+ onTextClick4() {
+ this.$element('apiMenu4').show({x:120,y:220});
+ },
+ onTextClick5() {
+ this.$element('apiMenu5').show({x:120,y:290});
+ },
+ onTextClick6() {
+ this.$element('apiMenu6').show({x:120,y:360});
+ },
+ onTextClick7() {
+ this.$element('apiMenu7').show({x:120,y:650});
+ },
+
+ onShow(){
+ // 通用属性
+ var prop1 = this.$element('prop1');
+ var name1 = prop1.dataSet.name
+ var prop2 = this.$refs.prop2;
+ var name2 = prop2.dataSet.name
+ prompt.showToast({
+ message: 'prop1--' + name1 + '\nprop2--' + name2
+ });
+ },
+
+ touchStart(event){
+ var globalX = event.touches[0].globalX
+ var globalY = event.touches[0].globalY
+ var localX = event.touches[0].localX
+ var localY = event.touches[0].localY
+ var size = event.touches[0].size
+ var force = event.touches[0].force
+ var changeGlobalX = event.changedTouches[0].globalX
+ var changeGlobalY = event.changedTouches[0].globalY
+ var changeLocalX = event.changedTouches[0].localX
+ var changeLocalY = event.changedTouches[0].localY
+ var changeSize = event.changedTouches[0].size
+ var changeForce = event.changedTouches[0].force
+ var message = 'globalX--' + globalX + ',globalY--' + globalY +
+ ',localX--' + localX + ',localY--' + localY + ',size--' + size + ',force--' + force +
+ ',changeGlobalX--' + changeGlobalX + ',changeGlobalY--' + changeGlobalY +
+ ',changeLocalX--' + changeLocalX + ',changeLocalY--' + changeLocalY +
+ ',changeSize--' + changeSize + ',changeForce--' + changeForce;
+ prompt.showToast({
+ message: 'touchstart:\n' + message
+ });
+ },
+
+ touchMove(event){
+ var globalX = event.touches[0].globalX
+ var globalY = event.touches[0].globalY
+ var localX = event.touches[0].localX
+ var localY = event.touches[0].localY
+ var size = event.touches[0].size
+ var force = event.touches[0].force
+ var changeGlobalX = event.changedTouches[0].globalX
+ var changeGlobalY = event.changedTouches[0].globalY
+ var changeLocalX = event.changedTouches[0].localX
+ var changeLocalY = event.changedTouches[0].localY
+ var changeSize = event.changedTouches[0].size
+ var changeForce = event.changedTouches[0].force
+ var message = 'globalX--' + globalX + ',globalY--' + globalY +
+ ',localX--' + localX + ',localY--' + localY + ',size--' + size + ',force--' + force +
+ ',changeGlobalX--' + changeGlobalX + ',changeGlobalY--' + changeGlobalY +
+ ',changeLocalX--' + changeLocalX + ',changeLocalY--' + changeLocalY +
+ ',changeSize--' + changeSize + ',changeForce--' + changeForce;
+ prompt.showToast({
+ message: 'touchMove:\n' +message
+ });
+ },
+
+ touchEnd(event){
+ var globalX = event.touches[0].globalX
+ var globalY = event.touches[0].globalY
+ var localX = event.touches[0].localX
+ var localY = event.touches[0].localY
+ var size = event.touches[0].size
+ var force = event.touches[0].force
+ var changeGlobalX = event.changedTouches[0].globalX
+ var changeGlobalY = event.changedTouches[0].globalY
+ var changeLocalX = event.changedTouches[0].localX
+ var changeLocalY = event.changedTouches[0].localY
+ var changeSize = event.changedTouches[0].size
+ var changeForce = event.changedTouches[0].force
+ var message = 'globalX--' + globalX + ',globalY--' + globalY +
+ ',localX--' + localX + ',localY--' + localY + ',size--' + size + ',force--' + force +
+ ',changeGlobalX--' + changeGlobalX + ',changeGlobalY--' + changeGlobalY +
+ ',changeLocalX--' + changeLocalX + ',changeLocalY--' + changeLocalY +
+ ',changeSize--' + changeSize + ',changeForce--' + changeForce;
+ prompt.showToast({
+ message: 'touchEnd:\n' +message
+ });
+ },
+
+ touchCancel(event){
+ var globalX = event.touches[0].globalX
+ var globalY = event.touches[0].globalY
+ var localX = event.touches[0].localX
+ var localY = event.touches[0].localY
+ var size = event.touches[0].size
+ var force = event.touches[0].force
+ var changeGlobalX = event.changedTouches[0].globalX
+ var changeGlobalY = event.changedTouches[0].globalY
+ var changeLocalX = event.changedTouches[0].localX
+ var changeLocalY = event.changedTouches[0].localY
+ var changeSize = event.changedTouches[0].size
+ var changeForce = event.changedTouches[0].force
+ var message = 'globalX--' + globalX + ',globalY--' + globalY +
+ ',localX--' + localX + ',localY--' + localY + ',size--' + size + ',force--' + force +
+ ',changeGlobalX--' + changeGlobalX + ',changeGlobalY--' + changeGlobalY +
+ ',changeLocalX--' + changeLocalX + ',changeLocalY--' + changeLocalY +
+ ',changeSize--' + changeSize + ',changeForce--' + changeForce;
+ prompt.showToast({
+ message: 'touchCancel:\n' +message
+ });
+ },
+
+ click(){
+ prompt.showToast({
+ message: 'click'
+ });
+ },
+
+ doubleClick(){
+ prompt.showToast({
+ message: 'doubleClick'
+ });
+ },
+
+ longPress(){
+ prompt.showToast({
+ message: 'longPress'
+ });
+ },
+
+ focus(){
+ prompt.showToast({
+ message: 'focus'
+ });
+ },
+
+ blur(){
+ prompt.showToast({
+ message: 'blur'
+ });
+ },
+
+ key(event){
+ var code = event.code;
+ var action = event.action;
+ var repeatCount = event.repeatCount;
+ var timestampStart = event.timestampStart;
+ var message = 'code--' + code + ',action--' + action +
+ ',repeatCount--' + repeatCount + ',timestampStart--' + timestampStart;
+ prompt.showToast({
+ message: 'key:\n' + message
+ });
+ },
+
+ swipe(event){
+ var direction = event.direction;
+ var distance = event.distance;
+ var message = 'direction--' + direction + ',distance--' + distance;
+ prompt.showToast({
+ message: 'swipe:\n' + message
+ });
+ },
+
+ attached(){
+ prompt.showToast({
+ message: 'attached'
+ });
+ },
+
+ detached(){
+ prompt.showToast({
+ message: 'detached'
+ });
+ },
+
+ pinchStart(event){
+ var scale = event.scale
+ var pinchCenterX = event.pinchCenterX
+ var pinchCenterY = event.pinchCenterY
+ var message = 'scale--' + scale + ',pinchCenterX--' + pinchCenterX +
+ ',pinchCenterY--' + pinchCenterY;
+ prompt.showToast({
+ message: 'pinchStart:\n' + message
+ });
+ },
+
+ pinchUpdate(event){
+ var scale = event.scale
+ var pinchCenterX = event.pinchCenterX
+ var pinchCenterY = event.pinchCenterY
+ var message = 'scale--' + scale + ',pinchCenterX--' + pinchCenterX +
+ ',pinchCenterY--' + pinchCenterY;
+ prompt.showToast({
+ message: 'pinchUpdate:\n' + message
+ });
+ },
+
+ pinchEnd(event){
+ var scale = event.scale
+ var pinchCenterX = event.pinchCenterX
+ var pinchCenterY = event.pinchCenterY
+ var message = 'scale--' + scale + ',pinchCenterX--' + pinchCenterX +
+ ',pinchCenterY--' + pinchCenterY;
+ prompt.showToast({
+ message: 'pinchUpdate:\n' + message
+ });
+ },
+
+ pinchCancel(event){
+ var scale = event.scale
+ var pinchCenterX = event.pinchCenterX
+ var pinchCenterY = event.pinchCenterY
+ var message = 'scale--' + scale + ',pinchCenterX--' + pinchCenterX +
+ ',pinchCenterY--' + pinchCenterY;
+ prompt.showToast({
+ message: 'pinchCancel:\n' + message
+ });
+ },
+
+ dragStart(event){
+ var type = event.type
+ var globalX = event.globalX
+ var globalY = event.globalY
+ var timestamp = event.timestamp
+ var message = 'type--' + type + ',globalX--' + globalX +
+ ',globalY--' + globalY + ',timestamp--' + timestamp;
+ prompt.showToast({
+ message: 'dragStart:\n' + message
+ });
+ },
+
+ drag(event){
+ var type = event.type
+ var globalX = event.globalX
+ var globalY = event.globalY
+ var timestamp = event.timestamp
+ var message = 'type--' + type + ',globalX--' + globalX +
+ ',globalY--' + globalY + ',timestamp--' + timestamp;
+ prompt.showToast({
+ message: 'drag:\n' + message
+ });
+ },
+
+ dragEnd(event){
+ var type = event.type
+ var globalX = event.globalX
+ var globalY = event.globalY
+ var timestamp = event.timestamp
+ var message = 'type--' + type + ',globalX--' + globalX +
+ ',globalY--' + globalY + ',timestamp--' + timestamp;
+ prompt.showToast({
+ message: 'dragEnd:\n' + message
+ });
+ },
+
+ dragEnter(event){
+ var type = event.type
+ var globalX = event.globalX
+ var globalY = event.globalY
+ var timestamp = event.timestamp
+ var message = 'type--' + type + ',globalX--' + globalX +
+ ',globalY--' + globalY + ',timestamp--' + timestamp;
+ prompt.showToast({
+ message: 'dragEnter:\n' + message
+ });
+ },
+
+ dragOver(event){
+ var type = event.type
+ var globalX = event.globalX
+ var globalY = event.globalY
+ var timestamp = event.timestamp
+ var message = 'type--' + type + ',globalX--' + globalX +
+ ',globalY--' + globalY + ',timestamp--' + timestamp;
+ prompt.showToast({
+ message: 'dragOver:\n' + message
+ });
+ },
+
+ dragLeave(event){
+ var type = event.type
+ var globalX = event.globalX
+ var globalY = event.globalY
+ var timestamp = event.timestamp
+ var message = 'type--' + type + ',globalX--' + globalX +
+ ',globalY--' + globalY + ',timestamp--' + timestamp;
+ prompt.showToast({
+ message: 'dragLeave:\n' + message
+ });
+ },
+
+ drop(event){
+ var type = event.type
+ var globalX = event.globalX
+ var globalY = event.globalY
+ var timestamp = event.timestamp
+ var message = 'type--' + type + ',globalX--' + globalX +
+ ',globalY--' + globalY + ',timestamp--' + timestamp;
+ prompt.showToast({
+ message: 'drop:\n' + message
+ });
+ },
+
+ functionTest1(event){
+ var function1 = this.$element('function1');
+ function1.focus(true)
+ var rect = function1.getBoundingClientRect();
+ var width = rect.width;
+ var height = rect.height;
+ var left = rect.left;
+ var top = rect.top;
+ var message = 'width--' + width + ',height--' + height +
+ ',left--' + left + ',top--' + top;
+ prompt.showToast({
+ message: 'function1 rect:\n' + message
+ });
+ },
+
+ functionTest2(event){
+ var function2 = this.$element('function2');
+ let observer = function2.createIntersectionObserver({
+ ratios: [0.2, 0], // number
+ });
+ observer.observe((isVisible, ratio)=> {
+ console.info('this element is ' + isVisible + 'ratio is ' + ratio)
+ prompt.showToast({
+ message: 'function2 observer:\n' + 'isVisible--' + isVisible + ',ratio--' + ratio
+ });
+ })
+
+ observer.unobserve()
+ },
+
+ functionTest3(event){
+ var function3 = this.$element('function3');
+
+ var animation = function3.animate(frames, options);
+ animation.play()
+ animation.onfinish = function(){
+ prompt.showToast({
+ message: 'The animation is finished.'
+ });
+ };
+
+ animation.oncancel = function(){
+ prompt.showToast({
+ message: 'The animation is canceled.'
+ });
+ };
+
+ animation.onrepeat = function(){
+ prompt.showToast({
+ message: 'The animation is repeated.'
+ });
+ };
+
+ setTimeout(() => {
+ animation.reverse()
+ }, 500)
+
+ setTimeout(() => {
+ animation.pause()
+ }, 1000)
+
+ setTimeout(() => {
+ animation.cancel()
+ }, 1500)
+ },
+
+ functionTest4(event){
+ var function4 = this.$element('function4');
+ var scrollOffset = function4.getScrollOffset();
+ var x = scrollOffset.x;
+ var y = scrollOffset.y;
+ var message = 'x--' + x + ',y--' + y;
+ prompt.showToast({
+ message: 'functionTest4 scrollOffset:\n' + message
+ });
+
+ var scrollParam = {
+ dx:60,
+ dy:0,
+ smooth:true
+ }
+ function4.scrollBy(scrollParam)
+ },
+
+ reachStart(){
+ prompt.showToast({
+ message: 'reachStart'
+ });
+ },
+
+ reachEnd(){
+ prompt.showToast({
+ message: 'reachEnd'
+ });
+ },
+
+ reachTop(){
+ prompt.showToast({
+ message: 'reachTop'
+ });
+ },
+
+ reachBottom(){
+ prompt.showToast({
+ message: 'reachBottom'
+ });
+ }
+}
diff --git a/ace/ace_standard/src/main/js/default/pages/picker/index.css b/ace/ace_standard/src/main/js/default/pages/picker/index.css
deleted file mode 100644
index fc2ec14e547153b8baaf7017a65f79bc4ac4fc80..0000000000000000000000000000000000000000
--- a/ace/ace_standard/src/main/js/default/pages/picker/index.css
+++ /dev/null
@@ -1,67 +0,0 @@
-.container {
- flex-direction: column;
- justify-content: center;
- align-items: center;
-}
-picker{
- width:60%;
- height:80px;
- min-width: 25px;
- min-height: 10px;
- max-width: 300px;
- max-height: 100px;
- margin: 10px;
- padding: 20px;
- border-radius:20px;
- text-color:white;
- font-size:15px;
- margin-left:20%;
- background-color: pink;
-}
-select{
- background-color: #efecec;
- height: 50px;
- width: 60%;
- margin-left: 20%;
- margin-top: 30px;
- margin-bottom: 50px;
- font-size: 22px;
-}
-#picker0{
- text-color: plum;
- font-size: 30px;
- allow-scale: true;
- letter-spacing: 2px;
- text-decoration: underline;
- font-style: normal;
- font-family: sans-serif;
- line-height: 30px;
- column-height: 300px;
- background-color:#4747e3;
- border: 3px dotted brown;
-}
-#picker1{
- text-color: pink;
- font-size: 30px;
- allow-scale: true;
- letter-spacing: 5px;
- text-decoration: line-through;
- font-style: normal;
- font-family: sans-serif;
- line-height: 30px;
- column-height: 300px;
- border: 3px solid brown;
- background-color:deepskyblue;
-}
-#picker2{
- text-color: gray;
- font-size: 20px;
- allow-scale: true;
- letter-spacing: 10px;
- text-decoration: underline;
- font-style: normal;
- font-family: sans-serif;
- line-height: 30px;
- column-height: 300px;
- background-color: orange;
-}
\ No newline at end of file
diff --git a/ace/ace_standard/src/main/js/default/pages/picker/index.hml b/ace/ace_standard/src/main/js/default/pages/picker/index.hml
deleted file mode 100644
index e7aa03846ca6edb0ab6f63864aa63e8c50970181..0000000000000000000000000000000000000000
--- a/ace/ace_standard/src/main/js/default/pages/picker/index.hml
+++ /dev/null
@@ -1,22 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/ace/ace_standard/src/main/js/default/pages/picker/index.js b/ace/ace_standard/src/main/js/default/pages/picker/index.js
deleted file mode 100644
index 4a9c975b22ac481808fe2d7aa2b04c05e81c9936..0000000000000000000000000000000000000000
--- a/ace/ace_standard/src/main/js/default/pages/picker/index.js
+++ /dev/null
@@ -1,80 +0,0 @@
-/**
- * Copyright (c) 2022 Shenzhen Kaihong Digital Industry Development Co., Ltd.
- * 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 prompt from '@system.prompt';
-export default {
- data: {
- selectList:["text","data","time","datetime","multitext"],
- rangetext:['15', "20", "25"],
- multitext:[["a", "b", "c"], ["e", "f", "g"], ["h", "i"], ["k", "l", "m"]],
- textvalue:'default textvalue',
- datevalue:'default datevalue',
- timevalue:'default timevalue',
- datetimevalue:'default datetimevalue',
- multitextvalue:'default multitextvalue',
- containsecond:true,
- multitextselect:[1,2,0],
- datetimeselect:'2012-5-6-11-25',
- timeselect:'11:22:30',
- dateselect:'2021-3-2',
- textselect:'2'
- },
- selectChange(e){
- for(let i = 0;i
+
+