1. 本节课将为您演示,表单在提交时的数据验证。首先在左侧的项目导航区,打开视图控制器的代码文件。
image
2. 现在开始编写代码,给表单添加验证的功能。
image
3. 在当前的类文件中,引入已经安装的第三方类库。
image
4. 然后修改当前视图控制器类的父类的名称。
image
5. 设置当验证失败时,标签行的视觉刷新事件。
image
6. 设置背景颜色为红色。
image
7. 然后设置字体的颜色为白色。
image
8. 接着依次设置字体的样式,以及文字的对齐方式。
image
9. 设置文本行的视觉变化。
image
10. 当验证失败时,设置字体的颜色为红色。
image
11. 接着在表单中添加一个段落,并设置段落的头部和尾部信息。
image
12. 在该段落中添加一个文本行,并设置该行的标题文字。
image
13. 接着添加验证规则为非空,如果该行的内容为空,则会提示验证错误。
image
14. 添加一个段落,并设置段落的头部和尾部信息。
image
15. 在该段落中添加一个文本行,并设置该行的标题文字。
image
16. 接着添加验证规则为非空,如果该行的内容为空,则会提示验证错误。
image
17. 创建一个字符串类型的规则集合。
image
18. 然后添加非空验证和邮箱验证。
image
19. 将规则集合赋予当前的表单行。
image
20. 然后设置当失去焦点,并且内容发生变化时,进行表单的验证。
image
21. 添加一个段落,并设置段落的头部和尾部信息。
image
22. 在该段落中添加一个网址行,并设置该行的标题文字。
image
23. 接着添加验证规则为网址格式的验证,并且在值发生变化时进行验证。
image
24. 设置单元格的刷新动作。
image
25. 当验证失败时,设置单元格的字体颜色为红色。
image
26. 添加一个段落,并设置段落的头部和尾部的信息。
image
27. 在该段落中添加一个密码行,并设置该行的标题文字。
image
28. 接着添加验证规则,设置最小的长度为8,最大的长度为13。用户需要输入最小长度和最大长度之间的内容。
image
29. 设置单元格的刷新动作。
image
30. 当验证失败时,设置单元格的字体颜色为红色。
image
31. 添加一个段落,并设置段落的头部和尾部的信息。
image
32. 在该段落中添加一个整数行,并设置该行的标题文字。
image
33. 接着添加验证规则为,允许用户输入2到999之间的整数。
image
34. 设置单元格的刷新动作。
image
35. 当验证失败时,设置单元格的字体颜色为红色。
image
36. 添加一个段落,并设置段落的头部和尾部的信息。
image
37. 在该段落中添加一个密码行,并设置该行的标题文字。
image
38. 添加另一个密码行,并设置该行的标题文字。
image
39. 接着添加验证规则,设置最小的长度为8,最大的长度为13。
image
40. 设置单元格的刷新动作。
image
41. 当验证失败时,设置单元格的字体颜色为红色。
image
42. 继续添加一个段落,并设置段落的头部和尾部的信息。
image
43. 在该段落中添加一个文本行,并设置该行的标题文字。
image
44. 接着添加验证规则为非空的规则,并且在值发生变化时进行验证。
image
45. 设置单元格的刷新动作。
image
46. 当验证失败时,设置单元格的字体颜色为红色。
image
47. 设置单元格的在验证发生变化时的情况。
image
48. 获得当前表单行在表单中的序号。
image
49. 然后删除当前段落的错误信息标签。
image
50. 接着处理当验证失败时的情况。
image
51. 对所有的错误信息进行遍历。
image
52. 创建一个标签表单行,并设置标签的标题文字为错误信息,同时设置单元格的高度。
image
53. 接着将标签行,插入到当前行的下方。
image
54. 继续在该段落中添加一个邮箱表单行,并设置该行的标题文字。
image
55. 接着添加验证规则,为非空规则和邮箱格式的验证。
image
56. 设置当失去焦点,并且内容发生变化时,进行表单的验证。
image
57. 设置单元格的刷新动作。
image
58. 当验证失败时,设置单元格的字体颜色为红色。
image
59. 处理单元格在验证发生变化时的情况。
image
60. 获得当前表单行在表单中的序号。
image
61. 然后删除当前段落的错误信息标签。
image
62. 接着处理验证失败时的情况。
image
63. 对所有的错误信息进行遍历。
image
64. 创建一个标签表单行,并设置标签的标题文字为错误信息,同时设置单元格的高度。
image
65. 接着将标签插入到当前行的下方。
image
66. 继续在该段落中添加一个网址行,并设置该行的标题文字。
image
67. 接着添加验证规则,为网址格式的验证,以及设置在值发生变化时进行表单的验证。
image
68. 设置单元格的刷新动作。
image
69. 当验证失败时,设置单元格的字体颜色为红色。
image
70. 处理单元格在验证发生变化时的情况。
image
71. 获得当前表单行在表单中的序号。
image
72. 然后删除当前段落的错误信息标签。
image
73. 接着处理验证失败时的情况。
image
74. 对所有的错误信息进行遍历。
image
75. 创建一个标签表单行,并设置标签的标题文字为错误信息,同时设置单元格的高度。
image
76. 接着将标签插入到当前行的下方。
image
77. 继续在该段落中添加一个密码行,并设置该行的标题文字。
image
78. 接着添加一个最小长度和最大长度的验证规则。
image
79. 设置单元格的刷新动作。
image
80. 当验证失败时,设置单元格的字体颜色为红色。
image
81. 处理单元格在验证发生变化时的情况。
image
82. 获得当前表单行在表单中的序号。
image
83. 然后删除当前段落的错误信息标签。
image
84. 接着处理验证失败时的情况。
image
85. 对所有的错误信息进行遍历。
image
86. 创建一个标签行,并设置标签的标题文字为错误信息,同时设置单元格的高度。
image
87. 接着将标签插入到当前行的下方。
image
88. 继续在该段落中添加一个密码行,并设置该行的标题文字。
image
89. 接着添加一个最小长度和最大长度的验证规则。
image
90. 设置单元格的刷新动作。
image
91. 当验证失败时,设置单元格的字体颜色为红色。
image
92. 处理单元格在验证发生变化时的情况。
image
93. 获得当前表单行在表单中的序号。
image
94. 然后删除当前段落的错误信息标签。
image
95. 接着处理当验证失败时的情况。
image
96. 对所有的错误信息进行遍历。
image
97. 创建一个标签行,并设置标签的标题文字为错误信息,同时设置单元格的高度。
image
98. 接着将标签插入到当前行的下方。
image
99. 继续在该段落中添加一个整数行,并设置该行的标题文字。
image
100. 接着添加验证规则为,允许用户输入2到999之间的整数。
image
101. 设置单元格的刷新动作。
image
102. 当验证失败时,设置单元格的字体颜色为红色。
image
103. 处理单元格在验证发生变化时的情况。
image
104. 获得当前表单行在表单中的序号。
image
105. 然后删除当前段落的错误信息标签。
image
106. 接着处理当验证失败时的情况。
image
107. 对所有的错误信息进行遍历。
image
108. 创建一个标签行,并设置标签的标题文字为错误信息,同时设置单元格的高度。
image
109. 接着将标签插入到当前行的下方。
image
110. 添加一个新的段落。
image
111. 然后在段落中添加一个按钮行,并设置该行的标题文字。
image
112. 设置当表单行处于选择状态时,强制校验表单中的所有元素。接着点击左上角的[编译并运行]按钮,启动模拟器预览项目。
image
113. 在弹出的项目中,点击密码行,并打开系统键盘。
114. 在键盘上点击字符,在密码行中输入内容。
image
115. 然后点击完成按钮,完成内容的输入。
image
116. 此时表单校验失败,字体变为红色,再次点击密码文本框。
image
117. 然后通过键盘再次输入内容,这次输入更多的字符。
image
118. 接着继续点击多次按键,输入更多的字符。
image
-
image
-
image
121. 当输入一定长度的内容之后,点击完成按钮。
image
122. 此时表单检验成功,红色文字消失。接着在下方的圆点处按下手指,并向上方拖动,查看下方的表单。
image
123. 接着点击具有非空验证规则的表单行,测试非空的验证规则。
image
124. 直接点击键盘上的完成按钮,观察表单的验证效果。
image
125. 表单验证失败,并在表单行的下方,插入了一个标签行,用来显示错误信息。
image
126. 接着点击键盘上的按键,输入一个字符。
image
127. 此时,表单实时验证成功,错误标签被删除。再次点击键盘上的完成按钮,关闭键盘。
image
128. 点击底部的按钮,可以检验表单中的所有元素。
image
129. 观察表单验证的错误提示信息,最后点击此处的[停止]按钮,关闭模拟器,并结束本节课程。
image
image
本文整理自:《app开发中的神兵利器》,真正的[手把手]教学模式,用最快的速度上手iOS开发,苹果商店App Store免费下载:https://itunes.apple.com/cn/app/id1209739676,或扫描本页底部的二维码。课程配套素材下载地址:资料下载
apps8 2.png
网友评论