Ionic -在Android上切换应用时显示闪屏 - 腾讯云开发者社区

文章/答案/技术大牛

发布

PWA入门：手把手教你制作一个PWA应用

但在面对一众的选择时很多同学略感迷茫，是学习ios还是android开发？是学习原生开发、混合开发（比如：Ionic)，还是使用react native或者flutter这样的跨平台框架？...可以在主屏上安装应用图标，b. 离线状态下访问，c. 获取消息通知，等等。。PWA的出现让大家看到了希望！对比原生应用那PWA和原生应用相比到底有何竞争力呢？...我们分别看一下原生应用和PWA的特点：原生应用：使用原生SDK和开发工具开发需要考虑跨平台，不同系统往往需要独立开发需要发布到应用商店才能下载使用可以安装到手机主屏，生成应用图标直接运行于操作系统上...省去了上架到应用市场的繁琐流程；d. 无需前往应用商店下载，用户使用起来也更加方便。...在 src/main.js 中添加对ionic的引用： ... import Ionic from '@ionic/vue' import '@ionic/core/css/ionic.bundle.css

4.3K4 0

【 Android 场景化性能测试】启动速度篇

.png] 下面是热启动（点击返回键后启动）的Log信息： [1509414269911_1248_1509414508922.png] 可以看到冷启动有两条耗时的日志，这是因为首次安装启动存在闪屏...，所以冷启动过程划分成了【点击图标-进入闪屏】以及【闪屏结束后点击按钮-进入应用首页】两个阶段。...关于框架的详细介绍可以参考TMQ系列文章《Android场景化性能测试-方向与框架篇》。...关于启动速度的用例执行比较简单，在此不赘述，每轮测试包括了冷启动与热启动，主要在test()内执行以下步骤：清除数据-启动应用-滑动闪屏进入首页-返回桌面-再次启动应用。...为了方便开发定位，我们还可以将生成的traceview文件提供给开发，具体的目录可以将鼠标放到traceview名称上，对应的目录就会显示出来。

2.2K1 0

您找到你想要的搜索结果了吗？

是的

没有找到

功能测试之app测试要点提取与分析

