axure 实现模拟百度搜索。中继器实现列表,分页显示。全局模糊查询。被搜索关键字高亮显示

来到这里的都是想学习的好朋友,废话不多说。我们直接开始吧。

直接下载可以使用的资源:https://download.csdn.net/download/u011581131/88660490

先来看看效果图:

后补:被搜索的关键字高亮显示:

分步实现:
1.引入中继器,初始化数据,给矩形赋值。


2.调整title和content的样式


3.调整title,content文本过长
[[Item.title.length]]
[[Item.title.Substring(0,30)]]...


4.制作分页

选中中继器,设置分页

添加 上一页,下一页,当前页

添加动作


5.搜索框设置

6.clear图标动作设置,载入时不显示,textEdit点击时显示,单击clear时,隐藏clear,将文本textEdit清空。

7.搜索一下添加筛选

8.clear图标移除筛选

9.将被搜索的文字高亮显示

这里要多说几句,由于有些文本长度过长,所以搜索后仍要做截取字符串的处理,搜索后就显示关键字的前后一段文字,其余文字被忽略。

附上当前的函数:[[Item.title.slice(Item.title.indexOf(LVAR1)-15,Item.title.indexOf(LVAR1))]][[Item.title.slice(Item.title.indexOf(LVAR1),Item.title.indexOf(LVAR1)+LVAR1.length)]][[Item.title.slice(Item.title.indexOf(LVAR1)+LVAR1.length,Item.title.indexOf(LVAR1)+LVAR1.length+10)]]

完成。

  • 8
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值