Why flashlight now working with Camera? When I’m opening the camera, I can’t use the Flashlight Plugin anymore.
1 post - 1 participant
Why flashlight now working with Camera? When I’m opening the camera, I can’t use the Flashlight Plugin anymore.
1 post - 1 participant
Hello Guys, i am trying to do my ionic 4 app a seo Friendly.
But i dont know how to do this.
We are using Ionic 4.
I used a meta service to dinamic add description titles and other things…
But now we need to make a Social Share with a SSR.
1 post - 1 participant
This error i am getting when try to add admob in my ionic APP
ERROR Error: Uncaught (in promise): TypeError: Cannot read property ‘BannerAd’ of undefined
TypeError: Cannot read property ‘BannerAd’ of undefined
Currently, i am using admob-plus
From Installation | AdMob Plus
My Code
Package.json
“cordova”: {
"plugins": {
"admob-plus-cordova": {
"APP_ID_ANDROID": "ca-app-pub-9811029622947793/5972533670",
"APP_ID_IOS": "ca-app-pub-2188012581174186/3478090400"
}
}
}
APP.module.ts
import { AdMob } from ‘@admob-plus/ionic/ngx’;
providers: [ AdMob,]
Home.ts
import { AdMob } from ‘@admob-plus/ionic/ngx’;
import { Platform } from ‘@ionic/angular’;
constructor(private platform: Platform,private route: ActivatedRoute,private admob: AdMob,
// private admobFreeService: AdmobfreeService,
) {
this.platform.ready().then(async () => {
const banner = new this.admob.BannerAd({
adUnitId: 'ca-app-pub-9811029622947793/7232826218',
});
await banner.show();
this.admob.on('admob.banner.impression').subscribe(async () => {
await banner.hide();
});
});
}
Currently i am using ionic 6
Please Help me
1 post - 1 participant
The app crashes and I get a popup that says “unfortunately App has been stopped” on all devices.
I get this error
Type
java.lang.RuntimeException
java.lang.RuntimeException:
at android.app.LoadedApk.makeApplication (LoadedApk.java:1264)
at android.app.ActivityThread.handleBindApplication (ActivityThread.java:7086)
at android.app.ActivityThread.access$1500 (ActivityThread.java:265)
at android.app.ActivityThread$H.handleMessage (ActivityThread.java:2146)
at android.os.Handler.dispatchMessage (Handler.java:106)
at android.os.Looper.loop (Looper.java:257)
at android.app.ActivityThread.main (ActivityThread.java:8115)
at java.lang.reflect.Method.invoke (Native Method)
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run (RuntimeInit.java:626)
at com.android.internal.os.ZygoteInit.main (ZygoteInit.java:1015)
Caused by: java.lang.ClassNotFoundException:
at dalvik.system.BaseDexClassLoader.findClass (BaseDexClassLoader.java:207)
at java.lang.ClassLoader.loadClass (ClassLoader.java:379)
at java.lang.ClassLoader.loadClass (ClassLoader.java:312)
at android.app.AppComponentFactory.instantiateApplication (AppComponentFactory.java:76)
at android.app.Instrumentation.newApplication (Instrumentation.java:1158)
at android.app.LoadedApk.makeApplication (LoadedApk.java:1256)
1 post - 1 participant
Hi,
I’ve used this iBeacons plugin for my android app development
I’ve followed same approach but my iBeacons are not been shown in the result. Later i was searching in the forum then I came across to this thread.
which is exactly the same I facing to, but at the end of that thread the solution is to use “startRangingBeaconsInRegion”
I’ve changed it but still it is not discovering the beacons, I got a doubt on my beacons probably they got damaged, then I used iBeacon transmitter using a mobile app. so technically this should show in the scan result but it is not.
whereas other app like locate, it is able to identify my beacons and also the beacon simulation (iBeacon Transmitter) through mobile app.
could any one suggest me, how I can debug further to know why it is not discovering or resolve this issue?
just to share, so far what I did. Here is my code.
import { Component } from '@angular/core';
import { ChangeDetectorRef } from '@angular/core';
import {Platform} from '@ionic/angular';
import { IBeacon, IBeaconPluginResult } from '@ionic-native/ibeacon/ngx';
@Component({
selector: 'app-home',
templateUrl: 'home.page.html',
styleUrls: ['home.page.scss'],
})
export class HomePage {
uuid = '11223344-5566-7788-9900-aabbccddeeff';
//uuid = '51A895F4-3FF8-47E8-AD1D-6AA1533BE111';
beaconData = [];
beaconUuid: String;
scanStatus: boolean = false;
private delegate: any = null;
public beaconRegion: any = null;
public iosDevice: boolean = false;
constructor(
private readonly ibeacon: IBeacon, private readonly platform: Platform, private changeRef: ChangeDetectorRef
) {
this.platform.ready().then(() => {
this.requestLocPermissoin();
this.enableDebugLogs();
});
}
ngOnDestroy(){
}
ngOnInit() {
if (! this.platform.is('ios')) {
this.iosDevice = true;
}
}
requestLocPermissoin(): void {
// Request permission to use location on iOS
if (this.platform.is('ios')) {
this.ibeacon.requestAlwaysAuthorization();
console.log(`: request ios permisson`);
}
}
enableDebugLogs(): void {
this.ibeacon.enableDebugLogs();
this.ibeacon.enableDebugNotifications();
}
public onScanClicked(): void {
if (!this.scanStatus) {
this.startScanning();
this.scanStatus = true;
} else {
this.scanStatus = false;
this.stopScannning();
}
}
public stopScannning(): void {
// stop ranging
this.ibeacon.stopRangingBeaconsInRegion(this.beaconRegion)
.then(async () => {
console.log(`Stopped ranging beacon region:`, this.beaconRegion);
})
.catch((error: any) => {
console.log(`Failed to stop ranging beacon region: `, this.beaconRegion);
});
}
startScanning() {
// create a new delegate and register it with the native layer
this.delegate = this.ibeacon.Delegate();
this.ibeacon.setDelegate(this.delegate);
this.beaconUuid = this.uuid;
console.log('--===--- Bluetooth state: ', this.ibeacon.isBluetoothEnabled());
// Check bluetooth status Y.Q
this.ibeacon.isBluetoothEnabled()
.then(
(data) => console.log('-------=== Enabled', data),
(error: any) => console.error('-------=== Disabled', error)
);
// Subscribe to some of the delegate's event handlers
this.delegate.didRangeBeaconsInRegion()
.subscribe(
async (pluginResult: IBeaconPluginResult) => {
console.log('didRangeBeaconsInRegion: ', pluginResult)
console.log('found beacons size: ' + pluginResult.beacons.length)
if (pluginResult.beacons.length > 0) {
this.beaconData = pluginResult.beacons;
this.changeRef.detectChanges(); // Check for data change to update view Y.Q
} else {
console.log('no beacons nearby')
}
},
(error: any) => console.error(`Failure during ranging: `, error)
);
this.delegate.didStartMonitoringForRegion()
.subscribe(
(pluginResult: IBeaconPluginResult) =>
console.log('didStartMonitoringForRegion: ', pluginResult)
,
(error: any) => console.error(`Failure during starting of monitoring: `, error)
);
console.log(`Creating BeaconRegion with UUID of: `, this.uuid);
// uuid is required, identifier and range are optional.
this.beaconRegion = this.ibeacon.BeaconRegion('EST3', this.uuid);
this.ibeacon.startMonitoringForRegion(this.beaconRegion).
then(
() => console.log('Native layer recieved the request to monitoring'),
(error: any) => console.error('Native layer failed to begin monitoring: ', error)
);
this.ibeacon.startRangingBeaconsInRegion(this.beaconRegion)
.then(() => {
console.log(`Started ranging beacon region: `, this.beaconRegion);
})
.catch((error: any) => {
console.error(`Failed to start ranging beacon region: `, this.beaconRegion);
});
}
}
1 post - 1 participant
Not able to read PDF and .Docx files from location file:///storage/emulated/0/Download/. Also not able to read files recursively inside directories, Returning array length of ‘0’.
Please check this link:
https://github.com/apache/cordova-plugin-file/issues/508
listFilesinFolder(folderName) {
this.file.listDir(this.file.externalRootDirectory, 'Download'+'/').then((filesList) => {
console.log('filesList-->', filesList);
if (filesList.length !== 0) {
Promise.all(filesList.map(async (file) => {
if (file.isDirectory) {
console.log('Directory', file);
this.listFilesinFolder(file.fullPath.substring(1));
} else if (file.isFile === true) {
console.log('file', file);
}
}
})));
}
Android 11
“@ionic-native/file”: “^5.36.0”,
“cordova-plugin-file”: “^6.0.2”,Preformatted text
1 post - 1 participant
I am building a mobile application. When i want to test the login part on an android device i kept getting
{“headers”:{“normalizedNames”:{},“lazyUpdate”:null,“headers”:{}},“status”:0,“statusText”:“Unknown Error”,“url”:null,“ok”:false,“name”:“HttpErrorResponse”,“message”:“Http failure response for (unknown url): 0 Unknown Error”,“error”:{“isTrusted”:true}}
i searched online and implemented all recommendations but nothing seems to work. I have done ```
I am using nodejs as the backend API and i have enable cors on the index.js file
app.use(cors());
app.use(express.json()); // req.body
When i tried the application on the browser and Postman i did not get error but on the android mobile device nothing seems to work on Https:// and Http api domain
I will need a help on how this can be resolved
4 posts - 2 participants
Not understand my issue.
Reinstalled plugin adding reverse client id but it not works
pod 'FBSDKCoreKit', '11.1.0'
pod 'FBSDKLoginKit', '11.1.0'
pod 'FBSDKShareKit', '11.1.0'
pod 'Firebase/Messaging', '~> 7.4.0'
pod 'GoogleSignIn', '~> 5.0.2'
pod 'GoogleUtilities', '~> 7.2.2'
pod 'GoogleUtilities/Environment', '~> 7.6.0'
cordova plugin remove cordova-plugin-googleplus -variable REVERSED_CLIENT_ID=com.googleusercontent.apps.yyyyy-xxxxx
cordova plugin add cordova-plugin-googleplus --save -variable REVERSED_CLIENT_ID=com.googleusercontent.apps.yyyyy-xxxx
Android works, ios not (401 invalid client id)
1 post - 1 participant
I´m kinda lost with this, I have been reading that it isnt possible but it still appears in the docs:
Open with chrome if possible:
https://ionicframework.com/docs/layout/grid#:~:text=To%20customize%20the%20width,grid%2Dwidth%2Dxl%3A%201140px%3B
If it is possible where could i apply that --ion-grid-width-lg on scss? on the ion-grid element itself?
If it isn´t possible why is it on the docs? it doesn’t make that much sense
I dont have a problem using a media query myself, but seeing it on the docs made me want to do it that way, thanks in advance!!
1 post - 1 participant
I have a Ionic Angular applications (Android build)
I have the following:
getAllUsers() {
return this.dbInstance.executeSql(`SELECT * from ${this.db_table}`)
.then((data) => {
if (data.rows.length > 0) {
for (let i = 0; i < data.rows.length; i++) {
console.log('hello world');
console.log(JSON.stringify(data.rows.item(i)));
}
}
}).catch(e => {
console.log(JSON.stringify(e));
});
}
When I call getAllUsers an exception is automatically thrown with the following console log in android studio
2021-12-30 17:50:32.831 25077-25077/io.ionic.starter I/Capacitor/Console: File: http://localhost/src_app_login_login_module_ts.js - Line 421 - Msg: {"rows":{"length":3},"rowsAffected":0}
This is a log of the query from the console:
2021-12-30 17:50:32.815 25077-25292/io.ionic.starter V/Capacitor/Plugin: To native (Cordova plugin): callbackId: SQLitePlugin1622878251, service: SQLitePlugin, action: backgroundExecuteSqlBatch, actionArgs: [{"dbargs":{"dbname":"userParameters.db"},"executes":[{"sql":"SELECT 1","params":[]},{"sql":"SELECT * from userParametersTable","params":[]}]}]
I am wondering why this behaviour is happening and how to fix this issue.
Thanks
1 post - 1 participant
@ionic/angular-toolkit@5.0.3 depends on @angular-devkit/build-angular in version 12 which has indirect dependency on a package ansi-html in version 0.0.7.
I’ve updated my app to angular version 13 but github still keeps alerting you because the dependency tree has indirect dependency to ansi-html in version 0.0.7
is there any plan to update the angular toolkit?
1 post - 1 participant
Im trying to split the ui inside the IonItem a bit and therefore i need different rows and collumns. If i try to add a IonGrid inside my IonItem only the first row and column is displayed. If i View the page with development tools, i can see the other IonColums but in the example only ‘Label’ is displayed. Can somebody help me here please?
Im using Ionic6 and React.
<IonList>
<IonItem>
<IonGrid>
<IonRow>
<IonCol>
<IonLabel>Label</IonLabel>
</IonCol>
<IonCol>
<IonNote slot='end'>Something at 1 Row at and</IonNote>
</IonCol>
</IonRow>
<IonRow>
<IonCol>
<IonBadge slot='start'>Something on 2 Row at Start</IonBadge>
</IonCol>
</IonRow>
</IonGrid>
</IonItem>
</IonLIst>
1 post - 1 participant
I have an app and I need to do some local routing.
I have attached the file structure as an image
What I want to do is when I click on a button in the manage account it then navigates to accountdetailed.
Currently I have the routing in the app-routing.module.ts like so:
const routes: Routes = [
{
path: 'login',
loadChildren: () => import('./login/login.module').then( m => m.LoginPageModule),
canLoad: [AutoLoginGuard] // Check if we should show the introduction or forward to inside
},
{
path: 'nav',
loadChildren: () => import('./sidenav/sidenav.module').then(m => m.SidenavPageModule),
canLoad: [AuthGuard] // Secure all child pages
},
{
path: '',
redirectTo: '/login',
pathMatch: 'full'
},
{
path: 'accountdetailed/:id',
loadChildren: () => import('./manageaccount/accountdetailed/accountdetailed.module').then( m => m.AccountdetailedPageModule)
},
{
path: 'manageaccount',
loadChildren: () => import('./manageaccount/manageaccount.module').then( m => m.ManageaccountPageModule)
}
];
@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule {}
and here is my manageaccount code:
html:
<ion-list id="settingList" class="ion-no-padding">
<ion-item color="dark" id="yourDetailsBtn" (click)="showDetail('details', 'yourDetailsBtn')" button>
<ion-label class="white-text">Your Details</ion-label>
</ion-item>
</ion-list>
</ion-content>
manageaccount.page.ts:
import {Component, OnInit, ViewChild} from '@angular/core';
import {IonAccordionGroup, NavController} from '@ionic/angular';
@Component({
selector: 'app-manageaccount',
templateUrl: './manageaccount.page.html',
styleUrls: ['./manageaccount.page.scss'],
})
export class ManageaccountPage implements OnInit {
@ViewChild(IonAccordionGroup, {static: true}) accordionGroup: IonAccordionGroup;
constructor(
private navCtrl: NavController
) {}
ngOnInit() {
}
logAccordionValue() {
console.log(this.accordionGroup.value);
}
closeAccordion() {
this.accordionGroup.value = undefined;
}
showDetail(type, id) {
alert(id);
console.log(id);
this.navCtrl.navigateForward(['accountdetailed', id]);
}
}
manageaccount-routing.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ManageaccountPage } from './manageaccount.page';
const routes: Routes = [
{
path: '',
component: ManageaccountPage
},
{
path: 'accountdetailed/:id',
loadChildren: () => import('./accountdetailed/accountdetailed.module').then( m => m.AccountdetailedPageModule)
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class ManageaccountPageRoutingModule {}
So when I click on Your details button and it calls showDetail() method, how do I make it use the manageaccount-routing.module.ts instead of the main app routing
1 post - 1 participant
Hello dears
I’m using ionic 6 with angular 13
i have this code
<ng-container *ngFor="let estate of estates;let i = index">
<app-estate-card2 [estate]="estate"></app-estate-card2>
</ng-container>
<ion-infinite-scroll position="bottom" threshold="100px" (ionInfinite)="loadData($event)">
<ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
The ion-infinite-scroll works as it will run loadData method but it will not show any loading or “Loading more data…”" text at the bottom as i checked the infinite-loading class is always display:none
1 post - 1 participant
My goal is to develop a app where you can track your car drive. How can I make a map matching for a street drive? Are there good free tools oder how can I realize it?
Hope someone can help me!
maybe I can use this? But how can I import this in angularJS?
1 post - 1 participant
I’m currently developing a sign language translator Android application. I opt to used object detection and I wonder if google api would be able to support that. I want to use a customize data set as preference for object detection.
1 post - 1 participant
When I write Cordova build Android this message appear:
Checking Java JDK and Android SDK versions
ANDROID_SDK_ROOT=undefined (recommended setting)
ANDROID_HOME=D:\GIL\Sdk (DEPRECATED)
Failed to run “javac -version”, make sure that you have a JDK version 8 installed.
You can get it from the following location:
https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
1 post - 1 participant
I am downloading an image using @ionic-native/http
and it gets stored on the local drive. But when the app is trying to access the image its showing the error 404
I checked the path on the system. There the image exists.
Ionic info
cli packages: (/usr/local/lib/node_modules)
@ionic/cli-utils : 1.19.0
ionic (Ionic CLI) : 3.19.0
global packages:
cordova (Cordova CLI) : 8.0.0
local packages:
@ionic/app-scripts : 3.1.9
Cordova Platforms : ios 6.2.0
Ionic Framework : ionic-angular 3.9.2
System:
ios-deploy : 1.9.2
ios-sim : 8.0.2
Node : v10.0.0
npm : 5.6.0
OS : macOS
Xcode : Xcode 13.1 Build version 13A1030d
Environment Variables:
ANDROID_HOME : not set
Misc:
backend : pro```
1 post - 1 participant
I am new to configuring webpack and I am trying to integrate my ionic 4 app with the javascript-obfuscator / webpack-obfuscator. I would like to know how to integrate it. I have tried the following configurations but none of them works.
module.exports = (config, options) => {
config.plugins.push(new JavaScriptObfuscator({
rotateStringArray: true, // please customizable with options
}, ['exclude_bundle.js']));
}
/* ‘use strict’;
const JavaScriptObfuscator = require(‘webpack-obfuscator’);
module.exports = {
entry: {
'abc': 'index.js',
//'cde': './test/input/index1.js'
},
output: {
path: '/www',
filename: '[name].js' // output: abc.js, cde.js
},
plugins: [
new JavaScriptObfuscator({
rotateStringArray: true
}, ['abc.js'])
]
}; */
/* var WebpackObfuscator = require(‘webpack-obfuscator’);
// webpack loader rules array
rules: [
{
test: /\.js$/,
exclude: [
path.resolve(__dirname, 'excluded_file_name.js')
],
enforce: 'post',
use: {
loader: WebpackObfuscator.loader,
options: {
rotateStringArray: true
}
}
}
] */
1 post - 1 participant