综合百科

微信如何设置气泡对话框

微信如何设置气泡对话框

想要随心所欲地使用Axure设计产品原型,成为原型设计高手,只需掌握基本功能并学会思考。不必担忧复杂技巧或如何实现,只需要善于利用工具,即可轻松应对日常原型设计任务。接下来,我们通过几个实例来探讨如何更好地使用Axure。

一、按钮设计:交互样式的设置

Axure自带按钮组件,包括Button Shape和Submit。其中Submit样式设置较为受限,因此推荐使用Button Shape。通过普通矩形框设置属性,调整宽度和高度以形成按钮样式,并设置圆角风格。掌握扁平化风格的按钮设计技巧也很重要。按钮设计重点在于交互样式的设置,包括字体颜色、线条颜色、线宽和填充颜色等。只需设置鼠标经过状态,即可展现按钮的基本样式。矩形框在原型设计中用途广泛,可充当背景、标题栏等。

二、TAB属性页的设计:开动脑筋

在设计TAB属性页时,可能会遇到矩形框边框重叠问题。解决方式有两种:一是调整组件位置,使边框重叠一个像素;二是更换矩形框形状,尝试其他样式。例如,可以使用无下边框的矩形形状作为TAB属性页的上边按钮。利用组件的显示顺序属性,将TAB按钮调整到最上层,以体现当前选中的属性页。在刚接触Axure时,可以通过其他方式实现效果,如使用白色线条遮盖。

三、输入框边框颜色变化:组合方法

有些同学可能想在输入框获得焦点时改变边框颜色。在Axure中,可以通过组合方法实现这一效果。利用输入框的获得焦点和失去焦点事件,结合组件的选中样式属性,改变边框颜色。最后将输入框自身的边框隐藏,达到想要的效果。

四、聊天气泡图标:自定义图标,形状的巧用

聊天气泡图标如微信的图标,可以通过Axure的形状工具实现。添加一个形状作为椭圆形,再添加一个形状作为三角形,通过调整三角形的高度和旋转角度,结合形状的属性设置,实现聊天气泡图标的效果。旋转操作可以通过按住Ctrl键并移动鼠标到指定位置进行,也可以在属性设置框里设置旋转角度。

本文由 @Axure原型设计工场 原创发布于人人都是产品经理平台,未经许可,禁止转载。希望通过这些实例帮助大家更好地掌握Axure的使用技巧,提升原型设计效率。


微信如何设置气泡对话框

你可能也会喜欢...