首页
学习
活动
专区
工具
TVP
发布
您找到你想要的搜索结果了吗?
是的
没有找到

如何感知 WebKit 页面切换

背景 通常在 WKWebView 打开一个页面,收到页面数据时,代理方法可感知这个时机: -webView:didCommitNavigation: 但若是改变页面 hash (也就是位置标识符"#")...对于改变页面 hash 打开另一页面场景,是在同一个 Document,FrameLoader 作为专门处理页面加载的地方,应该是有处理目标页面是否是同一 Document 的代码分支,扫描一下就找到了一个可疑的函数...@end 粗略分析下源码,当 navigationType 这个枚举是 _WKSameDocumentNavigationTypeAnchorNavigation 时就表示完成了这次改变 hash 的页面切换...WKWebView 的 navigationDelegate 所属类下面实现 _webView:navigation:didSameDocumentNavigation: 方法就能捕获到改变 hash 的页面切换的操作了...,和 -webView:didCommitNavigation: 配对可完整感知 WKWebView 的页面切换完成时机。

1.5K20

如何感知 WebKit 页面切换

背景 通常在 WKWebView 打开一个页面,收到页面数据时,代理方法可感知这个时机: -webView:didCommitNavigation: 复制代码 但若是改变页面 hash (也就是位置标识符...对于改变页面 hash 打开另一页面场景,是在同一个 Document,FrameLoader 作为专门处理页面加载的地方,应该是有处理目标页面是否是同一 Document 的代码分支,扫描一下就找到了一个可疑的函数...复制代码 粗略分析下源码,当 navigationType 这个枚举是 _WKSameDocumentNavigationTypeAnchorNavigation 时就表示完成了这次改变 hash 的页面切换...WKWebView 的 navigationDelegate 所属类下面实现 _webView:navigation:didSameDocumentNavigation: 方法就能捕获到改变 hash 的页面切换的操作了...,和 -webView:didCommitNavigation: 配对可完整感知 WKWebView 的页面切换完成时机。

95200

webAPP页面切换之滑动-swiper2(切换页面默认显示顶部)

最近做一个web页面,希望在手机上能滑动切换页面,第一次这种要求,在网上找到了一个插件swiper,swiper2可以在电脑和手机上使用,于是选择这个插件,在使用这个插件的过程也遇到了很多问题,如滚动条很长...,体验不好,最后采用js来控制高度,在此页面中也采用了bootstrap-table插件来固定表头,采用js动态的设置高度,当页面高度小时,有滚动条,页面高时就完全展示,为了体验好,当滚动到第一个页面底部时...,滑动切换第二个页面的顶部,需要scrollTop实现 页面结构 页面...echart图表,需要再调用swiper插件后再init 和setoption图表,否则图表在页面切换时不显示 var myLineChart = echarts.init(document.getElementById

2.1K20

AngularJS应用页面切换优化方案

Angular的ngView及其对应的强大路由机制,是实现SPA应用的核心模块。本文所说的页面切换指的就是这个路由机制,即根据不同的URL展示不同的视图。...有一种非常常见的场景:在切换至新页面后,需要通过AJAX调用从服务器请求一些数据,然后根据这些数据来展示页面。...场景 让我们以Angular官方给出的 PhoneCat Tutorial App来说明这个问题。...PhoneDetailCtrl的代码如下: 这样,就可以在页面跳转之前获取到请求的数据了。 为页面加入切换动画 为了让页面切换更平滑,可以在页面切换加入过渡动画。...本文提出了两点技巧让AngularJS应用在页面切换时更加自然平滑。。 完整demo下载地址:AngularJS应用页面切换优化方案

1.9K100

Angular核心-父子组件传递数据-重难点

Angular核心-父子组件传递数据-重难点 博客首页:蔚说的博客 欢迎关注点赞收藏⭐️留言 作者水平很有限,如果发现错误,求告知,多谢! 有问题可私信交流!!!...(达内教育学习笔记)仅供学习交流 Angular核心-父子组件传递-重难点 Angular核心-父子组件传递数据-重难点方向一:父=》子传递数据方向二:子=》父父子组件传递数据的简便方法:...Angular核心-父子组件传递数据-重难点 方向一:父=》子传递数据 方向二:子=》父 父子组件传递数据的简便方法: Vue.js和Angular中的父子消息传递原理一样,都可以用口诀:“Props...把数据传递给父组件(父组件提供事件处理方法) Child.ts:自定义事件发射器–输出属性 import { Component, EventEmitter, OnInit, Output } from '@angular

1.2K20

初步总结页面跳转动效

最近一直在做交互规范总结的工作,在不断梳理页面跳转逻辑的同时,发现页面的逻辑关系并不能和页面跳转的动效很好的结合上。虽然只是零点几秒的切换动效,却能在一定程度上影响用户对于页面逻辑的认知。...初次接触产品,恰当的动效使产品页面的逻辑关系与用户自身建立起来的认知模型相吻合,操作后的反馈符合用户的心理预期。...例子: 社交类APP如Twitter发表推文;工具类APP如Evernote中新建笔记;基本大部分苹果原生APP顶部的工具调出都采用这种方式 下面并不完全属于页面切换,但是使用场景很相似且归到一类...(但Linkedin为了尽可能把feed流的空间扩大而将导航隐藏在侧滑出的边栏中用着很不方便,作为职场社交,所关注人发表的信息只是APP功能的一部分,发现人与工作也是相对重要的功能,所以页面需要频繁切换...侧滑 场景: 当页面见存在父集子集的时候,也是最常见到的一种转场动效。基本看到这样的动效,用户就会在头脑中形成树的模型——哪些内容在属性上相似,量级相同,以及不同层级的关系。

1.3K50

uniapp页面通信相关方法总结

利用url传参进行通讯 A页面向B页面传递参数 uni.navigateTo({ url: 'test/test?...我们假设一个场景,进入app,是未登陆状态,需要在我的页面点击登陆,进入登陆页面进行登陆。登陆成功之后,返回到我的页面,实时显示登陆后的用户信息。 监听事件 首先,在我的页面监听事件。...触发事件 进入登陆页面,触发事件 // 登陆页面 uni....而我们开发中会遇到很多页面通讯场景,如: vue 与 nvue,nvue 与 vue 的通讯 tabbar 页面之间的通讯 父页面与多级子页面的通讯 基本上述场景均可以实现,本质上就是一个页面通知另一个面我发生了变化...注意,这种方式只支持多个vue页面或多个nvue页面之间公用,vue和nvue之间不公用。

3.9K20

浅谈HTML5单页面架构(一)——requirejs + angular + angular-route

而在Webapp中,又要数单页面架构体验最好,更像原生app。简单来说,单页面App不需要频繁切换网页,可以局部刷新,整个加载流畅度会好很多。...angular的同学,可以灵活修改一下页面某些内容。...大型项目需要考虑代码的模块化,模块低耦合高内聚,目的就为了团队合作效率; 可扩展性。这个不用说了。 学习成本。一个框架再好,团队新成员难以掌握,学习难度大,结果很容易造成代码混乱。...这一篇,先说说第1种:requirejs+angular+angular-route 移动端单页面Web相对多页面来说,模块化管理显得非常重要,因为如果没有模块化,页面初始化时就把所有的js和所有模版都加载进来...angular-route需要做的只是切换HTML模版,重新编译,绑定新的controller。 但是。 但是。。 这里用了requirejs,事情就变化了。

3.3K20

Apple新专利:在标签页轻松切换

在屏幕空间有限的前提下,数量众多的标签将变得难以辨识和切换。...在多标签的管理上IE8曾经做过一个非常好的尝试,在标签栏起始位置放置一个缩略图按钮,点击之后所有打开的标签就会以缩略图的形式平铺在同一个页面。不过大概是因为使用率不高,在IE9之后就取消了。...通过使用者的操作,屏幕显示可以切换到序列模式,此时所有内容将以序列的形式展现。使用者在序列模式中可以选择所需要的内容,随后这些内容将会铺满屏幕。...此外,这个系统还可以提供双模式之间的切换动画和手势响应。 值得一提的是,该切换方式与IOS上Safari现行的标签切换方式极为类似。...事实上在最新的MAC系统中,Safari也具有类似的切换按钮。不过这项专利并没有限于在浏览器类软件使用。

1.1K20
领券