快速搭建一款输入法(前端UI搭建)

前端UI显示是仿照手机输入法进行设计的，支持触摸屏点击输入，也支持实体键盘输入。前端UI将将输入模式分为:英文输入、中文输入、符号输入、数字输入、手写输入五种。

英文输入模式下用户可以输入英文符号，通过Shift键来切换对应的大小写字符。显示效果如下:

点击右下角的中英文切换按钮可以实现中英文输入模式的切换。中文输入模式下用户可以通过拼音输入获取各种候选，从而实现各种中文字符的输入。中文输入模式效果如下:

中文输入模式下第一行显示用户输入的拼音串，第二行显示候选，我们可以通过滑动候选行显示更多的候选词。也可以通过点击候选右方的三角形展开显示更多的候选词。

通过点击对应的候选词我们可以将对应的候选词选择上屏。

点击左下角的数字模式切换按钮，可以切换到数字输入模式。

在数字输入模式下我们可以输入各种各样的数字组合，输入界面如下:

点击主页面中的符号按钮用户可以切换到符号输模式。

符号输入模式下用户可以对各种特殊符号进行输入,输入界面如下

用户可以通过滚动显示更多的符号，从而实现各种各样的符号的输入。

在用户输入一些不知道音的特殊汉字的时候，拼音输入模式可能就不是那么好用了，这时候用户就用到了手写输入模式，手写输入模式下用户可以通过书写对应的汉字获取对应的候选汉字。通过点击菜单栏上的手写菜单用户可以切换到手写输入模式。输入模式的界面如下:

通过组合使用上面几种输入模式，用户就可以输入各种各样的内容了。当然相比于有强大云词库的手机输入法，此款输入法还有很多不足，有很大的提升空间，但是基本的使用应该是够了。

未来还会给这个输入法添加更多的额外功能，包括:皮肤自定义、表情输入、颜文字输入、辅助小工具等等，敬请期待。

快速搭建一款输入法(前端UI搭建)相关推荐

快速搭建一款输入法(封装输入法引擎)
输入法最核心的是输入法引擎,输入法引擎负责加载和管理输入法配置和输入法的词库,输入法引擎对用户输入的拼音字符串进行处理并返回对应的候选列表.通过引入输入法引擎我们就可以将我们输入法的拼音串转换成对应的 ...
vue简易微前端项目搭建（一）：项目背景及简介
github传送门: 1.h5主项目 2.项目脚手架 3.子项目模板系列文章传送门: vue简易微前端项目搭建(一):项目背景及简介 vue简易微前端项目搭建(二):子项目模板及项目脚手架搭建 vu ...
vue简易微前端项目搭建（二）：子项目模板及项目脚手架搭建
github传送门: 1.h5主项目 2.项目脚手架 3.子项目模板系列文章传送门: vue简易微前端项目搭建(一):项目背景及简介 vue简易微前端项目搭建(二):子项目模板及项目脚手架搭建 vu ...
【码云周刊第 65 期】5个前端 UI 优秀框架
摘要: 每周为您推送最有价值的开源技术内参! 码云项目推荐随着 Web 技术的不断发展,前端开发框架层出不穷,各有千秋,今天小编为大家奉上前端 UI 框架的开源项目,希望大家能够喜欢!如果大家有 U ...
php 开发ui框架,5 个优秀前端 UI 框架
随着 Web 技术的不断发展,前端开发框架层出不穷,各有千秋,今天小编为大家奉上前端 UI 框架的开源项目,希望大家能够喜欢!如果大家有 UI 框架相关的开源项目,也可以托管到码云上,我们会及时给予推 ...
前端绘图开源组件_5 个优秀前端 UI 框架
随着 Web 技术的不断发展,前端开发框架层出不穷,各有千秋,今天小编为大家奉上前端 UI 框架的开源项目,希望大家能够喜欢!如果大家有 UI 框架相关的开源项目,也可以托管到码云上,我们会及时给予推 ...
教你从零开始搭建一款前端脚手架工具
本文系原创,转载请附带作者信息:Jrain Lau 项目地址:https://github.com/jrainlau/s... 前言在实际的开发过程中,从零开始建立项目的结构是一件让人头疼的事情,所 ...
推荐一款多平台快速开发的前端UI框架 —— uView UI
本人体验了一遍,风格简约,功能齐全,正是心心念念的前端UI框架配合uni-app 真正是一款多平台开发的神器!! 强烈推荐!! 官网直达:uView UI 体验链接:uView多平台前端开发UI - ...
element ui点击按钮弹出款_前端猿应该知道的十大最流行的前端UI框架
在前端项目开发过程中,现在很少有人会使用原生的CSS来搭建页面,总归都会引入一些前端UI框架以减少代码的书写.一般为了方便自己的使用,很多大公司都有自己的一套UI框架,同时也会把其开源出来.下面就是最 ...

快速搭建一款输入法(前端UI搭建)

快速搭建一款输入法(前端UI搭建)相关推荐

最新文章

热门文章