前言 本系列是基于React Native版本号0.44.3写的。我们都知道,一个App不可能只有一个不变的界面,而是通过多个界面间的跳转来呈现不同的内容。那么这篇文章将介绍RN中的导航。 导航 什么是导航? 其本质就是视图之间的界面跳转,例如首页跳转到详情页。 在RN中有两个组件负责实现这样的效果,它们是: NavigatorIOS React Navigation 你可能在很多地方听说过Navigator,这个老组件会逐渐被React Navigation代替。笔者在最后也会讲解一下Navigator
本文首发于我的个人博客:『不羁阁』 https://bujige.net 文章链接:https://bujige.net/blog/iOS-Application-jump.html 这篇文章通过一步步指导,教你彻底学会『iOS应用间相互跳转』问题。文末有Github的学习Demo。 1. 应用间相互跳转简介 在iOS开发的过程中,我们经常会遇到需要从一个应用程序A跳转到另一个应用程序B的场景。这就需要我们掌握iOS应用程序之间的相互跳转知识。 下面来看看我们在开发过程中遇到的应用场景。 2.
createBottomTabNavigator 相当于iOS里面的TabBarController,屏幕下方的标签栏。如图:
从createMaterialTopTabNavigator API上可以看出createMaterialTopTabNavigator 支持通过RouteConfigs和 TabNavigatorConfig 两个参数来创建createMaterialTopTabNavigator导航器。
每个客户端都会有自己的 UA (userAgent)标识,可以用 JavaScript 获取客户端标识。
前言 之前,通过官方文档,我们对Navigator简介。 在React Native开发中,官方推荐使用Navigator作为导航指示器,在早期的版本中ios/android中都使用Navigator作为通用导航栏,不过在在后来的版本中,由于Navigator对ios系统兼容较差,所以使用导航往往使用NavigatorIOS组件。 Navigator和NavigatorIOS属性 Navigator Navigator设置方法: 初始化路由(initialRoute), 配置场景动画(configure
前言 之前,通过官方文档,我们对Navigator简介。 在React Native开发中,官方推荐使用Navigator作为导航指示器,在早期的版本中ios/android中都使用Navigator作为通用导航栏,不过在在后来的版本中,由于Navigator对ios系统兼容较差,所以使用导航往往使用NavigatorIOS组件。 Navigator和NavigatorIOS属性 Navigator Navigator设置方法: 初始化路由(initialRoute), 配置场景动画(configureSc
在 iOS Safari (其他浏览器和 Android 均不会)上会对那些看起来像是电话号码的数字处理为电话链接,比如:
深度链接(Deeplink)是泛用性极高的一项通用技术,在我们日常生活中非常容易接触到。比如:
在应用A跳转到应用B,则给A、B自身自定义URL Schemes(自定义的协议头)后,通过在A中处理B的URL Schemes,就可以在A中启动B了。
路由是指根据url分配到对应的处理程序,在移动端就可以理解为,根据给定的url跳转到指定页面的功能模块。
启动之后,输入127.0.0.1:8899 就可以访问到whistle调试界面了:
createStackNavigator 提供APP屏幕之间切换的能力,它是以栈的形式还管理屏幕之间的切换,新切换到的屏幕会放在栈的顶部。
笔者最近一直在开发京东app嵌入的h5项目和微信小程序商城项目,在此期间遇到很多坑。这篇文章主要是针对 h5| Hybrid | 微信小程序 三个方向来讲述我遇到的坑,以及详细讲解我是如何解决问题的。
📷 文 | Lefe 对于一名 iOS 开发者来说,微信小程序的出现,会让我们感觉到些许的不安。 但接触一段时间后,我发现,其实并不是想象中的那样。微信小程序不可能替代原生 app,也没有绝对的优势战胜原生 app。 不过,微信小程序固然有它的好处,比如我们需要用到的那些不常用的服务。对于小企业来说,小程序可以让他们更便捷地宣传他们的服务,或是给顾客一个更好的线下体验。 那么对于一个 iOS 开发的成员来说,开发小程序会有哪些挑战呢? 回顾 iOS 开发过程 最基本的 iOS
emmm…… 先说个题外话,时隔一年,再遇RN,较之以前唯一不同的一点就是遇到的坑终于有人先踩了?本文会通过原生与RN页面相互跳转、方法间的相互调用、以及H5页面调用原生页面进而调用RN页面等方面来阐
概述 在iOS的发展历程中,IOS开发经历了三种主要流派:使用代码手写UI及布局;使用单个xib文件组织viewController或者view;使用StoryBoard来通过单个或很少的几个文件构建全部UI。而在最近几年的开发中,苹果对 Storyboard 的开发力度也不断增强,添加了更多功能和特性,大大方便了界面的开发、适配以及提升代码性能。 我们来看看三种方式的主要区别: 手写页面和逻辑代码 如果你的目的是写一些可以高度重用的控件提供给其他开发者使用,那毫无疑问最好的选择应该是使用代码来完成UIVi
在2017年1月,新开源的react-navigation库备受瞩目。它有类似于原生版性能的体验效果,可能会成为未来RN导航组件中的主力军。该库包含三类组件: (1)StackNavigator:用
这是一篇有故事的文章 --- 来自一个weex在生产环境中相爱相杀的小码农 故事一: Build 虽然weex的口号是一次撰写,多端运行, 但其实build环节是有差异的, native端构建需要使用weex-loader, 而web端则是使用vue-loader,除此以外还有不少差异点, 所以webpack需要两套配置。 最佳实践 使用webpack生成两套bundle,一套是基于vue-router的web spa, 另一套是native端的多入口的bundlejs 首先假设我们在src/views下开
对于app而言,一款应用往往涉及到很多的页面,而页面之间的跳转Android和iOS实现也各不相同。在iOS上,系统为我们提供了UINavigationController控件用来专门控制页面的跳转,iOS的实现思路很清晰,为按钮添加action事件,点击之后跳转到指定的页面即可。例如: //定义一个Button,点击后跳转到另一个页面 UIButton * button=[UIButton buttonWithType:UIButtonTypeSystem]; button.frame=C
需求描述 上上周接到了新的项目,移动端需要做一个底部有五个导航,点击不同的导航页面主体显示不同的页面,其中两个页面是自己做,而另外三个页面是引用另外三个网址,其中两个网址为内部项目,另外一个为外部(涉及跨域)。 问题 考虑再三后最省时间成本的就是使用iframe,虽然在移动端使用,我的内心是很拒绝的,不过其他方案调研了下都不太符合现状。每点击一次加载一个新的iframe,比较懒,所以两个新页面也做成了iframe,在做的过程中出现了如下问题,这里总结一下: 1.嵌入的iframe页面无法滚动 2.met
收到推送的准备: 首先至于说消息推送的原理,证书配置等等这些我在这里就不在累述,有很多写的很好的文章相信您已经可以搞定这块,这里我重点讲下各种情况下的跳转处理。 点击推送触发的几个方法: ios7.0之前 - (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo{ // App 收到推送的通知 NSLog(@"********** ios7.
如果要在小程序中使用 web-view 组件,则首先需要开发者账号不仅是该小程序的开发者而且还有网页开发权限,这需要在该小程序关联的公众号里面绑定开发者账号为开发者。不然在开发工具里面会弹窗提示没有网页开发权限。提示如下:
对于开发者来说,如果 H5 页面能够直接嵌入到小程序那是再好不过了,而 web-view 组件正好就提供了这么个功能(个人类型与海外类型的小程序暂不支持使用)。简单来说它是一个可以用来承载网页的容器,会自动铺满整个小程序页面。 虽然这带来了很大的便利,但是也还是有很多需要注意的地方。
要求在分享出来的h5页面中,有一个立即打开的按钮,如果本地安装了我们的app,那么点击就直接唤起本地app,如果没有安装,则跳转到下载。
自从15年iOS开发市场大热之后,最近两年行情确实有点惨淡,看到很多企业招聘要求动不动就2年/3年以上iOS开发经验,确实有点无奈,感觉对初学者或者刚入门的小白们比较不友好。
上述这两大类都是可以实现的,技术层面没有任何问题。但是我并不建议在Flutter页面和原生页面之间来回穿插切换,原因如下:
1、iOS上的页面展示和逻辑 1.1 iOS的MVC设计模式 在介绍iOS的页面展示之前,我们需要先知道iOS应用的运行逻辑和设计模式。MVC即Model,View,Controller(模型,视图,控制器)。 View上展示的东西,由Model来定义 View上展示的逻辑,由Controller来控制 Controller同样负责初始化Model,和传递Model的信息给View 用户在View层中所进行的创建或修改数据的操作,通过Controller对象传达出去,最
在这个流量为王的互联网背景下,移动端的H5页面显然在导流上承担着重要作用,在H5页面上,我们对引流的需求有两种:
首先,页面上用的是plupload组件,在wkwebview上存在两个坑需要修复才能正常使用。
如果说构成视图元素的基本单位是组件,那么构成应用程序的基本单位就是页面。对于拥有多个页面的应用程序而言,如何从一个页面平滑地过渡到另一个页面,是技术框架需要考虑的问题。
首先,先登录官网(https://perfdog.qq.com/),点击注册按钮:
前言 随着用户的需求越来越多,对App的用户体验也变的要求越来越高。为了更好的应对各种需求,开发人员从软件工程的角度,将App架构由原来简单的MVC变成MVVM,VIPER等复杂架构。更换适合业务的架构,是为了后期能更好的维护项目。 但是用户依旧不满意,继续对开发人员提出了更多更高的要求,不仅需要高质量的用户体验,还要求快速迭代,最好一天出一个新功能,而且用户还要求不更新就能体验到新功能。为了满足用户需求,于是开发人员就用H5,ReactNative,Weex等技术对已有的项目进行改造。项目架构也变得更加的
导语 | 在 Flutter 和原生混合开发的场景里,路由是绕不开的一个话题。但业内的方案中仍存在内存异常,对官方底层的修改也需要不断踩坑。我们在项目实践中,抽离出了一套混合栈路由框架。对内存进行了进一步优化,清晰了对底层代码的修改,同时更易于 Flutter SDK 升级。文章作者:李鹏飞,腾讯IEG前端研发工程师。 一、背景及综述 Flutter 在目前跨平台方案中有更好的平台一致性以及更优的体验。但对于本身已有成熟的业务代码的项目来说,更多的是采用混合栈的方式,在不变更原有 App 业务的基
当点击输入的时候,光标的高度和父盒子的高度一样。例如下图,左图是正常所期待的输入框光标,右边是ios的input光标。
手Q天气是在手Q 6.0版本以上新增的功能,页面会展现当天的气温情况,已经五天温度折线图以及24小时温度图表等。 并且为了更好的交互效果,天气页面会根据8种不同的天气信息,展现相应的天气动画。如下雨下雪,飘云,日光闪烁等动画效果。
在组件中,有需要跳转页面,并且不让用户返回的情况,例如:支付、登录、注销等。请做一下修改:
最近给公司微信公众号,写了微信h5业务页面,总结分享一下前端开发过程中的几个兼容性坑,项目直接拿的公司页面,所以下文涉及图片都模糊处理了。
1、利用 itms-services 和 plist 文件,在线下载安装 ipa 文件。
作者:马蕾,腾讯高级工程师 前言 我们在日常工作中,做了很多线上指标统计。统计线上指标的意义,在 AB 阶段是评估算法效果收益,在全量上线后是监控线上服务质量,及时发现并定位解决问题。做指标往往并不难,但是做完指标之后,对指标的监控,经常被大家忽视。当发现指标异常之后,对根因的定位很困难。尤其是涉及多个团队的综合指标,经常需要为了定位根因拉齐后台,客户端,产品各个方向的骨干成员,讨论若干次才能有结论。本文主要分享在指标的监控和告警分析的一些经验,如何提升告警发生后的根因分析效率。 近期部门在大力推广数字
随着用户的需求越来越多,对App的用户体验也变的要求越来越高。为了更好的应对各种需求,开发人员从软件工程的角度,将App架构由原来简单的MVC变成MVVM,VIPER等复杂架构。更换适合业务的架构,是为了后期能更好的维护项目。
知晓程序员,专注微信小程序开发的程序员! 好久没写文章,今天总结一下小程序开发过程中遇到的问题,有不对的地方,欢迎各位指正~ 1、域名必须是HTTPS 非HTTPS的域名不被微信小程序允许 2、input组件placeholder字体颜色 写在placeholder-class里面的color并不生效,需要写在placeholder-style里面就可以了 3、wx.navigateTo无法跳转到带tabbar的页面 带有tabbar的页面,必须使用wx.switchTab进行跳转 4、tabbar在切换
我们通常会用屏(Screen)来称呼一个页面(Page),一个完整的App应该是有多个Page组成的。
知晓程序员,专注微信小程序开发。本文总结了在小程序开发过程中遇到的常见问题及解决方法,包括:1、域名必须是HTTPS;2、input组件placeholder字体颜色;3、wx.navigateTo无法跳转到带tabbar的页面;4、tabbar在切换时页面数据无法刷新;5、如何获取shareTickets;6、getPhoneNumber获取手机号;7、wx.previewImage图片预览;8、wx.playVoice音频播放;9、API老版本兼容;10、获取系统信息;11、如何去掉自定义button灰色的圆角边框;12、回到页面顶部;13、input textarea是APP的原生组件,z-index层级最高;14、小程序如何冷启动;15、一段文字如何换行;16、设置最外层标签的margin-bottom在IOS下不生效;17、小程序中canvas的图片不支持base64格式。此外,还介绍了如何设置页面样式、处理图片预览、音频播放、获取系统信息、处理网络请求等。
三层架构中,数据层和业务层都已经做过了简单的分享,最后,就剩下展示层了。本篇就给各位分享下我在展示层设计方面的一些经验心得。
领取专属 10元无门槛券
手把手带您无忧上云