表达式的使用案例
这里展示了许多表达式的使用案例。学习在实际案例中如何正确地使用表达式规则、图层属性和函数。打开原型亲自体验,还可以下载源文件查看制作方法。
实际使用案例:
想要学习关于变量的案例,请进入这里。
加入我们的社区并向ProtoPie的其他用户学习。参与、询问以及分享你所想到的一切。寻求和查看其他用户已经共享的提示、技巧以及解决方案。
- ProtoPioneers Community
- Discord上的 ProtoPie
- ProtoPie用户Facebook页面
- ProtoPie YouTube页面
- ProtoPie 官方QQ用户群:320684572,69980214
验证邮件地址
检查文本中是否存在特定字符或关键字。本案例使用indexOf函数来确认输入的内容中是否存在“@”,验证输入的内容是否为邮件地址。
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/086c082b33e44ce41ede65166d4ff5886a8ec483-1450x990.gif/validating-an-email-adress.gif)
下载和体验案例中的原型。
使用函数:indexOf
最少密码字符长度
为了增强密码安全性,设置密码时通常要求密码不少于多少个字符。使用length函数检查输入的内容是否超过指定数量的字符。
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/cbdaf2430ef93e2c26eec027ab7aea7f30106cc1-1450x990.gif/minimun-password-length.gif)
下载和体验案例中的原型。
使用函数:length
显示和隐藏密码
为了确保输入的密码正确,有时会遇到需要确认密码的情况。通过使用输入图层的文本属性,可以实现显示或隐藏密码。
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/c3dff07d6042b3d0c15c702d2826e13dd827d4e4-1450x990.gif/show-hide-password.gif)
下载和体验案例中的原型。
倒计时器
制作倒计时器原型时,根据时间的减少在文本反应中显示相应数字。
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/2a7b8b592cb8301bce0f1089ba03f30f72dcb9f2-1450x990.gif/countdown-timer.gif)
下载和体验案例中的原型。
使用函数:number
随机显示
在设置的值中随机显示文字或数字。
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/41ba8c67faa55dfcb5f1b5c557ac517200db5dbc-1450x990.gif/random-shuffle.gif)
下载和体验案例中的原型。
使用函数:right, left, randomInt
检查银行账户余额
检查银行帐户的余额是正数还是负数,验证数字高于或低于0。
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/80abdcec342199d2db11c81a7a109803ce7926be-1450x990.gif/checking-a-bank-account-balance.gif)
下载和体验案例中的原型。
使用函数:sign
在列表中展开卡片
在不考虑滚动值的情况下,在列表中选择想要展开的卡片。
![[object Object]](https://cdn.sanity.io/images/vidqzkll/production/62d4df4560c39900000cba63f9aa50581c367455-1450x990.gif/expanding-a-card-in-a-list.gif)
下载和体验案例中的原型。
使用函数:toLayerX, toLayerY