触屏快捷手势:两指、三指滑动　　长按、短按屏幕　　手机横屏、竖屏测试　　同时触摸不同的位置，同时进行不同操作--异常、闪退　　查看客户端的处理情况，是否会crash--崩溃、闪退、ANR（...如：安装APP后的加载页/动态视频显示,分享页面的产品logo显示　　注意: UI界面测试和web思路基本一致兼容性（操作系统、屏幕尺寸、分辨率）　　在不同操作系统正常使用( Android和IOS...source =index 　　分辨率适配:分辨率影响界面图标、文字大小,保证主流分辨率下页面显示完整,文字不被遮挡　　特定用户指定要求　　策略　　兼容性测试一般覆盖: android系统手机,选取市面上主流手机就行...、断网重连、断电、低电量、前后台切换、app切换　　手机端硬件上, 如:待机，插拔数据线、耳机、闹铃弹出框提示等操作　　常见bug场景　　爱奇艺视频播放过程中,微信通话/电话中断　　正常: app...对于离线(无网络)时,刷新获取新数据时,不能获取数据时能给出友好提示　　离线下,退出APP再开启APP时能正常浏览本地缓存数据　　离线下,切换到主屏幕再切回APP应用时可以正常浏览　　离线下,锁屏后再解锁回到应用前台可以正常浏览

2.8K3 0

【技巧】ionic3优雅解决启动前、后黑白屏问题

具体操作时，当我们点击桌面图标启动APP时，有时会闪一下黑色背景，有时黑色背景时间还比较长。...所以解决方式有好几种，可以看这两篇文章： Android启动页优化，去黑屏实现秒启动 Android启动页黑屏及最优解决方案具体应用在ionic上可以参照这个：快速解决ionic安卓主题启动时短暂的黑屏或白屏问题...我这里定义了两个样式，来满足不同喜好，使用时二选一就行了：第一个样式，screen.png作为ionic或cordova默认生成的启动屏图片，于是使用screen.png为背景图；第二个样式为透明主题。...我们可以验证一下，执行命令运行看效果： ionic run android 2、启动后黑白屏 ionic启动页使用了cordova-plugin-splashscreen这个插件，插件配置在应用的config.xml...(SplashScreenDelay)显示，延时时间到就关闭，这样就会出现一个bug：延时时间短，应用资源未加载完成，在dialog关闭后到首页显示这段过程中就会显示黑屏。

4K6 0

折叠屏开发指导系列⑤丨揭秘开发者不可不看的开发、调测工具

/studio/preview）模拟器支持开发者通过屏幕控制来触发折叠/展开操作，旋转屏幕方向以及快速操作；点击模拟器上对应按钮就可以在折叠态和折叠态之间切换。...3.3 用例3：应用在折叠和展开状态切换时业务不中断，应用页面显示和控件点击正常测试步骤： 1）在展开态下，打开应用的测试页面； 2）在应用的测试页面切换到折叠态，观察页面显示； 3）点击测试页面的所有控件和按钮...； 4）在折叠态下，打开应用的测试页面； 5）在应用的测试页面切换到展开态，观察页面显示； 6）点击测试页面的所有控件和按钮。...预期结果： 2）应用页面在状态切换过程中，不要出现页面重启、闪退；页面显示正常，不要出现页面截断、拉伸变形、放大模糊，按钮缺失等问题。 3）测试页面按钮和控件点击都能正常响应。...5）应用页面在状态切换过程中，不要出现页面重启、闪退；页面显示正常，不要出现页面截断、拉伸变形、放大模糊，按钮缺失等问题。 6）测试页面按钮和控件点击都能正常响应。

2.4K2 0

折叠屏丨华为高级工程师权威解读平行视界开发指南

平行视界简介平行视界以Activity为基本单位以左右窗口分离显示技术、双窗口生命周期管理、双窗口显示模式和切换逻辑为核心技术的实现应用内分屏的系统侧解决方案。...以往针对普通手机、平板、折叠屏手机这三款产品，因为屏幕尺寸大小有差异化，一个App需要同时开发和维护三个版本，导致工作量和成本都很大。现在只需要在手机版本的基础上，通过平行视界适配一个版本即可。...传统浏览方式VS平行视界浏览方式: 传统浏览方式用户操作：点击会话1→→输入→→返回→→点击会话2→→输入→→返回→→… 平行视界浏览方式用户操作：在左屏，点击会话1→→切换会话2→→… 优势：...如果没有这个参数会发生闪屏。闪一下Activity B再出来Activity C，体验效果不佳。配置上Activity B，系统就会帮助开发者处理这种问题。...分屏模式的配置样例下面是购物模式与自定义模式在页面跳转上的区别：需要注意的是：左右分屏的返回是不一样的，注意左图中的蓝色虚线，左屏C的返回会把B和C都销毁，左屏C的返回只是销毁C。

1.6K2 0

Android 性能优化—— 启动优化提升60％

2.启动主线程(main thread) 3.填充加载布局Views 4.在屏幕上执行View的绘制过程.measure -> layout -> draw 应用程序进程完成第一次绘制后，系统进程会交换当前显示的背景窗口...2000ms - diffTime. } 所以我们就可以动态的设置应用闪屏的显示时间，尽量让每一部手机展示的时间一致，这样就不会让手机配置较低的用户感觉漫长难熬的闪屏页时间（例如初始化了2000ms...，又要展示2000ms的闪屏页时间.）...，优化用户体验广告页优化闪屏页过后就要展示金主爸爸们的广告页了因为项目中广告页图片有可能是大图，APng动态图片，所以需要将这些图片下载到本地文件，下载完成后再显示，这个过程往往会遇到以下两个问题...或者是其它异步下载操作在广告页图片文件流完全写入后记录图片大小，或者记录一个标识在下次的广告页加载中可以判断是否已经下载好了广告页图片以及图片是否完整，否则删除并且再次下载图片另外因为在闪屏页中仍然有

2K2 0

Android 启动优化详解

