yasinwx+b的知识点
数据穿梭框是一种数据输入类的组件,都是对数据进行选择、处理。本文将详细介绍数据穿梭框,以便更好地应用与产品设计当中,希望对你有所帮助。
![](https://p0.ssl.img.360kuai.com/t0153ceea9732604e8d.jpg)
- 大家做原型的时候,肯定用过Axure软件。这个软件功能强大,上手快。大多数公司都是使用这个软件来写需求、做交互。
- 高保真原型,大家工作中应该也会接触过,如果时间宽裕或者项目要求,大家也会出一些高保真的原型。
你有没有想过这个问题:用Axure做的极致高保真,会是什么样子?
今天的这个B端组件–数据穿梭框会给你一个答案。
这是笔者用Axure做的数据穿梭框的高保真原型。根据笔者多年做高保真原型的经验。这个小小的数据穿梭框组件,基本上代表了Axure做高保真原型的极致。
之所以说它代表了高保真原型的极致,是因为它的交互效果,用到了非常多的知识点。如果这个穿梭框能做出来,那么互联网上所有产品的交互效果,都能做出来。
当然了,并不是所有项目都需要高保真,大多数项目是需要低保真即可。给大家看这个高保真组件,趣味成分大于实用成分。博大家一乐。
下面连一些实用成分的内容:系统全面地了解一下数据穿梭框。
一、数据穿梭框的作用
数据穿梭框是一种数据输入类的组件,和选择器、树选择组件的本质功能相同,都是对数据进行选择、处理。
但是相对于后两者,数据穿梭框可以展示更多的选项信息,而且数据穿梭框特有的交互方式,可以很直观的让用户感知到对数据的选择与处理,增加用户的确定感。多用在一些比较庄重正式的场景,比如签约流程、审批流程中。
二、数据穿梭框的组成
一个标准的数据穿梭框由:待选框、已选框、数据列表、选择按钮、穿梭按钮、数据量描述六部分组成。
如下图:
![](https://p0.ssl.img.360kuai.com/t011056f6488053969b.jpg)
- 待选框:显示待选择的数据列表,一般位于组件的左侧。
- 已选框:显示已经选择的数据列表,一般位于组件右侧。
- 数据列表:在待选框和已选框中,显示数据内容,如果没有数据就显示“数据为空”。
- 选择按钮:一般是复选按钮,可以选中对应的数据。选中或取消选择后,数据量描述文本会联动变化。
- 穿梭按钮:点击对应方向的穿梭按钮,所选中的数据会进行穿梭。如果未选中任何数据,对应方向的穿梭按钮会处于置灰状态。
- 数据量描述:选择按钮选择后,文本会联动变化。对应方向的数组总量发生变化事,文本也会联动。
三、几种不同类型的数据穿梭框
1. 标准穿梭框最常见的数据穿梭框,数据可以双向穿梭。
![](https://p0.ssl.img.360kuai.com/t01653bf75d43254408.jpg)
基础穿梭框上支持搜索功能,当穿梭框中数据量较大时,提供给用户更快捷的数据项定位能力。
![](https://p0.ssl.img.360kuai.com/t015f558d02424ed7d4.jpg)
数据只能从待选框到已选框,不能从已选框到待选框。
![](https://p0.ssl.img.360kuai.com/t01570eb7798f4ec709.jpg)
点击数据列表,即可完成数据穿梭,交互比较简单。
![](https://p0.ssl.img.360kuai.com/t0146d85c0ff5c0946b.jpg)
当选项数据量结构比较复杂时使用。
![](https://p0.ssl.img.360kuai.com/t019ab8e2a27c5a9764.jpg)
四、如何使用数据穿梭框
前文提到,数据穿梭框独特的交互方式,可以提升用户选择数据时的使用体验。但是使用起来有一定的门槛,
1. 数据穿梭框的三不用- 页面空间不足时,不可用。穿梭框需要一定的页面空间,空间不足时可以使用选择器或者树选择来替代。
- 数据量较少时,无需用。数据量不多,可以直接使用选择器组件来进行数据选择。
- 高频次的功能,慎用。穿梭框虽然体验好,但是交互相对来说有些复杂,高频次的功能建议使用交互较为简单的选择器组件来提升效率。有时候效率和体验,可能会做一些割舍,无法兼得。
- 需要清晰的展示选择数据时,必用。
- 一些比较正式的场合,比如签约、审批流程中,必用。
用和不用,请各位根据自己的项目要求和以上的“三不用”“二必用”原则,仔细斟酌。
3. 使用数据穿梭框需要注意的问题- 数据量较多时,为了方便用户快速定位数据,可以选择使用带搜索功能的穿梭框。
- 在非必要情况下,尽量选择交互相对简单的单向穿梭框。
- 使用频次较高又不得不用双向穿梭框的情况下,尽量选择简单模式来提升操作效率。
- 在数据结构较为复杂的情况下,可以和树选择组件结合使用。
五、从实战中整理出来的常用B端组件
这是本人在工作中整理出来的常用B端组件。有高保真、低保证和静态的各种组件,可以满足不同交互要求的项目。
六、小结
作为比较特殊的一种输入组件,数据穿梭框用对了地方,可以大幅提升产品的用户体验。用错了地方或者用错了类型,反而会影响用户体验。这把双刃剑,希望各位握好。
这是《好玩的B端组件》的第三篇文章,希望对你有用。
","gnid":"90d9aa7fa1b153863","img_data":[{"flag":2,"img":[{"desc":"","height":"420","title":"","url":"https://p0.ssl.img.360kuai.com/t0153ceea9732604e8d.jpg","width":"900"},{"desc":"","height":"679","title":"","url":"https://p0.ssl.img.360kuai.com/t011056f6488053969b.jpg","width":"1131"},{"desc":"","height":"481","title":"","url":"https://p0.ssl.img.360kuai.com/t01653bf75d43254408.jpg","width":"1138"},{"desc":"","height":"509","title":"","url":"https://p0.ssl.img.360kuai.com/t015f558d02424ed7d4.jpg","width":"1139"},{"desc":"","height":"478","title":"","url":"https://p0.ssl.img.360kuai.com/t01570eb7798f4ec709.jpg","width":"1141"},{"desc":"","height":"478","title":"","url":"https://p0.ssl.img.360kuai.com/t0146d85c0ff5c0946b.jpg","width":"1135"},{"desc":"","height":"476","title":"","url":"https://p0.ssl.img.360kuai.com/t019ab8e2a27c5a9764.jpg","width":"1136"}]}],"original":0,"pat":"art_src_3,fts0,sts0","powerby":"hbase","pub_time":1682394180000,"pure":"","rawurl":"http://zm.news.so.com/ec084e457733475948b6c9e9dda68862","redirect":0,"rptid":"eeee1517fea3056e","rss_ext":[],"s":"t","src":"人人都是产品经理","tag":[],"title":"好玩的B端组件丨数据穿梭框
龙耍剂631Y=ASIN(WX+B)中的三个系数怎么求 -
盛珠褚15185173677 ______ 根据最大值求出A,根据x=0,也就是和y轴交点求B,根据周期求w
龙耍剂631y=Asin(Wx+b) 的对称轴是?对称中心是?
盛珠褚15185173677 ______ wx+b=kπ+π/2.....x=解出 wx+b=kπ....解出x....中心为(x,0)
龙耍剂631三角函数中的换元思想,比如吧sin(wx+b),x∈【0,2π】中(wx+b)用t表示,那么t的取值范围是?这种换元思想的新定义域的取值一直搞不懂,望大虾大大们... -
盛珠褚15185173677 ______[答案] 因为0≤x≤2π 所以当w≥0时,b≤t≤wx+b. 当w<0时,wx+b≤t≤b. 因为w为x的系数,涉及到不等号,所以要考虑不等号的方向.
龙耍剂631y=Asin(wx+b) 的 对称轴是什么,若把sin变cos呢? -
盛珠褚15185173677 ______[答案] ①wx+b=kπ+π/2 故对称轴:x=kπ/w+(π/2-b)/w k∈Z ②若吧sin变成cos 对称轴为:wx+b=kπ x=kπ/w-b/w k∈Z
龙耍剂631sin(wx+b)中的W可不可以为负 -
盛珠褚15185173677 ______[答案] 可以. 是一个正常的表达式.
龙耍剂631函数y=Asin(wx+b)的图像性质 -
盛珠褚15185173677 ______ X=XJ1.2
龙耍剂631怎样将一般的三角函数式化成y=Asin(wx+φ)+b的形式 -
盛珠褚15185173677 ______[答案] 举个例子先y=(sinx+cosx)^2+2cos^2x =sin^2x+2sinxcosx+cos^2x+2cos^2x =1+sin2x+2cos^2x =1+sin2x+2*(1+cos2x)\2 =1+sin2x+1+cos2x =2+√2sin(2x+45°) 因为sin(A+B)+sin(A-B) =(sinAcosB+cosAsinB)+(sinAcosB-cosAsinB) =2sinAcosB 所以...
龙耍剂631三角函数y=Asin(wx+c)+b中的A和b是怎样确定的最好有图说明, -
盛珠褚15185173677 ______[答案] A是函数的最大值和最小值的差值的一半 b是函数的最大值和最小值的和 的一半
龙耍剂631把函数y=sin(wx+b)(其中b是锐角)的图像向右平移pi/8或向左平移3pi/8个单位都可使对应的新函数成为奇函数,则原函数的一个对称轴方程_________ - .只... -
盛珠褚15185173677 ______[答案] 右移:y=sin[w(x-pi/8)+b]左移:y=sin[w(x+3pi/8)+b]由三角函数的图像可知,要使上述函数为奇函数,则-wpi/8+b=kpi3wpi/8+b=(k+1)pi解得w=2,b=pi/4此时,原函数为y=sin(2x+pi/4),一个对称轴为2x+pi/4=pi/2即x=pi/8(当然...
龙耍剂631如何求Asin(wx+b)的最值? -
盛珠褚15185173677 ______[答案] 最大值就是|A|,最小值就是-|A|啊,因为A的几何定义就是正,余弦函数的振幅. 给你更一般的情况吧: y=Asin(wx+b)+c y=Acos(wx+b)+c 他们的最大值都是是|A|+c,最小值都是-|A|+c,周期都是2*pi/w.