@Zagrev wrote:
I am using the plugin with cordova-plugin-with-dependecy-updated.
But the notification is shown on notification bar when the app is in background or closed.
I wanna to get the notification in regardless the app is in foreground or background
Posts: 4
Participants: 2
@Jorisneo wrote:
Hello,
I have an issue with my ionic mobile app
When I build my project on browser my requests correctly send every headers. But if I’m on my android device,
I don’t have any headers and I have “Provisional Headers are shown” on my chrome debugger.
I’m using HttpClient angular.
Do any of you have any idea ?My ionic info:
Thanks in advance
Posts: 1
Participants: 1
@franciscocab wrote:
Hi, I have a general question regarding ionic. Not all plugins work for all platforms, in this case it can be installed in the same application?, for example: a video plugin for android and another video plugin for iOS and within the application indicate which one to use according to the platform. This is possible?
Posts: 1
Participants: 1
@aleksandar_struga wrote:
Hi,
I’m developing an email application using Ionic 4.
I want to connect the email providers that support IMAP on my application.
I managed to install the IMAP Client plugin https://www.npmjs.com/package/emailjs-imap-client and solved all of its problems using these 2 plugins:
ionic cordova plugin add cordova-plugin-chrome-apps-sockets-tcp
ionic cordova plugin add cordova-plugin-chrome-apps-runtime
The application is able to download emails, but the plugin is very unreliable which makes my whole feature unreliable.
The plugin downloads several email messages before stopping and returning the following error:
Error: Socket timed out!
at home-home-module-es2015.js:3607
at ZoneDelegate.invokeTask (polyfills-es2015.js:3741)
at Zone.runTask (polyfills-es2015.js:3518)
at invokeTask (polyfills-es2015.js:3815)
at ZoneTask.invoke (polyfills-es2015.js:3804)
at timer (polyfills-es2015.js:6000)Can anyone help me? Has anyone tried something like this on an Ionic project?
I have also tried to use a different IMAP plugin https://www.npmjs.com/package/imap, but I wasn’t able to make it work on an Ionic 4 project.
Posts: 1
Participants: 1
@elvy1111 wrote:
Good evening i have a problem…when I load the page with the map this error comes out =>
Failed to load 8100/svg/md-location-outline.svg:1
resource: the server responded with a status of 404 (not found).Greetings
Posts: 1
Participants: 1
@elvy1111 wrote:
Good evening i have a problem…when I load the page with the map this error comes out =>
Failed to load 8100/svg/md-location-outline.svg:1
resource: the server responded with a status of 404 (not found).Greetings
Posts: 1
Participants: 1
@youssefff wrote:
I’m using ionic 4 and Capacitor in my project, my problem is I get a white screen after the splash screen, I tried to edit capacitor.config.json but I still got the same problem :
"plugins": { "SplashScreen": { "launchAutoHide": false, "showSpinner": true, "androidSplashResourceName": "splash", "androidScaleType": "CENTER_CROP", "androidSpinnerStyle": "small", "iosSpinnerStyle": "small", "spinnerColor": "#ffffff", "backgroundColor": "#34ace0" }is there anyone show me how to solve this problem please?
Posts: 1
Participants: 1
@besart-hajdari wrote:
Hi everyone!
I experienced an issue with my App on an iPhone 8. The WebView does reload sometimes, when I use Capacitors Camera getPhoto function. This seems to happen more often, if I have some more apps open in background.
Some more infos I found out:
webViewWebContentProcessDidTerminategets called to reload the viewXcode logs before
webViewWebContentProcessDidTerminatedoes get called:[ProcessSuspension] 0x10d2d42d0 - ProcessAssertion::processAssertionWasInvalidated()** [ProcessSuspension] 0x10d2d4300 - ProcessAssertion::processAssertionWasInvalidated()** [assertion] Error acquiring assertion: <NSError: 0x2833e7630; domain: RBSAssertionErrorDomain; code: 2; reason: "Specified target process does not exist">** [assertion] Error acquiring assertion: <NSError: 0x2833dc3c0; domain: RBSAssertionErrorDomain; code: 2; reason: "Specified target process does not exist">**I hope someone can help me with this.
Posts: 1
Participants: 1
@KevinB1 wrote:
Hi, I was not able to customize the toolbar in ionic v5 as I did in Ionic v4.
A very simple case:
My footer:
<ion-footer class="ion-no-border"> <ion-toolbar> <ion-button expand="block" fill="solid" (click)="continue()"> {{'Continue' | localize}} </ion-button> </ion-toolbar> </ion-footer>With CSS:
ion-toolbar { --background: transparent !important; --ion-color-base: transparent !important; }Result in Ionic 4:
- Transparent Footer
- Button has my global button colors: (background: ion-color-primary + text: ion-color-light)
Result in Ionic 5:
- Footer is not Transparent
- Button in footer has the color defined for footer and ignores and CSS styling the button itself
What I would like to achive:
- The footer should be transparent
- The buttons should be the color (background + text) that I specify for them
The documentation says very little, but the breaking changes mentions:
This is most important when changing the global theme, as updating the toolbar color
will automatically update the hover states for all of the buttons in a toolbar, regardless of their fill and without having to know what each opacity is.How could I proceed?
Do I even have to use the toolbar in the footer, or can I put a button directly into it? (documentation says always use footer with toolbar with buttons)
Here is an image on how the dom looks like. You can see that the button in the toolbar uses the toolbar colors instead of the button colors:
Posts: 1
Participants: 1
@arturoMyHealthTeams wrote:
Hi Ionic community! I have a question regarding resource-files. I added a resource file in my config.xml.
<resource-file src="filename" target="assets/containers/filename". The file is under my android assets container folder but when I run theionic cordova build androidthe assets folder does not contain the containers folder. Is there’s something I’m missing with resources files and ionic cordova builds?
Posts: 1
Participants: 1
@itosoft wrote:
hi
how can i plave sidemenu to the rightside to support RTL app
open from right to left
i am using ionic4 on ionic stdio
Posts: 1
Participants: 1
@TaylorSmartTime wrote:
Looking for some help integrating the Capacitor plugins without the ionic framework. Hoping to do this in a modular format so we can utilize the plugin capability throughout the app. We are web-packing the file successfully, but continue to get the following error when trying to migrate to the page utilizing the browser functionality:
"
SyntaxError: Unexpected token ‘{’. import call expects exactly one argument.
URL: capacitor://localhost/kendo/js/jquery.min.js
jquery.min.js:4:22217"
Any suggestions are greatly appreciated.
Posts: 1
Participants: 1
@mirkobalzarini wrote:
Hi all,
I’m having problems using geolocation plugin in my Ionic 5 project with Angular (I’m using VisualStudio Code, if can help).
I’ve added cordova-plugin-geolocation to my project and then installed the @ionic/native geolocation plugin.
As indicated by the various tutorials that I found, I added to app.module.ts:
import { Geolocation } from ‘@ionic-native/geolocation/ngx’but when I try to insert it in providers list,
providers: [
StatusBar,
SplashScreen,
Geolocation,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
]VS Code reports me following problem:
Type ‘GeolocationOriginal’ is not assignable to type ‘Provider’.
Type ‘GeolocationOriginal’ is missing the following properties from type ‘any’: length, pop, push, concat, and 26 more.And so I can’t compile…
I really don’t understand what’s wrong in my code.
Thanks in advance.
Posts: 1
Participants: 1
@cyferhyb wrote:
i have some issues with logout in my app, i use Laravel passport used for authentication but after logout user data not reset for next user login
async logout(){ this.logoutconfirm(); } async logoutconfirm() { const alerts = await this.alertController.create({ message: 'Do you want to logout?', cssClass: 'log-buttonzz', buttons: [ { text: 'Yes', handler: async () => { await this.laravelIp.logout(); localStorage.removeItem('token'); await this.navCntl.navigateRoot('/'); } }, { text: 'No', role: 'cancel', handler: (blah) => { } }, ] }); await alerts.present(); }
Posts: 1
Participants: 1
@gkamlesh21 wrote:
The problem:
Currently, we support several protocols: 433MHz, Infrared, WiFi, Bluetooth, Zigbee, Z-Wave.
The problem: The device-inclusion process is different for every protocol. 433 MHz and Infrared devices are unidirectional. Thus, the devices need to be “taught”. WiFi and Bluetooth-Devices are automatically discovered - which is the easiest way for the user. Zigbee-devices are automatically discovered as long as the Zigbee-Devices are brought into “pairing”-mode. Therefore, there are a few help-screens that show the user how to “reset” their ZigBee-device to start device pairing.
Unfortunately, this principle will not work for the Z-Wave protocol.
Target-State
With Z-Wave devices, the Device-Inclusion-Workflow should be like that:
- The user needs to start the Z-Wave device inclusion process by pressing a button inside the app (This feature is currently not implemented yet into the Ionic App!!!).
- The user then needs to press the “Pair”-Button on the Z-Wave-Product
- Device-Inclusion starts
- The user now sees the screen “New device discovered” - and is redirected to the device list and can control the Z-Wave device
The problem just is: How is this new “feature” being implemented in the easiest possible way without destroying the existing UX-Flows that actually work and are easy to understand
Posts: 1
Participants: 1
@vabhi9650 wrote:
Godrej properties is soon coming up with a luxury segment project in Sector 107 Noida. After the success of Golf Links in Noida, Godrej is entering in new segment in Noida through this project. The Godrej Sector 107 Noida provides an extensive range of facilities and amenities which is encompassed by round the clock electricity, staffed security and constant running water. In addition to these fundamental provisions, the scheme also gives a long list of gym and recreational facilities.
Visit:- https://www.godrej-property.com/godrej-sector-107-noida/
Posts: 1
Participants: 1
@ocooldi wrote:
I am new to ionic native and followed the sample but it shows the white screen and not sure why…
here is my code;
- qr-scanner.page.ts
import { Component, OnInit } from ‘@angular/core’;import { Router } from ‘@angular/router’;
import { QRScanner, QRScannerStatus } from ‘@ionic-native/qr-scanner/ngx’;
// import services
import { AuthService } from ‘…/services/auth.service’;
import { StorageService } from ‘…/services/storage.service’;
@Component({
selector: ‘app-qr-scanner’,
templateUrl: ‘./qr-scanner.page.html’,
styleUrls: [’./qr-scanner.page.scss’],
})
export class QrScannerPage implements OnInit {
scanSubscription: any;
constructor(
private router: Router, private qrScanner: QRScanner, public authService: AuthService, public storageService: StorageService) { }
ngOnInit() {
}
scan() {
(window.document.querySelector('ion-app') as HTMLElement).classList.add('cameraView'); this.qrScanner.prepare() .then((status: QRScannerStatus) => { if (status.authorized) { this.qrScanner.show(); let self = this; this.scanSubscription = this.qrScanner.scan().subscribe((text:string) => { let splittedAry = text.split('qr_code?'); let saAray = splittedAry[1].split('&'); let saaText = saAray[0]; saaText.replace('payload=', ''); let saatAry = saaText.split(';'); self.authService.signin('register', saatAry[0], saatAry[1]); }); } else if (status.denied) { console.log("Camera permission permanently denied"); this.authService.myAlert("denied", "Camera permission permanently denied"); } else { console.log("Camera permision temporarily denied"); this.authService.myAlert("denied", "Camera permision temporarily denied"); } }) .catch((e: any) => { console.error('Error', e); this.authService.myAlert("error", "Sth went wrong"); });}
stopScanning() {
(this.scanSubscription) ? this.scanSubscription.unsubscribe() : null; this.scanSubscription=null; (window.document.querySelector('ion-app') as HTMLElement).classList.remove('cameraView'); this.qrScanner.hide(); this.qrScanner.destroy();}
goLogin() {
this.storageService.clearStorage(); this.router.navigateByUrl(this.storageService.step);}
ionViewWillEnter() {
this.scan();}
ionViewWillLeave() {
this.stopScanning();}
}
qr-scanner.page.scss
ion-content,body, .app-root, ion-app,.scroll-content,.fixed-content,page-app {background: none transparent !important;
}
ion-content {
–background: var(–ion-background-color, transparent);
img {
opacity: 0.5; max-width: 95%; max-height: calc(98% - 100px); position: fixed; top: 50%; left: 50%; /* bring your own prefixes */ transform: translate(-50%, -50%);}
}
.cameraView {
background: transparent !important;
}
.qrs-close-section {
position: fixed;
width: 100%;
bottom: 0;
.qrscs-close {
width: calc(100% - 4px);}
}
qr-scanner.page.html
<ion-button color=“dark” class=“qrscs-close” (click)=“goLogin()”>Close
btw QRScanner is included in providers of app.module.ts
As you see my qr-scanner.page.ts, i made the alert to show error of qr-scan but can not see any message. In my opinions, seems prepare().then(), this func is not working. Actually its so urgent and can anybody help me?
Thanks.
Posts: 1
Participants: 1
@briansone wrote:
Hi, I’m new to Ionic & working through the Ionic Angular Camera app example after running ‘ionic serve’ I get the following Typescript errors. I copy/pasted the example code from the web page to the already existing folders so it looks to me like the error is during compilation… any ideas?
Error:
ERROR in src/app/services/photo.service.ts:6:1 - error TS1128: Declaration or statement expected.
[ng] 6 public async addNewToGallery() {
[ng] ~~~~~~
[ng] src/app/services/photo.service.ts:6:14 - error TS1005: ‘;’ expected.
[ng] 6 public async addNewToGallery() {
[ng] ~~~~~~~~~~~~~~~
[ng] src/app/services/photo.service.ts:6:32 - error TS1005: ‘;’ expected.
[ng] 6 public async addNewToGallery() {
[ng] ~
[ng] src/app/tab2/tab2.page.ts:3:20 - error TS1005: ‘,’ expected.
[ng] 3 constructor(public photoService: PhotoService) { }
[ng] ~~~~~~~~~~~~
[ng] src/app/tab2/tab2.page.ts:3:32 - error TS1005: ‘,’ expected.
[ng] 3 constructor(public photoService: PhotoService) { }
[ng] ~
[ng] src/app/tab2/tab2.page.ts:3:48 - error TS1005: ‘;’ expected.
[ng] 3 constructor(public photoService: PhotoService) { }
[ng] ~
[ng]My code, src/app/services/photo.service.ts
import { Plugins, CameraResultType, Capacitor, FilesystemDirectory, CameraPhoto, CameraSource } from '@capacitor/core'; const { Camera, Filesystem, Storage } = Plugins; public async addNewToGallery() { // Take a photo const capturedPhoto = await Camera.getPhoto({ resultType: CameraResultType.Uri, source: CameraSource.Camera, quality: 100 }); }My code, src/app/tab2/tab2.page.ts:
import { PhotoService } from '../services/photo.service'; constructor(public photoService: PhotoService) { }
Posts: 1
Participants: 1
@Sweg wrote:
I am trying to display a map on my ionic app using Leaflet, but when I’m getting this error message:
TypeError: Cannot read property ‘addLayer’ of undefined
map: Map; constructor(private router: Router) { } ngOnInit() { this.loadMap(); } loadMap() { tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>' }) .addTo(this.map); }Can someone please tell me why this is happening?
Posts: 1
Participants: 1
SyntaxError: Unexpected token ‘{’. import call expects exactly one argument.