Axure9中继器教程:评论案例

2023-04-1910:55:09原型设计Comments1,329 views字数 319阅读模式

1、制作评论添加和列表区。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

(1)评论列表区使用中继器,在中继器内部添加三列,第一列是头像,第二列是网名、回复、点赞,第三列是评论内容。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

(2)选中中继器,在样式中添加数据,第一列导入图片,其余列填写文本。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

(3)选中中继器,切换到【交互】,添加数据渲染动作。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

(4)数据渲染完成。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

2、添加评论文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

(1)提前给网名文本框和富文本评论输入框命名。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

(2)选中【添加评论】按钮,添加交互动作,【单击时】- 中继器函数【添加行】,在弹出的添加行到中继器编辑框中,第一列需要填入头像图片的相对位置。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

在浏览器中选择头像-【检查】,复制出图片的相对位置。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

(3)网名和评论内容都使用局部变量获取内容。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

 文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

3、效果演示文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

Axure9中继器教程:评论案例文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

最后,在【添加评论】的动作上再清空之前的评论内容即可。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html

文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/35958.html
  • 本站内容整理自互联网,仅提供信息存储空间服务,以方便学习之用。如对文章、图片、字体等版权有疑问,请在下方留言,管理员看到后,将第一时间进行处理。
  • 转载请务必保留本文链接:https://www.cainiaoxueyuan.com/yuanxing/35958.html

Comment

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定