后台回复 1 免费送你《产品经理入门资料包》
主要内容
在QQ使用中我们可以选择添加联系人,新建一个讨论组,已添加过的联系人不能重复添加,交互中会使用Axure里面的中继器、变量、函数。
交互效果
1.鼠标移入、点击联系人,显示悬停和选中样式。
2.鼠标点击联系人,该联系人头像、姓名添加到已选联系人列表中。已添加过的联系人不重复添加。
一、原型制作
步骤1:
添加4个矩形到编辑区分别制作如下
1)制作讨论组1面板,设置大小:w:480,h:390;
2)调整位置大小w:480,h:30,制作标题栏,设置颜色:绿色,
3)调整位置大小w:480,h:40,放在底部,并设置颜色为灰色;
4)制作确定、取消按钮;
添加单行文框到编辑区制作搜索框,添加单行文本标签到编辑区,编辑文字:已选联系人:1/50,命名:统计;添加单行文本标签到标题栏编辑文字:创建讨论组;
添加水平线到编辑区设置线宽:20,线条颜色:灰色,旋转并组合两条水平线,制作指向标识
步骤2:
添加矩形到编辑区,制作联系人列表,设置位置与大小:x:36.y :95,w:210,h:280,把矩形转换成动态面板,设置“按需显示纵向滚动条”
打开动态面板状态1编辑区,添加1个树部件,新增加2个一级树节点设置为三个组:最近联系人、我的好友、Arduino ;
在2级树节点图标中导入QQ头像,并编辑联系人的信息
步骤3:
添加矩形到编辑区,制作已选联系人列表,设置位置与大小:x:289.y :95,w:204,h:280,把矩形转换成动态面板,设置“按需显示纵向滚动条”
打开动态面板状态1编辑区,添加1个中继器,打开中继器编辑区,在中继器数据集里删除中继器里面的行,新增加三列,每列分别命名:mig、name、do;
1)添加一个矩形,调整位置与大小:x:22.y :0,w:158,h:18,命名:name;
2)添加图片部件,调整位置与大小:x:0.y :5, w:18,h:18,命名:mig;
3) 添加图片部件,调整位置与大小:x:183.y :11,w:15,h:12,命名:do;