您的位置: 第一财商网 > 财经 > 正文

手机号注册登录微信小程序界面设计样式方案!

2020-12-24 15:23:28来源:阅读:-

在手机号注册里,需要设计输入框用来设计手机号,设计同意注册协议及“下一步”按钮。

1、在“pages/mobile/mobile”文件里,进行手机号输入的布局设计,并设计注册协议和“下一步”,wxml文件布局代码如下:

手机号注册登录微信小程序界面设计样式方案

2、在“pages/mobile/mobile”文件里,进行手机号输入的布局设计,并设计注册协议和“下一步”,wxss文件样式代码如下:

手机号注册登录微信小程序界面设计样式方案

手机号输入框和同意协议布局样式效果图如下:

手机号注册登录微信小程序界面设计样式方案

3、在“pages/mobile/mobile”文件里,添加mobileblur事件,如果输入手机号,“下一步”按钮则变为可用状态,js代码如下:

手机号注册登录微信小程序界面设计样式方案

上述代码运行效果图如下:

手机号注册登录微信小程序界面设计样式方案

4、在“mobile.json”文件里,添加“navigationVarTitleText”,“手机快速注册”属性,设置导航标题为“手机快速注册”,如图所示。

手机号注册登录微信小程序界面设计样式方案

推荐阅读:大众生活网

滚动推荐
23:28手机号注册登录微信小程序界面设计样
在手机号注册里,需要设计输入框用来设计手机号,设计同意注册协议及“下一[详细]
18:37史上最坚固的三防手机!松下T1:骁
近日,松下给大家带来了Toughbook系列产品FZ-T1手机。除了拥[详细]
05:02元祖梦蛋糕持续发力,推出圣诞创意新
元祖梦蛋糕持续发力,推出圣诞创意新品[详细]
38:36全球最强拍照手机榜再刷新!两款国产
众所周知,目前全球各大手机厂商都已经正式发布了“年度旗舰产品”,但当下[详细]
35:10用PS制作手机UI界面设计!
本例是为智能手机设计个人首页界面设计,首先明确整个设计风格以简洁为主,[详细]
31:25退守日本 松下造出一款续航手机!
松下公司近日推出一款新的Android智能手机——松下ElugaI3M[详细]
26:55这款手机读卡器很有特色,标配了Li
比如由原来的文字、图片形式开始向视频、动漫以及直播等方向发展,于是对存[详细]