、onLayout） (系统) 闪屏显示 (应用) MainActivity创建界面准备 (系统) 主页/首页显示 (应用）其他工作（数据的加载，预加载，业务组件初始化）窗口可操作启动问题分析...闪屏优化：预览闪屏（今日头条），预览窗口实现成闪屏效果，高端机上体验非常好，不过低端机上会拉长总的闪屏时长（建议在Android6.0以上才启用此方案）； //优点：避免点击桌面图标无响应 //缺点...，在栈上就进行销毁； 6....资源文件重排 Facebook 在比较早的时候就使用“资源热图”来实现资源文件的重排支付宝在《通过安装包重排布优化 Android 端启动性能》中详细讲述了资源重排的原理和落地方法；实现上都是通过修改...子线程install（不推荐）：闪屏页开一个子线程去执行MultiDex.install，然后加载完才跳转到主页, 需要注意的是闪屏页的Activity，包括闪屏页中引用到的其它类必须在主dex中，

5.6K8 5

【技巧】ionic3视频播放

npm install --save @ionic-native/streaming-media 其次在app.module.ts文件中的providers里添加StreamingMedia。...最后在调用的页面如下使用（详细使用请点插件链接进github查看）： import { StreamingMedia, StreamingVideoOptions } from '@ionic-native...然而当你运行查看效果时，会发现有问题：文字图标不显示，这个时候你可以修改node_modules下的源码(videoangular2或者@ionic)，一般我不建议(因为当删除并重新npm install...因为问题还存在着：当全屏时，尤其是android，会黑屏，可以开启GPU硬件加速来解决，但也并不是很好的方法，此时可以使用伪全屏——用样式模拟，这样又涉及到横竖屏切换的监听等等，这里不详细说明，有兴趣可以看看此文...最最后，就算你解决了上述问题，你还是需要大致处理下以下问题：视频滚出可视区域，应停止播放；当前视频点击播放，其它视频应该全部停止；全屏播放完成应退出全屏；播放时应自动隐藏播放控件，点击屏幕时显示播放控件

2.1K3 0

您在 Android SDK-API 27 升级时遇到问题了吗？

.+ 之类的，应替换为准确的版本号，但是和尚我用的是明确的 27.1.1，该方案失败； 4....和尚我好不容易解决掉问题一，紧接着进入程序各种闪退，如图： ? 2....为了横竖屏的切换，和尚我添加了一个 values-26 的文件夹，存放针对 Android8.0 以上手机的 style.xml，将 android:windowIsTranslucent 属性改为 false...以上，就解决掉进入程序闪退，和横竖屏正常切换的问题了。...但是如果有需求固定横屏或竖屏呢，很简单，在 Java/Kotlin 代码的 onCreate 中设置 setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT

1.1K4 1

用Ionic开发hybrid APP

toc 使用phonegap开发APP的优劣在此不必细说，快速，简单，跨平台，以及随着iOS，Android本身对webview优化所带来的不错的性能，便是其独有的优势。...而且私以为在目前激烈而又变化快速的移动APP市场环境下，用phonegap来开发APP未尝不是一种低成本mvp的方案，快速发布，成王败寇^-^ 为什么选用ionic 其中ionicframework便是...$ npm install -g cordova ionic $ ionic start myApp tabs $ cd myApp $ ionic platform add ios $ ionic build...启动图片(或称闪屏)插件：$cordovaSplashscreen，之所以推荐也必装这个插件的原因是，默认情况下启动图片时间停留较短，如果你的APP在这段时间没有完成数据加载或者视图渲染等(需要查询SQLite...APP中使用了，$cordovaTouchID 上述推荐仅仅是自己在开发Hipo的一点经验之谈，还是建议需得根据自己APP实际情况选用自己需要的插件。

2.6K1 0

介绍几个移动web app开发框架

项目主页：http://frozenui.github.io Github代码托管地址：https://github.com/frozenui/frozenui ionic Ionic提供了一个免费且开源的移动优化...Ionic既是一个CSS框架也是一个Javascript UI库。...Ionic遵循视图控制模式，通俗的理解和 Cocoa 触摸框架相似。在视图控制模式中，我们将界面的不同部分分为子视图或包含其他视图的子视图控制器。然后视图控制器“驱动”内部视图来提供交互和UI功能。...一个很好的例子就是标签栏（Tab Bar）视图控制器处理点击标签栏在一系列可视化面板间切换。 github。...Amaze UI Amaze UI 采用业内先进的 Mobile first 理念，从小屏逐步扩展到大屏，最终实现所有屏幕适配，适应移动互联潮流。

6.5K2 0

开发Hybrid App的技术选型

，android上字体大小通常以dp、sp作为单位。...高75px的按钮；在iphone6/7/8上（实际宽375px）我们实际看到的宽高是多少呢？...(在iphone6/7/8上) = 37.5px; 不难看出，只需要将这个单位作为除数即可计算出所需要的值；六、打包工具开发完成之后使用hbuilder或cordova打包成为android...十、swiper是个好东西 swiper常用于移动端网站的内容触摸滑动，是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端，Swiper能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效...4、项目结构如果项目成功运行，您看到的项目结构应该如下： www文件夹作为开发主文件夹； res文件夹存放app的闪屏图片和icon； plugins文件夹存放插件； plaatforms

2.7K3 0

【开发指南】（六）Ionic3从目录结构理解开发

(通过命令ionic cordova platform add 平台名称后生成，本来支持wp的，但看最新命令显示貌似已经移除了，见如下): StreamdeMacBook-Pro:appetite woodstream...：android、ios等平台图标、启动屏资源，在此目录下的资源通过下述命令会把资源按分辨率生成到原生项目目录中，省却自己逐个调整分辨率及拷贝的繁琐工作: ionic cordova resources...-main.ts：启动模块入口； assets：样式、图片、字体、脚本等静态文件； pages ：开发页面，含html、ts、css； theme ：主题文件夹，里面可以放置多个主题文件，方便切换主题...； ---- components：自定义组件（公用、可复用模块）； directives：自定义指令（注入到组件上为组件添加功能）； pipes：自定义管道（用于格式化显示数据）； providers...而压缩打包混淆等都是ionic框架内部处理了，所以我们只需专注于页面的实现，那最最简单的开发步骤就是，在pages里面新建一个页面，写好逻辑，然后在app.module.ts添加配置即可。

3.2K1 0

Jenkins mac上配置ionic android

1、下载nodeJS nodeJS官方网站：下载最新版本查看是否成功安装： shell输入： ~/builder$ npm -v 5.x.x //注：这里会出现版本提示，此为显示样例，实际情况应视具体系统下载的版本...// 这里必须用root 用户如非root用户，请输入 'sudo su'转换查看是否成功安装： shell输入： // 切换回主登陆用户 ~/builder$ ionic -v 3.x.x...bash_profile 4.3、验证Android环境是否配置成功完成以上步骤后，请重启，然后在命令行中输入，如果显示adb各种信息，则AndroidSDK环境配置成功 ~/builder$ adb.../builder/Library/Android/sdk/platform-tools/adb ... 5、jenkins上配置项目SVN ?...0002.png 说明： 1、cd 即打开项目目录 2、在该目录下使用shell命令，install依赖包，并build项目最终显示结果 ..........

8121 0

启动优化

3.7K5 4

用APICloud如何开发出运行体验良好、高性能的 App

窗口切换：避免出现任何卡顿、闪屏、白屏等情况；动画效果流畅，不能出现丢帧的情况。...无论是在 Android 还是 iOS 上，APICloud 引擎会从整体上保证默认的窗口动画类型是性能最好的。...三星、小米等大屏 Android6.0 及以上手机，可以尝试在云编译的时候选择使用 Android 引擎渲染优化版本如果窗体所加载的静态网页内容比较多 (如：初始的 Dom 树很大或图片很多)，在 Android...导航切换：切换底部导航或顶部分类菜单的时候，要求切换体验平滑，切换过程不能出现白屏、闪屏等现象建议使用 FrameGroup 来实现 Frame 的切换，要按需合理配置预加载的 Frame 数量，每个...列表中的头像等缩略图，宽高应控制在 250-300px 之间，小于这个范围大屏手机容易失真，大于这个范围消耗更多内存和性能。 20.

2.4K2 0

面试软件测试APP岗位，这些题目你不可不知！

分辨率兼容性：测试APP在不同分辨率和尺寸的设备上的显示效果。确保APP在不同分辨率下的UI布局和元素显示正常。网络兼容性：使用真机测试APP在不同网络制式下的运行情况。...无网络环境下测试：关闭网络连接，测试APP在无网络环境下的表现。关注APP各个功能在无网络情况下是否可用，页面切换是否正常，是否会导致闪退、卡死等异常情况。...关注弱网环境下APP各个页面是否显示完整，系统超时提示信息是否清晰明确。网络状态切换测试：测试在不同网络状态之间切换时（如WiFi切换到4G、4G切换到无网络等）APP的表现。...操作系统兼容性：测试APP在不同版本的Android、iOS等操作系统上的表现，确保兼容性良好。分辨率兼容性：测试APP在不同分辨率的屏幕上是否显示正常，确保界面布局合理、元素清晰。...四、首屏启动定义：首屏启动是指应用程序在启动后显示其主屏幕或用户首次看到的屏幕（即首屏）所需的时间场景：新用户首次使用：当用户首次下载并安装应用程序时，他们会看到应用程序的首屏启动。

4251 0

android刘海屏适配(刘海屏或圆角适配)

但是国内厂商为了快速抢占全面屏手机市场，在安卓系统8.1的基础上，硬件就弄出了刘海屏，例如华为nova 3e, oneplus 6, oppo r15, vivo x21，但是系统支持没有更上，没有一个统一的...，首先在设置中打开“开发者选项”，找到“绘图”，找到“模拟具有凹口的显示屏”，选择“长型显示屏凹口”。...如图：第二张图就是开启模拟选项后显示的切口样式，当然这个缺口是模拟的，目前真机普遍的刘海屏高度在90px左右，安卓模拟器模拟的刘海屏高度为144px。...第三张图是开启一个应用的闪屏页没有适配刘海屏的高度时候的样子，顶部出现了黑色区域。这个黑色区域是因为刘海缺口导致的整个界面整体向下移。...因为我们的闪屏页一般都是会全屏显示，那我们就需要适配刘海屏上的全屏样式了。坐好了，我开始吹一波了。

2.4K1 0

折叠屏丨华为专家深度解读折叠屏连续性和拖拽适配介绍

根据国内TOP1000主流应用折叠屏测试报告数据显示，当前折叠屏应用适配率为90%，整体表现优异，为后续应用功能创新打下了坚实的基础。...折叠屏连续性适配基础要求折叠屏连续性要求应用在屏幕折叠态、展开态以及切换过程中，保证业务的连续性和UI显示正常。当前连续性适配主要有如下两种方式，开发者可根据实际业务需要灵活选择。...连续性适配DEMO 1.1 连续性适配典型案例问题1：折叠展开重启、闪退用户在折叠态和展开态切换时，遇到较多的问题之一是应用重启，这大多是由于应用重启之前没有在Activity的onSaveInstanceState...避免在调用finish()或其他自行终止进程，否则会导致应用程序在设备折叠或展开时出现关闭、闪退等问题。...下载地址：https://developer.android.google.cn/studio/preview 3）屏幕在非折叠屏手机上可以通过命令修改手机的屏幕分辨率来进行模拟调试，详细方法可见下图

1.2K2 0

点击加载更多

PWA入门：手把手教你制作一个PWA应用

【 Android 场景化性能测试】启动速度篇

功能测试之app测试要点提取与分析

【技巧】ionic3优雅解决启动前、后黑白屏问题

折叠屏开发指导系列⑤丨揭秘开发者不可不看的开发、调测工具

折叠屏丨华为高级工程师权威解读平行视界开发指南

Android 性能优化—— 启动优化提升60％

Android 启动优化详解

【技巧】ionic3视频播放

您在 Android SDK-API 27 升级时遇到问题了吗？

用Ionic开发hybrid APP

介绍几个移动web app开发框架

开发Hybrid App的技术选型

【开发指南】（六）Ionic3从目录结构理解开发

Jenkins mac上配置ionic android

启动优化

用APICloud如何开发出运行体验良好、高性能的 App

面试软件测试APP岗位，这些题目你不可不知！

android刘海屏适配(刘海屏或圆角适配)

折叠屏丨华为专家深度解读折叠屏连续性和拖拽适配介绍

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