Swift如何为网页承载页面添加更多功能详解

 更新时间:2020年6月30日 23:37  点击:2026

前言

接上一篇文章,我们在设置中心通常会跳转到某一个网页承载页面,而通常我们会添加一些功能来提升他的体验。

1.添加菊花加载的效果

2.添加跳转到Safari的功能

3.添加复制链接的功能

4.添加分享网页的功能

首先,以WebViewController为例,我们要创建一个UIWebView;然后创建了三个功能按钮在左侧、一个关闭页面的按钮在右侧,并且为他们分别绑定;加载按钮的显示和隐藏直接通过代码实现。头部状态的代码如下:

class WebViewController: UIViewController,UIWebViewDelegate{
 let spinner = UIActivityIndicatorView()
 @IBOutlet weak var WebView: UIWebView!

 @IBAction func CloseAction(_ sender: Any) {
  self.dismiss(animated: true, completion: nil)
 }

 @IBAction func SafariAction(_ sender: Any) {
  self.toSafari()
 }

 @IBAction func CopyAction(_ sender: Any) {
  self.toCopy()
 }

 @IBAction func MoreAction(_ sender: Any) {
  self.toMore()
 }

一、添加菊花加载的效果

加载按钮需要在页面加载时立刻出现在正中央,并且开始旋转指导页面成功加载后隐藏。

先加在页面加载时立刻出现加载菊花,代码如下:

override func viewDidLoad() {
  super.viewDidLoad()
  //菊花按钮
  spinner.activityIndicatorViewStyle = .gray
  spinner.center = view.center
  spinner.hidesWhenStopped = true
  view.addSubview(spinner)
  spinner.startAnimating()

  self.loadWeb()
  // Do any additional setup after loading the view.
}

之后webViewDidFinishLoad检测了页面加载的状态,当加载完成后立刻隐藏并且停止菊花旋转,代码如下:

func webViewDidFinishLoad(_ webView: UIWebView) {
  print("web load finish")
  self.spinner.stopAnimating()
 }

二、添加跳转到Safari的功能

初始化时已经绑定了打开浏览器的函数toSafari,打开浏览器的操作就很简单了:

@objc func toSafari(){
  print("to safari")
  if let url = NSURL(string:self.url) {
   UIApplication.shared.open(url as URL, options: [:], completionHandler: nil)
  }
}

三、添加复制链接的功能

复制网页信息的方法toCopy,我们可以将标题和链接同时复制,代码如下:

@objc func toCopy(){
  print("to copy")
  //就这两句话就实现了
  let paste = UIPasteboard.general
  let str = self.urlTitle+":"+self.url
  print(str)
  paste.string = str
  let alertController = UIAlertController(title: NSLocalizedString("Copy Success!",comment: "Copy Success!"),message: nil,preferredStyle: .alert)
  //显示提示框
  self.present(alertController, animated: true, completion: nil)
  //两秒钟后自动消失
  DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 2) {
   self.presentedViewController?.dismiss(animated: false, completion: nil)
  }
}

四、添加分享网页的功能

分享网页的方法toMore,采用了类似于分享应用的方式,这是这里的内容我们改为网页的信息,比如网页的标题、链接、头图,代码如下:

@objc func toMore(){
  print("to more")
  let shareVC:UIActivityViewController = UIActivityViewController(activityItems: [self.urlTitle,self.urlImage,self.url], applicationActivities: nil)
  self.present(shareVC, animated: true, completion: {
   print("more success")
  })
 }

一个特性三个功能是不是很简单?当然你需要再添加一个关闭按钮。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对猪先飞的支持。

[!--infotagslink--]

