虎课网为您提供字体设计版块下的表单组件设计原型-墨刀基础入门与电商项目实战图文教程，难度等级为新手入门，下面开始学习这节课的内容吧！

本节课讲2-2表单组件设计原型，同学们可以在下方评论区进行留言，老师会根据你们的问题进行回复。

核心知识点：表单组件的使用与外观设置。

那就开始今天的课程吧。

1.用户第一次下单结算没有设置地址会需要填写表单，打开新增地址页面，【素材-基础】中找到【单行输入】组件拖拽到工作区，【H：48】。

2.加入【文本】组件，输入联系人，【字号：16-加粗】，【单行输入】内的提示文字双击编辑。

3.【我的-引用-谷歌material design-单选】，拖入工作区，制作性别选择。【外观】下取消勾选【是否勾选】。按【shift】选中两个单选，右键【组合】，设置单选。

4.复制联系人列表，文本更改为手机，文本【右对齐】，双击【单行输入】输入提示文本。同样方式制作地址和门牌号填写表单。

5.【素材-基础-下拉框】，【H：48】，双击【下拉框】组件，编辑内容。

6.【我的-引用-组件-开关】，选择是否设为默认地址，【垂直居中对齐】。

7.选中输入框，【键盘样式】根据不同需求选择不同样式。

8.选中输入框，不勾选【描边】，放入【线条】组件，调整颜色。可同时选择多个输入框进行设置，输入框长度全部拉到最右侧，无边框表单文字左对齐较好。

9.增加【按钮】组件，【H：44】，填充蓝色，文本改为确定，白色。通常情况下为凸显无边框表单，背景颜色填充为灰色，表单下添加白色矩形作为衬托强化表单，【置底】。

10.最终效果如图所示，本节课程结束，谢谢大家。

以上就是表单组件设计原型-墨刀基础入门与电商项目实战图文教程的全部内容了，你也可以点击下方的视频教程链接查看本节课的视频教程内容，虎课网每天可以免费学一课，千万不要错过哦！