ionic4 第4页

ionic4 做webapp ios下 input 等输入框键盘弹起在收回焦点错位问题

1.用ion-inpution-textarea的情况下onBlur(){if(this.platform.is('ios')){//处理微信浏览器ios输入框关闭时，无法正确缩回true顶部对齐false底部对齐document.body.scrollIntoView(true);}}2.alertController有输入的情况下this.alertController.create({hea

llxhzm·2020-08-14 07:21

解决Ionic4/Angular8+threejs(r111)的兼容性问题

开发环境说明当前的前端项目是基于Ionic4进行开发的,底层基于Angular8框架.项目中使用到了threejs库,之前版本用的是r0.108.0,最近做了个版本升级,升级到了r0.111.0,结果在编译的时候报了如下几种错误

moxiaomomo·2020-08-13 16:46

ionic4踩坑：no-referrer-when-downgrade

ionic4踩坑：no-referrer-when-downgrade问题：no-referrer-when-downgrade背景原因解决方案重新编译问题：no-referrer-when-downgrade

||一见生财||·2020-08-13 13:19

ionic4 踩坑：content 滚动到底部！

之前使用ionic3做项目，一直用的不错，自带的UI库基本可以满足一些小客户的需求，后来ionic4正式版出来了，号称“史上最高效”，抵挡不住诱惑啊，于是新项目就用ionic4，谁知各种坑，后面我一一介绍并会给出最直接有效的解决方案

||一见生财||·2020-08-13 13:48

ionic中的中文tts集成

因为业务需要,需要用到tts播报中文语音,但是目前插件库能搜到的tts插件几乎全是英文的(因为谷歌安卓系统本身的问题),所以只能自己借助中文tts语音包编写插件.目前插件已经更新到插件库,本人在ionic4

DLLCN·2020-08-09 12:38

Ionic4—IIS服务器下载APK、IPA和plist文件

目录一、概述二、步骤一、概述IIS可以作为静态资源服务器，只须新建一个网站，将其物理路径指向一个资源文件即可。默认情况下，IIS服务器无法下载APK、IPA和plist文件，如果需要下载，则需配置IIS的MIME类型，如下所示。(1)安卓安装包(.apk):application/vnd.android.package-archive(2)苹果安装包(.ipa):application/octet

空城里的往日时光·2020-08-09 01:41

Ionic4设置沉浸式状态栏

设置沉浸式状态栏体验比较好，而且有些页面设计需要频繁的改变状态栏的颜色，如果不使用沉浸式，就需要页面离开和进入单独设置状态栏背景色，这就导致会有一个非常明显的过度问题，但是使用沉浸式就可以避免这个问题，因为沉浸式状态下状态栏是透明的，只需要设置ion-header的背景色就可以了。app.component.ts中设置：this.statusBar.styleLightContent();//深色

zhuxiandan·2020-08-07 23:06

Ionic4基础组件-表单

1、ion-input单行文本框用户名:年龄:2、ion-toggle开关是否本科3、ion-radio-group、ion-radio单选按钮组支付宝微信4、ion-checkbox多选按钮组{{item.val}}5、ion-select选择框{{item}}6、ion-textarea多行文本框

吕阿蒙·2020-08-07 13:50

ionic4之列表栏的布局设置

页面效果设置一：标题栏居中显示解决关键：如图，单独让文字居中简单，可是这一行是由图标+文字构成的，如果只是设置text-align:center，没卵用。这时就需要分别设置图标宽度和文字宽度的百分比了。代码如下，实现居中效果审核列表设置二：选项卡如何设置成黑色背景白色字体待审核已审核设置三：对于列表中一行的布局，文字居左，右箭头居右这里有个大坑是这句带意思就是自带一个右箭头显示在本行的最右面。剩下

我能在河边钓一整天的鱼·2020-08-07 10:38

给ionic4增加推送通知FCM插件

开发环境ionic4+angular8+cordova增加推送通知插件//这两个插件都可以使用ioniccordovapluginaddcordova-plugin-fcm-ngnpminstall@ionic-native

人生如游戏---·2020-08-05 11:01

关于 Ionic4 对 NavController 进行跳转传递参数的解决方案 (NavParams)

首先我们先确认好传送方,接收方传送方demoSend的template：传送方Clickme传送方demoSend的Ts:import{Component,OnInit}from'@angular/core';import{NavController}from'@ionic/angular';import{Router}from'@angular/router';@Component({selec

恰巧-·2020-08-03 23:51

【前端】Ionic4 返回功能-NavController

前言小编所在的项目，前端Ionic--手机端项目需要版本升级，从Ionic3升级到Ionic4，其中需要使用返回功能，虽然Ionic4支持手机自身的返回键，但是对于用户来说，为用户在软件上面添加一个返回按钮

冯浩月·2020-08-03 19:07

ionic4集成高德地图踩坑（二）

使用TileLayer.Satellite添加卫星图到地图上。贴代码varsatellite=newAMap.TileLayer.Satellite();this.map=newAMap.Map(this.map_container.nativeElement,{view:newAMap.View2D({//创建地图二维视口zoom:14,//设置地图缩放级别rotateEnable:true,s

我不想学习了·2020-07-30 11:53

ionic4集成高德地图

一：key首先去高德开发者平台注册一个账号，然后在申请一个key需要注意的是获取安全码SHA1和PackageName1：获取SHA1打开cmd，目录定位在c盘/users/用户名文件/.android然后输入输入命令keytool-list-v-keystoredebug.keystore像这样：你可能会报错：密钥库文件不存在:debug.keystore，你可以打开系统User下的.andro

我不想学习了·2020-07-30 11:52

ionic4 集成高德地图

1.ionic项目打包apk，通过apk查看对应的sha1签名（可以通过androstudio，或者解压apk，cmd命令行进入\META-INF文件夹，执行keytool-printcert-fileCERT.RSA可查看），在高德地图获取key中，发布版安全sha1和调试版安全码都用这个，这样就可以获取正确的key（之前不懂在这个key上花了好久时间）2给ionic项目搭建高德地图环境cord

火铳锅·2020-07-30 08:54

ionic4引入高德地图

1.首先你要有一个高德地图的key2.在index.html中引入高德地图3.文件中写4.xxx.page.tsimport{Component,ViewChild,ElementRef}from'@angular/core';declarevarAMap;@Component({selector:'app-tab2',templateUrl:'tab2.page.html',styleUrls:

sa酱·2020-07-30 08:31

ionic4（angular）中如何引入第三方js代码库？

1把js文件放到src/assets目录下。例如我的js文件为remogeo.js2在src目录下的index.html中增加如下语句：3在需要调用js代码的地方作如何声明：declarevarRemoGeoLocation:any;其中的RemoGeoLocation是根据remogeo.js中的函数名定义的。下面是我的remogeo.js中代码：functionRemoGeoLocation(

一根羊毛_·2020-07-30 08:12

ionic4 未读消息提示

问题1.在我的页面，模仿微信，qq进行消息提示2.利用ionic框架学习1.之前在很多地方查询实现方法，发现如下解决办法//如果进行数据绑定ts:import{Events}from'ionic-angular';exportclassTabsPage{tip:number=0；constructor（publicevent:Event）{this.events.subscribe('tip:ch

刘雅娟-Demi·2020-07-29 10:50

ionic4本地通知Local Notifications

本地通知LocalNotifications1.安装插件ioniccordovapluginaddcordova-plugin-local-notificationnpminstall@ionic-native/local-notifications2.在app.components.ts中引用import{Component}from'@angular/core';import{Platform

盼盼盼·2020-07-29 09:59

【ionic4】常用组件的使用

1、tab页面的切换在ionic4中实现tab页面的切换需要借助segment组件，然后结合ngSwith来实现，具体实现如下：商品列表商品详情商品图文信息商品详情{{tab}}将tab放在toolbar

温娉哲·2020-07-29 09:28

【ionic4】——仿QQ消息提醒

做项目过程中遇到一个需求，就是有新的信息增加了之后要有一个数量显示，然后就想到了类似QQ的新消息提示效果如下：具体实现：HTML页面：CSS样式：TS中数据来源：新建一个Model：publicconditiongradeModelList=newArray();//查询所有期数下的入职信息GetOnschool(){//constapi='NO1System/no1/awardDetailsCo

温娉哲·2020-07-29 08:34

ionic4+angular6 混合移动开发 capacitor cordova

在ionic4，已更改为遵循每个

weixin_34124651·2020-07-28 18:09

Flutter概述、原理 & 跨平台历史及各方案比较 & Dart概述

从而产生跨平台方案；2.一开始：Web移动开发；优势：入门门槛低，会前端即可；缺点：没有原生流畅，性能比较差；3.接着，webView；原生和前端需要密切配合；流行框架：dcloud、cordova、ionic4

凌川江雪·2020-07-14 07:38

ionic4打包时遇到的种种问题

接触ionic的项目好几个月了，但是在打包时还会遇到各种莫名其妙的错误，今天起决定把遇到的错误都好好记录一下。Somethingwentwronginstallingthe“sharp”module报错截图（在我执行ioniccordovaplatformaddios命令后报错）：大概意思是我的sharp版本不对，百度了一通后终于找到执行以下命令可以正确安装上然后终于可以成功添加ios平台了期间遇

zebraMeat·2020-07-13 23:59

ionic4自定义底部Tab五个按钮的样式（按钮凸起效果）

ionic4自定义底部Tab五个按钮的样式效果图实现代码效果图实现代码tabs.page.html代码.tabs.page.html代码.ion-tab-bar{--border:0;height:110px

zebraMeat·2020-07-13 23:28

Ionic3.x/Ionic4.x从基础入门到项目实战视频教程

接近三个月都在加班加点的忙项目，没有像以前那样不断学习总结了，只是每周会关注学习Ionic3仿京东项目的后续更新视频教程，给自己找一点满足感，听说Ionic4.x也快出来了，不过正常Ionic4.x与Ionic3

yuanlaile·2020-07-13 23:28

基于ionic4、cordova搭建android开发环境

一、知识讲解本文基于ionic4+cordova构建android应用，首先做一下以下的知识梳理。1ionic是一套用于开发混合手机应用的开源h5框

SimpleCXD·2020-07-13 13:17

ionic4 ion-radio-group 获取选中的值

xxx.page.html请选择性别男女xxx.page.tsimport{Component,OnInit}from'@angular/core';@Component({selector:'app-change-my-sex',templateUrl:'./change-my-sex.page.html',styleUrls:['./change-my-sex.page.scss'],})ex

一只沙雕·2020-07-11 19:43

ionic4自定义插件

plugin_version1.0.0修改插件ioniccordovapluginlist列出所有已安装的插件ioniccordovapluginremovecom.plugin.testPlugin从ionic4

m0_37630809·2020-07-11 12:45

Web开发学习笔记:Ionic4开发自定义组件

1.在项目中创建一个自定义模块ionicgmodulemoduleName创建完成后会生成一个文件夹,文件夹中有个一个ts文件2.使用命令创建一个自定义组件(组件创建在上一步创建的模块文件夹下)ionicgcomponentcomponentName创建之后的文件夹结构3.在自定义模块的module.ts文件中引入创建的组件4.在需要使用自定义组件的地方引用自定义模块(引用模块之后就可以直接使用模

JustWantToFly·2020-07-10 22:10

ionic4自定义组件报错'ion-' is not a known element:

项目要把顶部返回按钮抽成单个组件，于是使用ionicgcomponentxx/xx/back生成了组件文件back.component.html中使用了ion-buttons然后在公共的sharedModule里引入了这个组件：@NgModule({declarations:[BackComponent],imports:[CommonModule],exports:[BackComponent]

游走走·2020-07-10 17:33

ionic4中实现时间线

前言：之前做番茄时，有做过时间线，这个功能，可以用来社区里人员留言，也可以用来介绍历史！实现过程：其实，一开始不知道怎么实现，就不停的再网上找例子，后来养成了一个坏习惯，一做就不懂脑子，上来就开始查，请用人家做好的，吃别人剩下的。参考链接：BeautifulTimelineComponentinIonic3ionictimeline目录结构：实现代码：about.page.html大米番茄发展历程

赵芬_Angel·2020-07-10 14:55

Ionic4 项目打包Android App步骤

1.安装Nodejs说明：安装完成nodejs的版本后，如果npm不是最新版本,运行npminstallnpm升级成最新的npm2.安装JDK下载java的JDK，双击下一步下一步安装jdk安装完成配置jdk的环境变量验证jdk是否配置成功（控制台中输入javac、java都能出来对应代码说明成功）3.安装AndroidStudio环境下载androidstudiohttp://www.andro

yw00yw·2020-07-10 14:27

ionic4 创建 angular项目 ReactNative下载第三方库出错解决Error: EPERM: operation not permitted, rename...

创建项目：ionicstartmyApptabs--type=angular错误提示：E:\Project\ReactNative\RNPracticePro>npminstallReact-native-tab-navigator--savenpmERR!Windows_NT10.0.14393npmERR!argv"D:\\Develop-Tools\\nodejs\\node.exe""D:

weixin_33853827·2020-07-10 07:45

关于ionic制作webApp打包的过程

Activitioncode中输入即可2.安装homebrew套件管理器3.安装node.jsbrewinstallnode4.安装ioniccordovasudonpminstall-gcordovaionic4.1

Jneth·2020-07-10 03:20

ionic混合开发ionic4 angular8）

ionic混合开发（ionic4angular8）ionic开发环境搭建1.node.js安装2.cnpm安装npminstall-gcnpm--registry=https://registry.npm.taobao.orgnpminstall-gcnpm

丢糖的小孩Una·2020-07-09 07:29

Ionic4学习笔记之从创建到打包

Ionic4学习笔记Ionic4项目从创建到打包开发环境开发工具项目创建项目启动添加Android平台打包成APKAPK签名完成Ionic4项目从创建到打包记录Ionic4项目从创建到打包的一系列步骤。

鸣人放暗屁·2020-07-08 08:07

Web开发学习笔记:Ionic4与SQLite数据库交互

以下代码使用IDE:vscode;语言模式:TypeScript1.使用命令创建一个serviceionicgserviceDBManager创建成功后目录中会有两个文件2.在app.module.ts中添加对DBManagerService类的引用同时在providers中添加DBManagerService类3.在DBManagerService类中编写对应的代码3.1在constructor

JustWantToFly·2020-07-06 22:49

【风雨欲来的Hybird】（1）Capacitor——为了原生，RN的下一个对手之一

其实Capacitor是ionic4的衍生品，如果说Stencil是跨框架组件开发，那Capacitor就是跨平台原生封装。为解决Webview的渲染性能瓶颈，相对于

langyuewu·2020-07-04 21:41

【ionic】生命周期函数

Ionic4中内置的生命周期函数ionViewWillEnter —当进入一个页面时触发(如果它从堆栈返回)ionViewDidEnter —进入后触发ionViewWillLeave —如果页面将离开触发

Betty-白靖·2020-07-04 19:32

【超详细】ionic创建app项目的全过程（入门学习教程记录）

写在前面本文用到的是ionic4+angular7+cordova4一开始接触，我分不清三者之前的关系，在想是不是全部都要用命令行装一遍。实则不然。ionic是在angular的基础上做的衍生物。

前~Duang~de 路上·2020-07-04 17:02

【ionic4】侧边栏ion-menu中的事件和方法

如何建立侧边栏？1、建立项目的时候，直接建立有侧边栏的项目ionicstartdemosidemenups：blank:一个空白的启动项目sidemenu：一个带有侧面菜单的起始项目，在内容区域中有导航tabs：具有简单选项卡界面的启动项目2、自己加右侧侧边栏1）首先打开：app.component.html（出现如下的代码）2）将下面的代码放入上图中（加入新的侧边栏）右侧MenuItemMenu

Nancy@·2020-07-04 06:31

Failed to list versions for com.android.support:support-v4问题解决

本机是win10，ionic4,cordova9打包android8，ionic3项目的时候出现下面问题：重装androidplatform也没用，重新建ionic3项目，把文件移进去也没用，在谷歌上搜各种改

ZJ_xunyicao·2020-07-01 15:28

Ionic4+创建项目并添加android平台支持和打包过程

创建项目在配置好ionic环境设置的前提下，在命令行窗口，在自己喜欢的地点比如桌面输入ionicstartmyappmyapp是项目名字这样需要选择模板，可供选择的模板有blank，tabs等，如下图这里用的是ionicstartmyapptabs安装过程中是用npm安装的，如果下载失败或者下载过慢（用ctrl+c终止），就下载cnpm，在命令行窗口输入npminstall-gcnpm再在项目目录

Ter cual·2020-07-01 13:43

ionic4+vue+cordova开发混合应用

ionic4之前，ionic只能和angular搭配使用，ionic4后把ionic抽离成四个版本，@ionic/core，@ionic/angular，@ionic/react，@ionic/vue来满足更多开发者的需求

weixin_34341117·2020-07-01 06:44

ionic4 -- angular 跳转页面

1、引入route并新建页面：ionic4与前辈们最大的不同就是通过angular引入了route，这样每次跳转的时候只需要直接跳转对应的路由地址就可以了，给了路由器上的解耦，也解决了原来的RXjs与Events

stormKid·2020-07-01 03:52

ionic4安卓真机调试

首先数据线连接电脑，，找到开发者选项打开usb调试，，测试：在电脑上打开360手机助手，用手机打开360手机助手，用电脑连接手机，看是否成功。执行命令：ionicrunandroid-l-c$ionicrunandroid-l-c[WARN]Cordovaenginechosenwithoutatargetplatform.Thiscouldcauseissues.Pleaseusethe--pl

我不想学习了·2020-06-30 11:50

ionic应用兼容Android9与10的经历

就是Android9,这一块原因大家自己google.突然,给用户开发的App无法在Android9与Android10上正常使用,甚至10上面无法进行安装,不得不拉取很早之前的代码进行问题排查.此前是ionic4

DLLCN·2020-06-27 02:38

ionic4 android打包

打包命令ioniccordovabuildandroid错误1：CouldnotfindaninstalledversionofGradleeitherinAndroidStudio,oronyoursystemtoinstallthegradlewrapper.Pleaseincludegradleinyourpath,orinstallAndroidStudio配置全局环境变量PATH最后加上

Double__D·2020-06-25 23:55

ionic4踩坑记

用了ionic4四个月了，遇到的坑今天整理一下1.标题栏的返回按钮ion-back-button，在页面刷新后不显示目前解决办法是重新写返回按钮2.ion-tabs组件，tab连续多次点击会出现页面返回按钮不显示的问题解决办法

盼盼盼·2020-06-22 23:22

推荐频道

ionic4

ionic4 做webapp ios下 input 等输入框 键盘弹起在收回 焦点错位问题