axure中的文本框是我们经常使用的元件,但它本身对样式的设置很有限,不能设置边框样式、阴影等,不能满足我们制作高保真原型的需求,本文给大家介绍一下结合矩形元件自定义文本框样式。(PS:此处的“高保真”指的是UI上的设计,对于原型保真程度的说明,请参考我的另一片文章《产品原型设计浅见》)。axure自定义文本框样式

如果我们要制作下图这种圆角输入框,首先拖入一个文本框、一个矩形到设计区域,将矩形置于底层,调整矩形的大小能够刚刚包围住文本框,给矩形增加一点圆角,把矩形的颜色弄浅一点,我设置的色值是#999999。

axure自定义文本框样式

接下来把文本框的边框隐藏,设置文本框的提示文字,调整一下提示文字的大小即可。

axure自定义文本框样式