[Swift通天遁地]一、超级工具-(19)制作六种别具风格的动作表单

时间:2022-12-23 17:08:56

本文将演示如何制作多种别具风格的动作表单。

首先确保在项目中已经安装了所需的第三方库。

点击【Podfile】,查看安装配置文件。

 1 platform :ios, '12.0'
 2 use_frameworks!
 3 
 4 target 'DemoApp' do
 5     source 'https://github.com/CocoaPods/Specs.git'
 6     pod 'XLActionController'
 7     pod 'XLActionController/Periscope'
 8     pod 'XLActionController/Skype'
 9     pod 'XLActionController/Spotify'
10     pod 'XLActionController/Tweetbot'
11     pod 'XLActionController/Twitter'
12     pod 'XLActionController/Youtube'
13 end

根据配置文件中的相关配置,安装第三方库。

然后点击打开【DemoApp.xcworkspace】项目文件。

在项目导航区,打开视图控制器的代码文件【ViewController.swift】

选择开始编写代码,创建动作表单。

  1 import UIKit
  2 //在当前类文件中,引入已经安装的第三方类库
  3 import XLActionController
  4 
  5 class ViewController: UIViewController {
  6     
  7     override func viewDidLoad() {
  8         super.viewDidLoad()
  9         // Do any additional setup after loading the view, typically from a nib.
 10         
 11         //添加一个按钮,当用户点击该按钮时,打开动作表单
 12         let button = UIButton(frame: CGRect(x: 20, y: 200, width: 280, height: 40))
 13         //设置按钮的背景颜色为橙色
 14         button.backgroundColor = UIColor.orange
 15         //设置按钮在正常状态下的标题文字
 16         button.setTitle("Show me the XLActionController", for: .normal)
 17         //给按钮控件绑定点击事件,【分别绑定生成动作表单的六种方法】
 18         button.addTarget(self, 
 19                          action: #selector(ViewController.tweetbotActionController), 
 20                          for: .touchUpInside)
 21         //将按钮控件添加到当前的根视图
 22         self.view.addSubview(button)
 23         //设置根视图的背景颜色为橙色
 24         self.view.backgroundColor = UIColor.orange
 25     }
 26     
 27     //表单风格1,注意绑定按钮的点击事件
 28     //添加一个方法,用来响应按钮的点击事件
 29     @objc func tweetbotActionController()
 30     {
 31         //初始化一个指定风格的动作表单
 32         let actionController = TweetbotActionController()
 33         
 34         //1.在动作表单中添加一个表单选项,表单选项的样式为默认
 35         //动态表单消失之后,才执行相关的代码
 36         actionController.addAction(Action("View Details", 
 37                                    style: .default, //表单样式:默认样式
 38                                    handler: { action in
 39                     //当用户选择该选项时,在控制台输出一条日志信息
 40                     print("View Details")
 41         }))
 42         //2.在动作表单中添加一个表单选项,表单选项的样式为默认
 43         //动态表单消失之后,才执行相关的代码
 44         actionController.addAction(Action("View Retweets", 
 45                                    style: .default, //表单样式:默认样式
 46                                    handler: { action in
 47                     //当用户选择该选项时,在控制台输出一条日志信息
 48                     print("View Retweets")
 49         }))
 50         //3.在动作表单中添加一个表单选项,表单选项的样式为默认。
 51         //动态表单消失之后,才执行相关的代码
 52         actionController.addAction(Action("View in Favstar", 
 53                                    style: .default, 
 54                                    handler: { action in
 55                     //当用户选择该选项时,在控制台输出一条日志信息
 56                     print("View in Favstar")
 57         }))
 58 
 59         //4.在动作表单中添加一个表单选项,表单选项的样式为默认,
 60         //该选项被点击后将立即执行代码块中的语句。
 61         actionController.addAction(Action("Translate", 
 62                                           style: .default, 
 63                                           executeImmediatelyOnTouch: true, 
 64                                           handler: { action in
 65                                           //当用户选择该选项时,在控制台输出一条日志信息
 66                                           print("View Translate")
 67         }))
 68         
 69         //在动作表单中添加另一个段落
 70         actionController.addSection(Section())
 71         //并在该段落中,添加一个用于关闭窗口的取消样式的按钮
 72         actionController.addAction(Action("Cancel", style: .cancel, handler:nil))
 73         
 74         //在当前的视图控制器中,通过模态的方式弹出动作表单
 75         present(actionController, animated: true, completion: nil)
 76     }
 77     
 78     //表单风格2,注意绑定按钮的点击事件
 79     //添加一个方法,用来创建第二种样式的动作表单
 80     @objc func twitterActionController()
 81     {
 82         //初始化一个动作表单控制器对象
 83         let actionSheet = TwitterActionController()
 84         //设置表单头部的文字内容
 85         actionSheet.headerData = "Accounts"
 86 
 87         //在动作表单中添加一个表单选项,表单选项的样式为默认,设置相关参数。
 88         actionSheet.addAction(Action(ActionData(title: "Xmartlabs", //标题
 89                                                 subtitle: "@xmartlabs",//子标题
 90                                                 image: UIImage(named: "tw-xmartlabs")!), //左侧图标
 91                                                 style: .default, //表单样式:默认样式
 92                                                 handler: { action in    //交互动作
 93                                                            print("@xmartlabs")
 94         }))
 95         //在动作表单中添加一个表单选项,表单选项的样式为默认,设置相关参数。
 96         actionSheet.addAction(Action(ActionData(title: "Miguel", //标题
 97                                                 subtitle: "@remer88",//子标题
 98                                                 image: UIImage(named: "tw-remer")!), //左侧图标
 99                                                 style: .default,//表单样式:默认样式
100                                                 handler: { action in    //交互动作
101                                                            print("@remer88")
102         }))
103         
104         //在当前的视图控制器中,通过模态的方式弹出动作表单
105         present(actionSheet, animated: true, completion: nil)
106     }
107     
108     //表单风格3,注意绑定按钮的点击事件
109     //添加一个方法,用来创建第三种样式的动作表单
110     @objc func youtubeActionController()
111     {
112         //初始化一个动作表单控制器对象
113         let actionController = YoutubeActionController()
114         
115         //在动作表单中添加一个表单选项,表单选项的样式为默认,设置相关参数。
116         actionController.addAction(Action(ActionData(title: "Add to Watch Later",//标题
117                                                      image: UIImage(named: "yt-add-to-watch-later-icon")!), //左侧图标
118                                                      style: .default, //表单样式:默认样式
119                                                      handler: { action in
120         }))
121         //在动作表单中添加一个表单选项,表单选项的样式为默认,设置相关参数。
122         actionController.addAction(Action(ActionData(title: "Add to Playlist...", //标题
123                                                      image: UIImage(named: "yt-add-to-playlist-icon")!), //左侧图标
124                                                      style: .default,//表单样式:默认样式
125                                                      handler: { action in  //交互动作
126         }))
127         //在动作表单中添加一个表单选项,表单选项的样式为默认,设置相关参数。
128         actionController.addAction(Action(ActionData(title: "Share...", //标题
129                                                      image: UIImage(named: "yt-share-icon")!), //左侧图标
130                                                      style: .default, //表单样式:默认样式
131                                                      handler: { action in  //交互动作
132         }))
133         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
134         actionController.addAction(Action(ActionData(title: "Cancel", //标题
135                                                      image: UIImage(named: "yt-cancel-icon")!), //左侧图标
136                                                      style: .cancel, //表单样式:取消样式
137                                                      handler: nil))  //交互动作
138 
139         //在当前的视图控制器中,通过模态的方式弹出动作表单
140         present(actionController, animated: true, completion: nil)
141     }
142     
143     //表单风格4,注意绑定按钮的点击事件
144     //添加一个方法,用来创建第四种样式的动作表单
145     @objc func periscopeActionController()
146     {
147         //初始化一个动作表单控制器对象
148         let actionController = PeriscopeActionController()
149         //设置表单头部的文字内容
150         actionController.headerData = "Are you sure you want to block?"
151         //在动作表单中添加一个表单选项,表单选项的样式为破坏样式,设置相关参数。
152         actionController.addAction(Action("Block user",  //标题
153                                           style: .destructive, 
154                                           handler: { action in  //交互动作
155         }))
156         
157         //在动作表单中,添加另一个具有相同风格的段落
158         actionController.addSection(PeriscopeSection())
159         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
160         actionController.addAction(Action("Cancel",  //标题
161                                           style: .cancel, 
162                                           handler: { action in   //交互动作
163         }))
164         
165         //在当前的视图控制器中,通过模态的方式弹出动作表单
166         present(actionController, animated: true, completion: nil)
167     }
168     
169     //表单风格5,注意绑定按钮的点击事件
170     //添加一个方法,用来创建第五种样式的动作表单
171     @objc func spotifyActionController()
172     {
173         //初始化一个动作表单控制器对象
174         let actionController = SpotifyActionController()
175         
176         //设置表单头部的文字内容,其包含:标题、子标题、图标。
177         actionController.headerData = SpotifyHeaderData(title: "The Fast And The Furious Soundtrack Collection", //标题
178                                                         subtitle: "Various Artists", //子标题
179                                                         image: UIImage(named: "sp-header-icon")!) //图标
180         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
181         actionController.addAction(Action(ActionData(title: "Save Full Album", //标题
182                                                      image: UIImage(named: "sp-add-icon")!),//左侧图标
183                                                      style: .default, //表单样式:默认样式
184                                                      handler: { action in })) //交互动作
185 
186         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
187         actionController.addAction(Action(ActionData(title: "Remove", //标题
188                                                      image: UIImage(named: "sp-remove-icon")!), //左侧图标
189                                                      style: .default, //表单样式:默认样式
190                                                      handler: { action in })) //交互动作
191 
192         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
193         actionController.addAction(Action(ActionData(title: "Share", //标题
194                                                      image: UIImage(named: "sp-share-icon")!), //左侧图标
195                                                      style: .default, //表单样式:默认样式
196                                                      handler: { action in })) //交互动作
197 
198         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
199         actionController.addAction(Action(ActionData(title: "Go to Album", //标题
200                                                      image: UIImage(named: "sp-view-album-icon")!),//左侧图标
201                                                      style: .default, //表单样式:默认样式
202                                                      handler: { action in })) //交互动作
203         
204         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
205         actionController.addAction(Action(ActionData(title: "Start radio",//标题
206                                                      image: UIImage(named: "sp-radio-icon")!), //左侧图标
207                                                      style: .default, //表单样式:默认样式
208                                                      handler: { action in })) //交互动作
209         
210         //在当前的视图控制器中,通过模态的方式弹出动作表单
211         present(actionController, animated: true, completion: nil)
212     }
213     
214     //表单风格6,注意绑定按钮的点击事件
215     //添加一个方法,用来创建第六种样式的动作表单
216     @objc func skypeActionController()
217     {
218         //初始化一个动作表单控制器对象
219         let actionController = SkypeActionController()
220 
221          //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
222         actionController.addAction(Action("Take photo", //标题
223                                            style: .default, //表单样式:默认样式
224                                            handler: { action in})) //交互动作
225 
226         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
227         actionController.addAction(Action("Choose existing photo", //标题
228                                            style: .default, //表单样式:默认样式
229                                            handler: { action in})) //交互动作
230 
231          //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
232         actionController.addAction(Action("Remove profile picture", //标题
233                                            style: .default,//表单样式:默认样式
234                                            handler: { action in})) //交互动作
235 
236         //在动作表单中添加一个表单选项,表单选项的样式为取消样式,设置相关参数。
237         actionController.addAction(Action("Cancel", //标题
238                                            style: .cancel, //表单样式:取消样式
239                                            handler: nil)) //交互动作
240         
241         //在当前的视图控制器中,通过模态的方式弹出动作表单
242         present(actionController, animated: true, completion: nil)
243     }
244     
245     override func didReceiveMemoryWarning() {
246         super.didReceiveMemoryWarning()
247         // Dispose of any resources that can be recreated.
248     }
249 }