123

manifest.json

@@ -10,7 +10,10 @@
   "features": [
     {
       "name": "blueos.app.appmanager.router"
-    },{ "name": "blueos.window.prompt" }
+    },
+    {
+      "name": "blueos.window.prompt"
+    }
   ],
   "deviceTypeList": [
     "watch",

pages/Demo/index.ux

@@ -1,18 +1,5 @@
 <template>
 <div class="container">
-    <swiper class="container-swiper" index="{{ sindex }} " vertical="true" loop="false" onchange="changeSwiper">
-        <div class="container-col">
-            <div class="text-container">
-                <text>输入法demo</text>
-                <text class="text-content">{{inputWords}}_</text>
-            </div>
-            <div class="container-row">
-                <input type="button" value="返回" class="func-button" onclick="cancelInput"></input>
-                <input type="button" value="确定" class="func-button" onclick="finishInput"></input>
-                <input type="button" value="退格" class="func-button" onclick="wordsBackspace"></input>
-            </div>
-            <text>上滑输入文字</text>
-        </div>
   <div class="container-col">
     <text class="letters-display">{{ letters }}</text>
     <text class="words-preview">{{ words }}</text>
@@ -32,7 +19,7 @@
     </div>
     <!-- 滑动键盘区域 -->
     <!-- 第一行 -->
-        <scroll class="keyboard-row-scroll" scroll-x="true">
+    <div class="keyboard-row-scroll">
         <div class="keyboard-row" for="{{row1Letters}}">
             <input 
                 type="button" 
@@ -42,50 +29,48 @@
                 
             />
         </div>
-        </scroll>
+    </div>
 
     <!-- 第二行 -->
-        <scroll class="keyboard-row-scroll" scroll-x="true">
+    <div class="keyboard-row-scroll">
       <div class="keyboard-row" for="{{row2Letters}}">
         <input 
             type="button" 
             class="input-button"
             value="{{$item}}"
             onclick="input($item)"
+            
         />
       </div>
-        </scroll>
+    </div>
 
     <!-- 第三行 -->
-        <scroll class="keyboard-row-scroll" scroll-x="true">
+    <div class="keyboard-row-scroll">
       <div class="keyboard-row" for="{{row3Letters}}">
         <input 
             type="button" 
             class="input-button"
             value="{{$item}}"
             onclick="input($item)"
+            
         />
       </div>
-        </scroll>
+    </div>
         
     <div class="function-row">
-            <input type="button" value="中" class="mode-button" onclick="changeToCn"></input>
-            <input type="button" value="英" class="mode-button" onclick="changeToEn"></input>
-            <input type="button" value="符" class="mode-button" onclick="changeToSymbol"></input>
-            <input type="button" value="空格" class="space-button" onclick="input(' ')"></input>
-            <input type="button" value="←" class="backspace-button" onclick="backspace"></input>
+      <input type="button" value="中" class="mode-button" onclick="changeToCn"/>
+      <input type="button" value="英" class="mode-button" onclick="changeToEn"/>
+      <input type="button" value="符" class="mode-button" onclick="changeToSymbol"/>
+      <input type="button" value="空格" class="space-button" onclick="input(' ')"/>
+      <input type="button" value="←" class="backspace-button" onclick="backspace"/>
     </div>
   </div>
-    </swiper>
 </div>
 </template>
 
 <script>
-import router from '@blueos.app.appmanager.router';
-import prompt from '@blueos.window.prompt';
 export default {
   data: {
-    fromPage: "",       //转跳输入法前的页面的Uri
     fromPageData: null,  //转跳输入法前的页面的要保存的数据（转跳页面时传过来一个对象，输入完成后传回去）
     letters: "",        //键盘页输入的拼音
     words: "　　　　",    //键盘页中，提供编辑框后8个字符的预览
@@ -93,6 +78,7 @@ export default {
     sindex: 0,          //键盘滑动位置，实现从候选页返回时可以返回到原页面
     mode: "cn",         //输入模式标记，中文cn，英文en，符号数字标记
     caps: -1,           //大小写标记
+    symbolToggle:-1,
     row1Letters: ["Q","W","E","R","T","Y","U","I","O","P"],
     row2Letters: ["A","S","D","F","G","H","J","K","L"],
     row3Letters: ["Z","X","C","V","B","N","M"],
@@ -108,9 +94,18 @@ export default {
         row3: ["z", "x", "c", "v", "b", "n", "m"]
       },
       sy: {
+        // 默认符号组（较少的符号，保持布局一致）
+        default: {
           row1: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"],
-        row2: ["!", "@", "#", "$", "%", "^", "&", "*", "(", ")",","],
-        row3: ["-", "_", "+", "=", "{", "}", "[", "]", "|", "\\","。"]
+          row2: ["!", "@", "#", "%", "&", "*", "(", ")", ","],
+          row3: ["_", "=", "{", "}", "[", "]", "。"]
+        },
+        // 补充符号组（额外的符号）
+        alternate: {
+          row1: ["~", "`", "©", "®", "±", "÷", "×", "/", "\\", "∞"],
+          row2: ["♥", "♦", "♣", "♠", "•", "$", "|", "^", "-"],
+          row3: ["¿", "¡", "∑", "∏", "π", "Ω", "∆"]
+        }
       }
     },
     currentWords: [],    // 当前显示的候选词
@@ -143,12 +138,31 @@ export default {
 
     this.currentWords = candidates.slice(this.wordsPageIndex, this.wordsPageIndex + 5);
   },
-  changeToSymbol() {
+changeToSymbol() {
+  // 如果当前已经是符号模式，则切换符号组
+  if (this.mode === 'sy') {
+    // 切换开关状态
+    this.symbolToggle = !this.symbolToggle;
+    if (this.symbolToggle) {
+      // 切换到备用符号组
+      this.row1Letters = this.keyboardModes.sy.alternate.row1;
+      this.row2Letters = this.keyboardModes.sy.alternate.row2;
+      this.row3Letters = this.keyboardModes.sy.alternate.row3;
+    } else {
+      // 切换回默认符号组
+      this.row1Letters = this.keyboardModes.sy.default.row1;
+      this.row2Letters = this.keyboardModes.sy.default.row2;
+      this.row3Letters = this.keyboardModes.sy.default.row3;
+    }
+  } else {
+    // 不是符号模式时，切换到符号模式，默认使用默认符号组
     this.mode = 'sy';
-        this.row1Letters = this.keyboardModes.sy.row1;
-        this.row2Letters = this.keyboardModes.sy.row2;
-        this.row3Letters = this.keyboardModes.sy.row3;
-  },
+    this.symbolToggle = false;  // 重置切换标志
+    this.row1Letters = this.keyboardModes.sy.default.row1;
+    this.row2Letters = this.keyboardModes.sy.default.row2;
+    this.row3Letters = this.keyboardModes.sy.default.row3;
+  }
+},
   changeToEn() {
     if (this.mode === 'en') {
       this.caps = this.caps === 1 ? -1 : 1;
@@ -245,29 +259,6 @@ export default {
   jumpToCandidate() {
     this.sindex = 1;
   },
-  finishInput() {
-    prompt.showToast({
-      message: '输入完成，此处可以storage保存或params然后跳转到你的页面',
-    })
-    /*
-    var that = this;
-    router.replace({
-      uri: that.fromPage,
-      params: {
-        fromPageData: that.fromPageData,
-        inputWords: that.inputWords,
-      },
-    });*/
-  },
-  cancelInput() {
-    var that = this;
-    router.replace({
-      uri: that.fromPage,
-      params: {
-        fromPageData: that.fromPageData,
-      },
-    });
-  },
   touchMove(e) { // swipe处理事件
     if (e.direction == "right") { // 右滑退出
       this.cancel_input()
@@ -295,9 +286,21 @@ export default {
   margin: 5px 0;
 }
 .keyboard-row {
+  display: flex;
+  justify-content: space-between;
   flex-direction: row;
+  width: 466px; /* 固定总宽度 */
   height: 60px;
 }
+.input-button {
+  width: 100%;
+  height: 60px;
+  margin: 0 3px;
+  font-size: 24px;
+  border-radius: 5px;
+  background-color: #444;
+  color: white;
+}
 .text-container {
   flex-direction: column;
   display: flex;
@@ -325,16 +328,7 @@ export default {
 }
 
 
-.input-button {
-    width: 70px;
-    height: 60px;
-    min-width: 60px;
-    margin: 0 3px;
-    font-size: 24px;
-    border-radius: 5px;
-    background-color: #444;
-    color: white;
-}
+
 .function-row {
   flex-direction: row;
   justify-content: space-between;
@@ -353,6 +347,7 @@ export default {
   height: 60px;
   color: #f0f8ff;
   background-color: #9f83fb;
+  border-radius: 25px; /* 新增圆角 */
 }
 .active-mode {
   background-color: #2196F3;
@@ -414,8 +409,8 @@ export default {
   align-items: center;
   left: 0px;
   top: 0px;
-    width: 454px;
-    height: 454px;
+  width: 466px;
+  height: 100%;
 }
 
 .container-col-candidate {