diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.css b/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.css new file mode 100644 index 0000000000000000000000000000000000000000..43e7580f467fa30b3e3a6ec4498c346ed983d70f --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.css @@ -0,0 +1,77 @@ +/** + * 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. + */ + +.container { + flex-direction:row; + width:100%; + height:100%; +} + +.title{ + width: 100%; + font-size: 18px; + margin: 2px; + padding: 2px; + font-weight: bold; + text-align: center; +} + +.sub-title{ + width: 100%; + font-size: 14px; + text-align: left; + margin: 2px; + padding: 2px; +} + +.prop-container{ + flex-direction: column; + flex-weight: 1; +} + +#idProp { + visibility: visible; +} + +.classProp { + visibility: visible; +} +#classPropNone { + visibility: visible; +} +.idPropDiv{ + background-color: yellowgreen; + width: 100%; + height: 50px; +} +.classPropDiv{ + background-color: greenyellow; + width: 100%; + height: 50px; +} +.classPropNoneDiv{ + background-color: yellow; + width: 100%; + height: 50px; +} +.stylePropDiv{ + background-color: green; + width: 100%; + height: 50px; +} +.specific-container{ + flex-direction: column; + flex-weight: 1; +} \ No newline at end of file diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.hml b/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.hml new file mode 100644 index 0000000000000000000000000000000000000000..72ab077931a7c615578c295018cdcec6400451b7 --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.hml @@ -0,0 +1,65 @@ + + +
+
+ + richtext通用属性 + + + + 通用属性 -- id + +
+ {{ content }} + +
+ + + 通用属性 -- class + +
+ + {{ content }} + +
+
+ + {{ content }} + +
+ + + + 通用属性 -- style + +
+ + {{ content }} + +
+
+ +
+
+
+ + richtext特有属性 + +
+
diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.js b/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.js new file mode 100644 index 0000000000000000000000000000000000000000..be25b6efaa2ee3f67aaf5a0e8816cbcf45d8d4ed --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/prop/index.js @@ -0,0 +1,58 @@ +/** + * 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:{ + content: ` +
+ +

h1

+

文本测试(h1测试)

+

h2

+

文本测试(h2测试)

+
+ `, + listOne:[{}], + listThree:[{},{},{}], + idProp : null, + classProp : null, + classPropNone : null, + styleProp : null + }, + + onShow(){ + this.getCommonPropValues(); + this.getSpecificPropValues(); + globalThis.value = { + idProp : this.idProp, + classProp : this.classProp, + classPropNone : this.classPropNone, + styleProp : this.styleProp + } + }, + + getCommonPropValues(){ + this.idProp = this.$element("idProp").getInspector() + this.classProp = this.$element("classProp").getInspector() + this.classPropNone = this.$element("classPropNone").getInspector() + this.styleProp = this.$element("styleProp").getInspector() + }, + + getSpecificPropValues(){ + + } +} diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/router/index.css b/ace/ace_standard/src/main/js/default/pages/richtext/router/index.css new file mode 100644 index 0000000000000000000000000000000000000000..b05d22aaaf3b14602079a642dfdcf9f562e3ee61 --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/router/index.css @@ -0,0 +1,405 @@ +/** + * 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. + */ + +.container { + flex-direction:row; + width:100%; + height:100%; + padding: 1px; +} + +.sub-container{ + flex-direction: column; + height: 100%; + flex-weight: 1; +} + +.style-container{ + flex-direction: column; + height: 70%; +} + +.title{ + width: 100%; + font-size: 18px; + margin: 2px; + padding: 2px; + font-weight: bold; + text-align: center; +} + +.sub-title{ + width: 100%; + font-size: 14px; + text-align: left; + margin: 2px; + padding: 2px; +} +.yellowgreenDiv{ + background-color: yellowgreen; + width: 100%; + height: 50px; +} +.greenyellowDiv{ + background-color: greenyellow; + width: 100%; + height: 50px; +} +.yellowDiv{ + background-color: yellow; + width: 100%; + height: 50px; +} +.style1{ + display: flex; +} + +.style2{ + visibility: visible; +} + +.style3{ + width: 100%; + padding: 10px; + margin: 5px; + border-left: 1px solid #000000; + border-right: 2px dashed #00ff00; + border-top: 1.5px dotted #0000ff; + border-bottom: 2.5px dotted #fff000; + background-image:url('common/images/image.png'); + background-size:cover; + background-repeat: repeat-x; + background-position: center; + flex:1; + flex-grow: 2; + flex-basis: 10px; + flex-shrink: 1; +} + +.style4{ + width: 60%; + height: 5%; + padding: 10px; + margin: 5px; + border: 2px solid #000000; +} + +.contain1{ + width: 100%; + height: 70px; + flex-direction: column; +} + +.style5{ + width: 50%; + height: 30px; + background-color: yellow; + border-image-source: url('/common/images/image.png'); + border-image-slice: 1px 2px 3px 4px; + border-image-width: 2px 3px 4px 5px; + border-image-outset: 3px 4px 5px 6px; + border-image-repeat: repeat; +} + +.style6{ + width: 70px; + height: 30px; + position: absolute; + left: 10px; + top: 35px; + bottom: 5px; + right: 10px; + background-color: pink; + border-image: url('common/images/icon.png') 1px 2px 3px 4px 2px 3px 4px 5px 3px 4px 5px 6px round; +} + +.style7 { + flex-direction: column; + flex-wrap:wrap; + justify-content:flex-start; + align-items: flex-end; + align-content:space-around; + display: flex; + height: 40px; +} + +.style8{ + flex-direction: row; + flex-wrap:nowrap; + scrollbar-color: yellow; + scrollbar-width: 10px; + overscroll-effect:spring; + height: 20px; + overflow:scroll; +} +.flex-item { + width: 50%; + height: 20px; + border-radius: 16px; +} + +.style9{ + flex-direction: row; + flex-wrap:nowrap; + scrollbar-color: yellow; + scrollbar-width: 10px; + overscroll-effect:spring; + height: 20px; + overflow:scroll; +} + +.color-red { + color: red; +} + +.color-white { + color: white; +} +.font-size16 { + font-size: 16; +} +.font-size20 { + font-size: 20; +} +.allow-scale{ + allow-scale:true +} +.placeholder-color{ + placeholder-color:pink +} +.font-weight3{ + font-weight:300 +} +.font-weight6{ + font-weight:600 +} +.color-success { + background-color: cornflowerblue; +} + +.grid-child { + width: 100%; + border-radius: 2px; +} + +.grid-left-top { + width: 20px; + height: 20px; + border-radius: 10px; + border: 1px solid plum; + background: linear-gradient(pink, purple); + box-shadow: 0px 0px 1px 1px pink; + grid-row-start: 0; + grid-column-start: 0; + grid-row-end: 0; + grid-column-end: 0; +} + +.grid-left-bottom { + width: 20px; + height: 20px; + border-radius: 5px; + border: 1px solid plum; + background: linear-gradient(pink, #00aaee); + box-shadow: 0px 0px 1px 1px pink; + grid-row-start: 1; + grid-column-start: 0; + grid-row-end: 1; + grid-column-end: 0; +} + +.grid-right-top { + width: 20px; + height: 20px; + border-radius: 3px; + border: 1px dotted plum; + background: linear-gradient(mediumpurple, #00aaee); + box-shadow: 0px 0px 1px 1px pink; + grid-row-start: 0; + grid-column-start: 1; + grid-row-end: 0; + grid-column-end: 1; +} + +.grid-right-bottom { + width: 20px; + height: 20px; + border-radius: 5px; + border: 1px dotted plum; + background: linear-gradient(pink, mediumpurple); + box-shadow: 0px 0px 2px 2px pink; + grid-row-start: 1; + grid-column-start: 1; + grid-row-end: 1; + grid-column-end: 1; +} + +.event-container{ + flex-direction: column; + flex-weight: 1; +} + +.event1{ + visibility: visible; +} + +.event2{ + visibility: visible; +} + +.event3{ + visibility: visible; +} + +.event4{ + visibility: visible; +} + +.event5{ + visibility: visible; +} + +.prop-container{ + flex-direction: column; +} + +#prop1 { + visibility: visible; +} + +.prop2 { + visibility: visible; +} + +.prop3 { + visibility: visible; +} + +.ani-container{ + flex-direction: column; + height: 100%; + flex-weight: 1; +} + +.ani1{ + background-color: #72ac33; + width: 55px; + height: 55px; + margin: 5px; + transform-origin: 0% 0%; + animation: ani1Go 3s infinite; +} + +@keyframes ani1Go +{ + from { + background-color: #f76160; + opacity:0.3; + width:50px; + height: 50px; + transform:translate(20px) rotate(10deg) scale(0.2); + background-position:10% 10% + } + 30% { + background-color: #60f761; + opacity:0.5; + width:70px; + height: 70px; + background-position:12% 12%; + transform:translateX(10px) translateY(5px) rotateX(20deg) rotateY(25deg) scaleX(0.6) scaleY(0.5) + } + to { + background-color: #6160f7; + opacity:1; + width:90px; + height: 90px; + background-position:22% 22%; + transform:rotate(180deg) scale(2) + } +} + +.ani2{ + background-color: #ad4e2a; + width: 55px; + height: 55px; + margin: 5px; +} + +.gradient-container{ + flex-direction: column; + height: 20%; +} + +.gradient1{ + width: 100%; + height: 20px; + margin: 5px; + background: linear-gradient(red, #00ff00); +} + +.gradient2{ + width: 100%; + height: 20px; + margin: 5px; + background: linear-gradient(45deg, rgb(255,0,0),rgb(0, 255, 0)); +} + +.gradient3{ + width: 100%; + height: 20px; + margin: 5px; + background: linear-gradient(to right, rgb(255,0,0) 90px, rgb(0, 255, 0) 60%); +} + +.gradient4{ + width: 100%; + height: 20px; + margin: 5px; + background: repeating-linear-gradient(to right, rgba(255, 255, 0, 1) 30px,rgba(0, 0, 255, .5) 60px); +} + +.access-container{ + flex-direction: column; + height: 20%; +} + +.access1{ + background-color: #321124; + margin: 5px; + width: 90%; + height: 30px; +} + +.atom-container{ + flex-direction: column; + height: 50%; +} + +.multiMode-container{ + flex-direction: column; + height: 50%; +} + +.multiMode1{ + background-color: #978666; + width: 100%; + height: 30px; + margin: 5px; +} + +.function-container{ + flex-direction: column; + height: 10%; +} \ No newline at end of file diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/router/index.hml b/ace/ace_standard/src/main/js/default/pages/richtext/router/index.hml new file mode 100644 index 0000000000000000000000000000000000000000..197b1c21a0e8dea1e9b4e79818a41df3f2e4134a --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/router/index.hml @@ -0,0 +1,174 @@ + + +
+
+
+ + 通用样式 + + + richtext通用样式1 + +
+ + +
+ + richtext通用样式2 + +
+ + +
+
+ + +
+ + 动画样式 + +
+
+ +
+
+ +
+
+ + 通用属性 + + + richtext通用属性1 + +
+ + +
+ + richtext通用属性2 + +
+ + +
+ + richtext通用属性3 + +
+ + +
+
+
+
+
+ + 通用事件 + + + richtext通用事件1 + +
+ + +
+ + richtext通用事件2 + +
+ + +
+ + richtext通用事件3 + +
+ + +
+ + richtext特有事件1 + +
+ + +
+ + richtext特有事件2 + +
+ + +
+
+
+
+
+ + 通用方法 + +
+
+ +
+
+ +
+
+ + 渐变样式 + + +
+
+
+
+ + 无障碍 + + +
+
+
+
+
+ + 原子布局 + +
+ +
+
+
+ + 多模输入 + +
+
+
+
diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/router/index.js b/ace/ace_standard/src/main/js/default/pages/richtext/router/index.js new file mode 100644 index 0000000000000000000000000000000000000000..8b0f71a0c68cf780fa735db3eb0bf4b8e33c488a --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/router/index.js @@ -0,0 +1,399 @@ +/** + * 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 { + + 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 + }); + }, + + start(event){ + prompt.showToast({ + message: "开始加载时触发。" + }); + }, + + complete(event){ + prompt.showToast({ + message: "加载完成时触发。" + }); + }, + + accessibility(event){ + prompt.showToast({ + message: JSON.stringify(event) + }); + } +} diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/style/index.css b/ace/ace_standard/src/main/js/default/pages/richtext/style/index.css new file mode 100644 index 0000000000000000000000000000000000000000..984f1d2d1add3943656a995b29493eec735f2475 --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/style/index.css @@ -0,0 +1,95 @@ +/** + * 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. + */ + +.container { + flex-direction:row; + width:100%; + height:100%; + padding: 1px; +} + +.title{ + width: 100%; + font-size: 18px; + margin: 2px; + padding: 2px; + font-weight: bold; + text-align: center; +} + +.sub-title{ + width: 100%; + font-size: 14px; + text-align: left; + margin: 2px; + padding: 2px; +} + +.style-container{ + flex-direction: column; + width: 50%; +} + +#styleOne{ + display:flex; + width: 150px; + height: 20px; +} + +#styleTwo{ + display:none; + width: 150px; + height: 20px; +} + +#styleThree{ + visibility: visible; + width: 50px; + height: 20px; +} + +#styleFour{ + visibility: hidden; + width: 50px; + height: 20px; +} +#styleOneDiv{ + display:flex; + background-color:red; + width: 100%; + height: 50px; +} + +#styleTwoDiv{ + display:none; + background-color:yellow; + width: 100%; + height: 50px; +} + +#styleThreeDiv{ + visibility: visible; + background-color:black; + width: 100%; + height: 50px; +} + +#styleFourDiv{ + visibility: hidden; + background-color:red; + width: 100%; + height: 50px; +} + diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/style/index.hml b/ace/ace_standard/src/main/js/default/pages/richtext/style/index.hml new file mode 100644 index 0000000000000000000000000000000000000000..e48aef307489745157f71a03fd3022fe06ab0e37 --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/style/index.hml @@ -0,0 +1,54 @@ + + +
+
+ + input通用样式 + + + + 通用样式1 display + +
+ + +
+
+ + +
+ + + 通用样式2 visibility + +
+ + +
+
+ + +
+
+
+
+
+ + input特有样式 + +
+
+ diff --git a/ace/ace_standard/src/main/js/default/pages/richtext/style/index.js b/ace/ace_standard/src/main/js/default/pages/richtext/style/index.js new file mode 100644 index 0000000000000000000000000000000000000000..8179ff70cbe9fa27c38c5386a6f497949bf60f3a --- /dev/null +++ b/ace/ace_standard/src/main/js/default/pages/richtext/style/index.js @@ -0,0 +1,19 @@ +/** + * 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. + */ + +export default { + + +}