ui设计弹窗运用有哪些

来源：郑州中公优就业IT培训学校时间：2023/4/22 16:36:21

　　ui设计弹窗的使用

　　大家都熟悉信息提交类弹窗，与其它弹窗的不同之处在于，它们有输入和选择操作，如我们常用的输入验证码、消息回复、充值和转账、任务设置等。

　　设计似乎相对简单，但当你验收时，会发现问题所在，为什么别人的弹窗的体验如此流畅，我们的操作如此复杂?

　　常见问题主要包括:操作键盘挡住输入区域，导致交互不流畅;选择了不适当的控件并增加了操作步骤。

　　左侧弹窗下部分的输入框和提交按钮已被键盘遮挡了，鉴于这种情况，我们目前的解决方案是让弹窗跟随键盘，但是当信息太多时就不合适了。

　　使用滑动选择控件，一次只能查看几个地址，当你所在的城市相对落后时，就会增加运营成本。

　　1.采用联动弹窗。

　　联动弹窗，即弹窗与键盘连接，具有解决传统弹窗遮挡内容的优点，主要用于信息少、输入多的重要场景。

　　在页面中设置发布宝贝的价格时，将价格、、运费、邮费等信息集合到联动弹窗中，这样我们就可以一步完成操作，避免了传统弹窗中出现多个条目的情况。

　　TIM的待办事项列表主要是基于信息的，采用联动弹窗使用户能够集中精力于当前输入，而不受其它操作的干扰。

　　2.考虑是否可设计为页面。

　　当信息多时，我们需要判断是否有必要使用弹窗进行设计，直接使用页面设计会不会更好?那么判断的标准实际上是由当前用户的目的决定的。

　　在访客登录界面中使用弹窗更合适，因为用户当前的目的是查看其它精彩的内容，采用弹窗对用户的目的干扰较小。

　　由于信息量大，当前用户的目的是发布宝贝，所以采用页面进行设计比较适合。

　　3.考虑使用传统弹窗。

　　传统弹窗是我们在屏幕中央常见的弹窗，其优点是空间大，应用范围广，有现成的组件库。但是，为了有一个流畅的交互效果，我们考虑联动弹窗和页面设计的方式。如果另外两种情况都不适合才考虑采用传统弹窗样式。

　　勾选列表中新任务的日期设置是传统弹窗样式，虽然弹窗有很多信息，但用户当前的目的是添加任务。如果使用页面就会对用户的目的造成干扰，所以采用弹窗的方式会更好。

尊重原创文章，转载请注明出处与链接：http://www.peixun360.com/2286/news/615641/违者必究！ 以上就是郑州中公优就业IT培训学校 小编为您整理 ui设计弹窗运用有哪些的全部内容。