相关文章

  • Photoshop火龙变冰龙制作教程分享

    今天小编在这里就来给Photoshop的这一款软件的使用者们来说下火龙变冰龙的制作教程,各位想知道具体的制作步骤的使用者们,那么下面就快来跟着小编一起看看制作教程吧。...2016-09-14
  • 用js的document.write输出的广告无阻塞加载的方法

    一、广告代码分析很多第三方的广告系统都是使用document.write来加载广告,如下面的一个javascript的广告链接。复制代码 代码如下:<script type="text/javascript" src="http://gg.5173.com/adpolestar/5173/;ap=2EBE5...2014-06-07
  • Photoshop功夫熊猫电影海报制作步骤分享

    不知不觉功夫熊猫这部电影已经出到3了,今天小编在这里要教大家的是用Photoshop制作功夫熊猫3的海报,各位想知道制作方法的,那么下面就来跟着小编一起看看吧。 给各...2016-09-14
  • Illustrator渐变网格工具绘制可爱的卡通小猪教程分享

    今天小编在这里就来给Illustrator的这一款软件的使用者们来说一说渐变网格工具绘制可爱的卡通小猪的教程,各位想知道具体制作方法的使用者们,那么下面就快来跟着小编一...2016-09-14
  • vue3如何按需加载第三方组件库详解

    距离 Vue 3.0 正式版发布已经有一段时间了,关于vue3组件库相关的问题还是挺多人感兴趣的,这篇文章主要给大家介绍了关于vue3如何按需加载第三方组件库的相关资料,需要的朋友可以参考下...2021-06-02
  • jQuery页面加载初始化常用的三种方法

    当页面打开时我们需要执行一些操作,这个时候如果我们选择使用jquery的话,需要重写他的3中方法,自我感觉没什么区 别,看个人喜好了,第二种感觉比较简单明了: 第一种: 复制代码 代码如下: <script type="text/javas...2014-06-07
  • 解决IDEA插件市场Plugins无法加载的问题

    这篇文章主要介绍了解决IDEA插件市场Plugins无法加载的问题,本文通过图文并茂的形式给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...2020-10-21
  • photoshop日系小清新通透人像调色教程分享

    今天小编在这里就来给photoshop的这一款软件的使用者们来说一说日系小清新通透人像的调色教程,各位想知道具体的调色步骤的使用者们,那么下面就快来跟着小编一起看一看...2016-09-14
  • Android WebView加载html5页面实例教程

    如果我们要在Android应用APP中加载html5页面,我们可以使用WebView,本文我们分享两个WebView加载html5页面实例应用。 实例一:WebView加载html5实现炫酷引导页面大多...2016-09-20
  • AngularJS 实现按需异步加载实例代码

    AngularJS 通过路由支持多视图应用, 可以根据路由动态加载所需的视图, 在 AngularJS 的文档中有详细的介绍, 网上也有不少教程, 就不用介绍了!随着视图的不断增加,js文件会越来越多,而 AngularJS 默认需要把全部的js都一次性...2015-10-21
  • 几种延迟加载JS代码的方法加快网页的访问速度

    本文介绍了如何延迟javascript代码的加载,加快网页的访问速度。 当一个网站有很多js代码要加载,js代码放置的位置在一定程度上将会影像网页的加载速度,为了让我们的网页加载速度更快,本文总结了一下几个注意点...2013-10-13
  • Angular性能优化之第三方组件和懒加载技术

    这篇文章主要介绍了Angular性能优化之第三方组件和懒加载技术,对性能优化感兴趣的同学,可以参考下...2021-05-11
  • 解决vue动态路由异步加载import组件,加载不到module的问题

    这篇文章主要介绍了解决vue动态路由异步加载import组件,加载不到module的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧...2020-07-27
  • php威盾解密的例子分享

    下面来给大家分享两个关于php威盾解密的例子,一个是批量解密一个是超级算法的解密都非常的好,大家有举的进入参考。 例子,批量解密 代码如下 复制代码 ...2016-11-25
  • PHP mysql与mysqli事务使用说明 分享

    mysqli封装了诸如事务等一些高级操作,同时封装了DB操作过程中的很多可用的方法。应用比较多的地方是 mysqli的事务。...2013-10-02
  • ThinkPHP+jquery实现“加载更多”功能代码

    本篇文章主要介绍了ThinkPHP+jquery实现“加载更多”功能代码,以实例代码讲诉了加载更多的代码实现,非常具有实用价值,需要的朋友可以参考下 ...2017-03-13
  • php实例分享之html转为rtf格式

    核心代码: 复制代码 代码如下:<!--?php$html2RTFCom = new COM("HTML2RTF.Converter");$html2RTFCom--->PreserveImages = true;$html2RTFCom->PageNumbers = 1;$html2RTFCom->PageNumbersAlignH = 1;$html2RTFCom->Pa...2014-06-07
  • swift中利用runtime交换方法的实现示例

    这篇文章主要给大家介绍了关于swift中利用runtime交换方法的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。...2020-06-30
  • 微信小程序实现canvas分享朋友圈海报

    这篇文章主要为大家详细介绍了微信小程序实现canvas分享朋友圈海报,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-21
  • vue如何调用浏览器分享功能详解

    这篇文章主要给大家介绍了关于vue如何调用浏览器分享的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-03-20