It did not work for me either, it does not even log what the issue is. It just doesn’t show on the UI.
Ionic5 Google Maps with Capacitor
Cannot find module '@ionic-native/Camera/ngx
Hi guys, I’ve been reading alot of forum posts regarding my problem but to no avail. I have a running app on my Windows 10 pc, but when I try to clone it to my Ubuntu 20.04 laptop, it won’t run and it will return 'app.module.ts error TS2307: Cannot find module ‘@ionic-native/Camera/ngx’.
I’m using ionic framework @ionic/angular 4.6.2 and my @angular/cli is 7.3.9. In my package.json I have @ionic-native/core ^5.0.0 and @ionic/camera ^5.19.1 dependencies.
My import for the camera is this : import { Camera } from ‘@ionic-native/Camera/ngx’
I’m new to Ubuntu and to ionic and angular as well, but this works fine in my Windows 10 pc so I really don’t know what it is I’m missing. Thanks in advance.
How can I dynamically schedule local notifications (or conditionally send them) in a Capacitor/React project?
Do you want this check (is moon phase the same as day before) even if the app isn’t opened each day?
Changing the default icon size for size="small" via CSS
I did as a matter of fact I do have classes for icon-lg, icon-md, icon-sm but applying it to the icon has no effect.
Maps in Ionic5 - Capicitor
Gents
I am building an app and since it is a green field application, I decided to go with Capacitor for obvious reasons. I need to have a map on the app, I have looked around but can hardly find anything that works well for me. My use case requires me to use something close to native. I would like my GPS/map to work offline for a few minutes if a phone loses connection. I have tried @agm/core and several other plugins but none of them seems to do the trick for me. Any suggestions?
Cheers
How can I schedule local notification specific day in every week?
Give this a shot for example (every monday):
import { Plugins, LocalNotificationSchedule } from '@capacitor/core';
const { LocalNotifications } = Plugins;
// FOR REFERENCE YOU DONT NEED THESE COMMENT LINES AS THE INTERFACE IS IMPORTED.
// interface LocalNotificationSchedule {
// at?: Date;
// repeats?: boolean;
// every?: 'year'|'month'|'two-weeks'|'week'|'day'|'hour'|'minute'|'second';
// count?: number;
// on?: {
// year?: number;
// month?: number;
// day?: number;
// hour?: number;
// minute?: number;
// }
// }
const mySchedule: LocalNotificationSchedule = {
repeats: true,
every: 'week',
on: {
day: 1
}
};
async function setNotifications() {
const notifs = await LocalNotifications.schedule({
notifications: [
{
title: "Title",
body: "Body",
id: 1,
schedule: mySchedule,
sound: null,
attachments: null,
actionTypeId: "",
extra: null
}
]
});
console.log('scheduled notifications', notifs);
}
setNotifications();
I hope you understand this, if not let me know and I’ll help break it out more.
Changing the default icon size for size="small" via CSS
Which Ionic Version do you use?
Changing the default icon size for size="small" via CSS
Normally you can adjust the Icon via just set the width and height, so i think it should work like:
ion-icon {
width: 48px;
height: 48px;
&[size="small"] {
width: 20px;
height: 20px;
}
}
Changing the default icon size for size="small" via CSS
Oh we’re using height/width here? The docs mentions the use of font-size. Yes, it works. Thanks for your help, @EinfachHans
Working with WebRTC in Ionic
import { NgxPermissionsService } from 'ngx-permissions';
………
perm = ["ADMIN", "MEDIA", "VIDEO_CAPTURE", "AUDIO_CAPTURE"];
.......
this.permissionsService.hasPermission(this.perm).then(success => {
:::::
[app.module.ts]
:::;
imports:
...
NgxPermissionsModule.forChild({
permissionsIsolate: true,
rolesIsolate: true}),
Backing up project Advice
Maps in Ionic5 - Capicitor
Hey there,
some People use the Javascript GoogleMaps Api in their App, but i would never recommend that. This just hasn’t the native feeling and feels not good. also it hasn’t the ability to be used offline.
There is a gread Plugin for GoogleMaps which uses the native SDK’s: See here.
Sadly this is not iOS Capacitor ready (Android is), but it has the plan, but the feature need to be founded: https://github.com/mapsplugin/cordova-plugin-googlemaps/issues/2781
Maps in Ionic5 - Capicitor
Please forgive my indugence, this is supposed to be a cordova plugin, would that work with capacitor?
Maps in Ionic5 - Capicitor
Read what i said. This Plugin works for Android with Capacitor, for iOS not yet.
Accurate Position
I am using the Geolocation plugin in my application to get the user’s accurate location in both ANDROID and IOS platforms (using ionic).
On Android it’s working fine, whereas on IOS 13 it seems like the location is being cached for a long time, even if we request an update to the location, the service is returning the old site coordinates
Is it a bug? Or is there something we’re missing? Below is the code we’re using:
let geolocationOptions: GeolocationOptions = {
maximumAge: 3000,
enableHighAccuracy: false,
timeout: 3000
};
this.geolocation.getCurrentPosition(geolocationOptions).then((position) => {
//same coordinates every time
});
fingerprint-aio style
have you found a solution?
BarcodeDetector API on Capacitor for PWA's
There are probably already compatible Capacitor or Cordova plugins that can do this if you need the functionality today.
How can I dynamically schedule local notifications (or conditionally send them) in a Capacitor/React project?
If that’s possible and what’s necessary, then yes. I’m less concerned about the actual implementation and more interested in actually getting this feature working, regardless of the approach.
Mousedown event not triggered immediately
I ran across the same problem. I solved it by replacing ‘mousedown’ by ‘pointerdown’.
*ngFor *ngIf Not working in a modal
Trying to user *ngIf and *ngFor in Modal but it does not work!!
in the console I get :
Can’t bind to ‘ngForOf’ since it isn’t a known property of ‘ion-list’.
Here is my module.ts of modal (add-food) :
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';
import { AddFoodPageRoutingModule } from './add-food-routing.module';
import { AddFoodPage } from './add-food.page';
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
AddFoodPageRoutingModule
],
declarations: [AddFoodPage]
})
export class AddFoodPageModule {}
and this is my code in HTML :
<ion-list padding *ngFor="let item of items">
<ion-item (click)="viewItem(item)">
{{item.title}}
<p>{{item.description}}</p>
</ion-item>
</ion-list>
item array :
public items = [
{ title: 'test 1', description: 'test 1' },
{ title: 'test 2', description: 'test 2' },
{ title: 'test 3', description: 'test 3' }
];
my app.module.ts :
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
providers: [
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule {}
