diff --git a/entry/src/main/ets/common/keyItemNumber.ets b/entry/src/main/ets/common/keyItemNumber.ets
new file mode 100644
index 0000000000000000000000000000000000000000..76a4dc80804cf48439435b8e7f2ce35333f5a413
--- /dev/null
+++ b/entry/src/main/ets/common/keyItemNumber.ets
@@ -0,0 +1,81 @@
+import { keySourceListType} from '../model/keyboardKeyData'
+import { InputHandler } from '../model/InputHandler'
+import styleConfiguration from '../common/styleConfiguration'
+
+
+let inputStyle: any = styleConfiguration.getInputStyle()
+let basicButtonWidth  : string
+let basicButtonHeight : string
+
+
+//有大小写的按键组件
+@Component
+export struct keyItemNumber {
+  private keyValue: keySourceListType
+  @Link upper: number
+  @State isChinese: boolean = AppStorage.Get<boolean>("isChinese")
+
+  @Styles pressedStyles() {
+    .backgroundColor("#AEB3BD")
+  }
+
+  @Styles normalStyles() {
+    .backgroundColor("#ffffff")
+  }
+
+
+  aboutToAppear() : void{
+
+    var dHeight = AppStorage.Get<number>("dHeight")
+    if (dHeight == 1280) {
+      basicButtonWidth = inputStyle.basicButtonWidth_1280;
+      basicButtonHeight = inputStyle.basicButtonHeight_1280;
+    }
+    else{
+      basicButtonWidth = inputStyle.basicButtonWidth;
+      basicButtonHeight = inputStyle.basicButtonHeight;
+    }
+
+  }
+
+  build() {
+    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceAround }) {
+      Text(this.keyValue.title)
+        .fontSize(inputStyle.litterNumberFontSize)
+        .fontColor(0x606060)
+        .fontWeight(FontWeight.Lighter)
+      if (this.upper === 0) {
+        Text(this.keyValue.content)
+          .fontSize(inputStyle.en_fontSize)
+          .fontColor('#000')
+          .fontWeight(FontWeight.Regular)
+      } else {
+        Text(this.keyValue.upperContent)
+          .fontSize(inputStyle.en_fontSize)
+          .fontColor('#000')
+          .fontWeight(FontWeight.Regular)
+      }
+    }
+    .backgroundColor('#ffffff')
+    .borderRadius(4)
+    .padding({ top: '5%', bottom: '5%' })
+    .onClick(() => {
+      if (this.upper === 0) {
+        console.info('may-->111122233444:cccc')
+        InputHandler.getInstance().insertText(this.keyValue.content,this.isChinese);
+      } else {
+        console.info('may-->111122233444:dddd')
+        if (this.upper === 1) {
+          this.upper = 0
+        }
+        InputHandler.getInstance().insertText(this.keyValue.upperContent,this.isChinese);
+      }
+    })
+    .width(basicButtonWidth)
+    .height(basicButtonHeight)
+    .shadow({ radius: 1, color: '#76787c', offsetY: 3 })
+    .stateStyles({
+      normal: this.normalStyles, pressed: this.pressedStyles
+    })
+  }
+}
\ No newline at end of file