I’d like to customize my ionic datetime to look like the one below, where there are only days of the week. In the documentation itself, I couldn’t locate anything informative. So, is there any way for me to customize my ionic datetime, or are there any ionic libraries that would serve the same purpose and allow me to achieve my desired output?
1 post - 1 participant
Hello,
I built my first iOS application (and macOS with electron) : Cupfeed. (I am a designer and not a developer)
I used VueJS with Ionic V6 and Capacitor for the native features. Other features will come soon. 
1 post - 1 participant
Hello Good morning, I develop some APPs with ionic, and I find myself with a design problem that happens to me a lot, and it is that I cannot put a large amount of data on the screen.
for example I have to make a section like the one in the image that is the browser frontend, it is impossible for me to make a design similar to that or I really don’t know how to do it, could you help me?
Thanks for all
1 post - 1 participant
Is anyone worked on Google Calendar API to sync events in google calendar? I’ve Ionic 4 application where i am creating events and trying to sync in google calendar but not able to sync it.
1 post - 1 participant
i’m trying to update cordova platform in my ionic application from android@9 to android@10
ionic cordova platform remove android
ionic cordova platform add android@10
but this command
cordova platform add android@latest
shows this error
ionic cordova platform add android@10
> cordova.cmd platform add android@10
(node:8084) [DEP0128] DeprecationWarning: Invalid 'main' field in 'C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\objectorarray\package.json' of 'dist/index.js'. Please either fix that or report it to the module author
(Use `node --trace-deprecation ...` to show where the warning was created)
Using cordova-fetch for cordova-android@10
Failed to fetch platform cordova-android@10
Probably this is either a connection problem, or platform spec is incorrect.
Check your connection and platform name/version/URL.
CordovaError: Error: npm: Command failed with exit code 1 Error output:
npm WARN deprecated tar@2.2.2: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
npm ERR! code 1
npm ERR! path C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: C:\Program Files\nodejs\node.exe C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli 'C:\\Program Files\\nodejs\\node.exe',
npm ERR! gyp verb cli 'C:\\Users\\Asus\\Desktop\\SyndicDigit01092021\\node_modules\\node-sass\\node_modules\\node-gyp\\bin\\node-gyp.js',
npm ERR! gyp verb cli 'rebuild',
npm ERR! gyp verb cli '--verbose',
npm ERR! gyp verb cli '--libsass_ext=',
npm ERR! gyp verb cli '--libsass_cflags=',
npm ERR! gyp verb cli '--libsass_ldflags=',
npm ERR! gyp verb cli '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using node-gyp@3.8.0
npm ERR! gyp info using node@16.13.2 | win32 | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp verb `which` failed python2 Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:198:21) {
npm ERR! gyp verb `which` failed code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb check python checking for Python executable "python" in the PATH
npm ERR! gyp verb `which` succeeded python C:\Users\Asus\AppData\Local\Programs\Python\Python39\python.EXE
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Command failed: C:\Users\Asus\AppData\Local\Programs\Python\Python39\python.EXE -c import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack File "<string>", line 1
npm ERR! gyp ERR! stack import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack ^
npm ERR! gyp ERR! stack SyntaxError: invalid syntax
npm ERR! gyp ERR! stack
npm ERR! gyp ERR! stack at ChildProcess.exithandler (node:child_process:397:12)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:390:28)
npm ERR! gyp ERR! stack at maybeClose (node:internal/child_process:1064:16)
npm ERR! gyp ERR! stack at Process.ChildProcess._handle.onexit (node:internal/child_process:301:5)
npm ERR! gyp ERR! System Windows_NT 10.0.19043
npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\Asus\\Desktop\\SyndicDigit01092021\\node_modules\\node-sass\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass
npm ERR! gyp ERR! node -v v16.13.2
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Asus\AppData\Local\npm-cache\_logs\2022-02-17T10_14_48_106Z-debug-0.log
[ERROR] An error occurred while running subprocess cordova.
cordova.cmd platform add android@10 exited with exit code 1.
Re-running this command with the --verbose flag may provide more information.
ionic info
Ionic:
Ionic CLI : 5.4.16
Ionic Framework : ionic-angular 3.9.5
@ionic/app-scripts : 3.2.4
Capacitor:
Capacitor CLI : 1.5.3
@capacitor/core : 1.5.3
Cordova:
Cordova CLI : 10.0.0
Cordova Platforms : none
Cordova Plugins : cordova-plugin-ionic-webview 4.1.2, (and 31 other plugins)
Utility:
cordova-res : 0.14.1
native-run : 1.4.0
System:
Android SDK Tools : 26.1.1 (C:\Users\Asus\AppData\Local\Android\Sdk)
NodeJS : v16.13.2 (C:\Program Files\nodejs\node.exe)
npm : 8.4.0
OS : Windows 10
any solution please ?
1 post - 1 participant
i’m trying to update cordova platform in my ionic application from android@9 to android@10
ionic cordova platform remove android
ionic cordova platform add android@10
but this command
cordova platform add android@latest
shows this error
ionic cordova platform add android@10
> cordova.cmd platform add android@10
(node:8084) [DEP0128] DeprecationWarning: Invalid 'main' field in 'C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\objectorarray\package.json' of 'dist/index.js'. Please either fix that or report it to the module author
(Use `node --trace-deprecation ...` to show where the warning was created)
Using cordova-fetch for cordova-android@10
Failed to fetch platform cordova-android@10
Probably this is either a connection problem, or platform spec is incorrect.
Check your connection and platform name/version/URL.
CordovaError: Error: npm: Command failed with exit code 1 Error output:
npm WARN deprecated tar@2.2.2: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
npm ERR! code 1
npm ERR! path C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: C:\Program Files\nodejs\node.exe C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli 'C:\\Program Files\\nodejs\\node.exe',
npm ERR! gyp verb cli 'C:\\Users\\Asus\\Desktop\\SyndicDigit01092021\\node_modules\\node-sass\\node_modules\\node-gyp\\bin\\node-gyp.js',
npm ERR! gyp verb cli 'rebuild',
npm ERR! gyp verb cli '--verbose',
npm ERR! gyp verb cli '--libsass_ext=',
npm ERR! gyp verb cli '--libsass_cflags=',
npm ERR! gyp verb cli '--libsass_ldflags=',
npm ERR! gyp verb cli '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using node-gyp@3.8.0
npm ERR! gyp info using node@16.13.2 | win32 | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` failed Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR! gyp verb `which` failed python2 Error: not found: python2
npm ERR! gyp verb `which` failed at getNotFoundError (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:13:12)
npm ERR! gyp verb `which` failed at F (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:68:19)
npm ERR! gyp verb `which` failed at E (C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:80:29)
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass\node_modules\which\which.js:89:16
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\index.js:42:5
npm ERR! gyp verb `which` failed at C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\isexe\windows.js:36:5
npm ERR! gyp verb `which` failed at FSReqCallback.oncomplete (node:fs:198:21) {
npm ERR! gyp verb `which` failed code: 'ENOENT'
npm ERR! gyp verb `which` failed }
npm ERR! gyp verb check python checking for Python executable "python" in the PATH
npm ERR! gyp verb `which` succeeded python C:\Users\Asus\AppData\Local\Programs\Python\Python39\python.EXE
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Command failed: C:\Users\Asus\AppData\Local\Programs\Python\Python39\python.EXE -c import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack File "<string>", line 1
npm ERR! gyp ERR! stack import sys; print "%s.%s.%s" % sys.version_info[:3];
npm ERR! gyp ERR! stack ^
npm ERR! gyp ERR! stack SyntaxError: invalid syntax
npm ERR! gyp ERR! stack
npm ERR! gyp ERR! stack at ChildProcess.exithandler (node:child_process:397:12)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:390:28)
npm ERR! gyp ERR! stack at maybeClose (node:internal/child_process:1064:16)
npm ERR! gyp ERR! stack at Process.ChildProcess._handle.onexit (node:internal/child_process:301:5)
npm ERR! gyp ERR! System Windows_NT 10.0.19043
npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\Asus\\Desktop\\SyndicDigit01092021\\node_modules\\node-sass\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd C:\Users\Asus\Desktop\SyndicDigit01092021\node_modules\node-sass
npm ERR! gyp ERR! node -v v16.13.2
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok
npm ERR! Build failed with error code: 1
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Asus\AppData\Local\npm-cache\_logs\2022-02-17T10_14_48_106Z-debug-0.log
[ERROR] An error occurred while running subprocess cordova.
cordova.cmd platform add android@10 exited with exit code 1.
Re-running this command with the --verbose flag may provide more information.
ionic info
Ionic:
Ionic CLI : 5.4.16
Ionic Framework : ionic-angular 3.9.5
@ionic/app-scripts : 3.2.4
Capacitor:
Capacitor CLI : 1.5.3
@capacitor/core : 1.5.3
Cordova:
Cordova CLI : 10.0.0
Cordova Platforms : none
Cordova Plugins : cordova-plugin-ionic-webview 4.1.2, (and 31 other plugins)
Utility:
cordova-res : 0.14.1
native-run : 1.4.0
System:
Android SDK Tools : 26.1.1 (C:\Users\Asus\AppData\Local\Android\Sdk)
NodeJS : v16.13.2 (C:\Program Files\nodejs\node.exe)
npm : 8.4.0
OS : Windows 10
any solution please ?
1 post - 1 participant
Hi guys need your assistance please. i have developed a chat with ionic and socket io deployed the node.js server on Heroku.com and android is working perfectly on device. i have an issue with IOS device l can’t connect to socket io when l test iPhone.
I need some pointers so far adding the line below in index.html doesn’t help
1 post - 1 participant
Hi friends. I am wondering if anyone has any input or can work with me to try and get this issue resolved: bug: service worker server.url not injecting capacitor · Issue #5278 · ionic-team/capacitor · GitHub
I seem to pretty much have exhausted all options and would appreciate any input.
1 post - 1 participant
Originally published at: Getting Started with Ionic 6 - Ionic Blog
Hey folks! In case you missed it, we hosted a stream on YouTube today all about Ionic 6. Lead Framework Engineer Liam DeBeasi showed us all the new features and component redesigns that came with Ionic 6, as well as what users can expect in the future. I also walked through the process of upgrading…
1 post - 1 participant
i use capacitor in my ionic/vuejs application.
i only want to change the name of the generated android app.
i have changed in capacitor.config.ts but itdoes not work!
i’m new to capacitor, can you please give me a hand ?
1 post - 1 participant
import { Platform } from ‘@ionic/angular’;
constructor(
private platform: Platform,
)
this.platform.ready().then(() => { });
1 post - 1 participant
Looking for developing a dry cleaning app according to the current market trends and tech stacks.
1 post - 1 participant
Hi, i am developing kind of voip app. I am using xcode 13.2.1 and testing on iOS 15. Communication is working over webrtc. When i try same app in browser and go to background everything is working ok and i can see orange status bar that some app is listening to microhpone. When i launch the same app using capacitor, everything is wokring ok until i send app to background. Then i can only hear incoming audio but i cannot see orange status bar and microphone is dead. And here comes the strage thing. While the app is in background and i launch some other app using audio and then quit this other app, i can hear the audio from my app in background BUT now also the mic is working with my app in background. But htere is still no status bar telling me that there is na app in background using mic. When i put my app in foreground and back in background then again the mic is dead.
I am using @mozartec/capacitor-microphone to request mic permissions on app start which works becasu mic works in foreground. In xcode i have added background modes capabilities for audio and voip.
What am i missing please?
1 post - 1 participant
i want to display ion-modal Sheet Modal on the top of screen.
i was looking on css but nothing work
any guidelines please ?
3 posts - 2 participants
I’m working on a project which required ion model to be appear in ion-tabs Router Outlet but it appears on patent RouterOutlet
The function to open ion-model is in one of the child tab which is.
async presentPlayerModule(index){
const modal = await this.modalController.create({
component: PlayerComponent,
swipeToClose: true,
componentProps:{profile:this.profiles[index],image:this.images[index]},
presentingElement:this.ionRouterOutlet.nativeEl
});
return await modal.present();
}
Second one is ion-model I want it to appear such that tab bar should be present at the bottom.
2 posts - 2 participants
I just found out about Ionic and Capacitor, and so far they seem pretty nice. But I’m concerned - I’m a very small time independent developer and I want to use the following features:
But I can’t afford hundreds of dollars a month (Paid annually…). Are there enough good free community plugins that I can do all these things without paying for Enterprise? What can’t I do without Enterprise?
3 posts - 3 participants
In @ionic/angular 6.0.1, the ion-datetime Component, with presentation="date-time", fails to update the view when the time is selected. However, the model is updated, as reflected by the view updating to the correct time for a visible split-second after pressing the Done button.
The relevant html is: (see note at the bottom regarding the ionChange)
<ion-modal class="datetime-modal" trigger="open-meeting">
<ng-template>
<ion-content>
<ion-datetime
formControlName="datetime"
(ionChange)="onChangeMeetingField()"
[showDefaultButtons]="true"
[min]="minStartDate"
[minuteValues]="SCHEDULING_MINUTE_VALUES"
presentation="date-time"
></ion-datetime>
</ion-content>
</ng-template>
</ion-modal>
A video demonstrating the behavior can be found here. Dropbox - ion-datetime-presentation-bug.mov - Simplify your life
Removing the ionChange does not correct the issue. FYI, its role is to update the When string that displays after the modal is dismissed (as shown in the video above).
3 posts - 2 participants
Hello,
I am creating simple calendar app and I would love to use new features from v6, like sheet modals for creating events modals (same as google calendar). I would like the user not to have to close the modal to scroll the calendar.
I don’t know if it’s even possible since i set: backdropDismiss: false, showBackdrop: false, Bottom layer is covered by ion-modal component, so tried to change height of the modal using cssClass property, but i dont know how not to spoil the sheet behavior
Have any of you done this before?
3 posts - 2 participants
We have an Ionic application which we have just migrated from Ionic 5 to Ionic 6 and Angular 10 to Angular 13. The app is served on the web as well as deployed to the native Android and iOS Stores.
When we deploy to the web server the app does not load and we get errors. The problem seems to be that the baseHref setting in our angular.json file is now being ignored.
In angular.json we have one configuration for our device builds and one for our web builds. In the web build configuration we have this:
"baseHref": "/web/"
This works find when we deploy out Ionic 5 / Angular 10 web files but when we deploy the migrated app we get errors loading asset files where it tries to load from
https://server-name/styles.7a9185c86c702a3f.css
where it should be loading from
https://server-name/web/styles.7a9185c86c702a3f.css
I can’t find any documentation anywhere for Angular 11, 12 or 13 that suggests there was a breaking change for this. Does anyone know what I need to do in my angular.json file to get this to work?
3 posts - 1 participant
Originally published at: Building with Stencil: Drag-and-Drop Components - Ionic Blog
Drag-and-drop functionality is growing more and more popular on the web, and with good reason. Drag-and-drop features are both intuitive and provide a really enjoyable user experience. In this tutorial, we’re going to take a look at how you can build your very own drag-and-drop components using Stencil. For this tutorial, we’re going to be…
1 post - 1 participant