Hello,
Is there any documentation or tutorial on creating advanced capcitor plugins.
For example: GitHub - capacitor-community/camera-preview: Capacitor plugin that allows camera interaction from HTML code

Case 1

Most exciting part of camera-preview plugin is that it streams native camera to ionic.
Therefore I can create my ui in html and just point to html element where camera-preview can stream camera.

Case 2

Another exmaple I want to create inline vidoe player using underlaying native platform libraries

• for iOS → AVKit
• for Android → ExoPlayer

P.S: I need to play h265 videos.

• Safari can play h265 videos
• Chrome can not play h265 video yet "h265" | Can I use... Support tables for HTML5, CSS3, etc
  Therefore using <video/> tag will not work in my case.

Question

Is there any tutorial or documentation that shows:

• How to build capacitor plugin that can host native elements to ionic view?
• How we stream native view to ionic (iOS, Android)?

So far I found these reserouces for creating capcitors pluings

• Official capacitor docs
• How to Build Your Own Capacitor Plugin for Ionic (YouTube)

1 post - 1 participant

Read full topic

I integrated sign in with Apple but probably Apple not return Always email address and user info.

My app needs of email ti complete login flow.

I get jwt token. How can i decoder It and get user informazioni?

Can you help me?

Thanks

1 post - 1 participant

Read full topic

When using a slot end on my ion-note or ion-buttons inside my ion-item that uses a stacked label with the input, the note or buttons are aligned to the top. Is there a way to easily bottom align them?

1 post - 1 participant

Read full topic

Please describe the question in detail and share your code, configuration, and other relevant info.

Does anyone know if Ionic/Capacitor has support to use the sharing drawer that is so common in a lot of apps now?

1 post - 1 participant

Read full topic

We have an app running nicely using Angular & Ionic - we’ve noticed that when we transfer the App to a new device when setting up, it refuses to move past the initial splashscreen. We think it may be either something related to ionic or sqlite.

Has anyone seen anything similar? It’s obviously clearing somesort of cache or local storage?

1 post - 1 participant

Read full topic

Rather strangely I’m finding it difficult to get real-time logs for my cordova app in the iphone simulator. Is this a known issue?

I’ve tried opening the emulator’s system log but it doesn’t show my app’s logs even when I search for the bundle ID. And I’ve tried adding this environment variable without any luck

I’ve also tried looking directly in xcode but there’s no “open console” button when I select the simulator device in the “devices and simulators” screen. You can see in this screenshot, this is for a simulator that is currently running

And I’ve tried using this command xcrun simctl spawn booted log stream --debug --predicate 'subsystem == "com.example.yourapp"' from this suggestion but it only gives Error from getpwuid_r: 0 (Undefined error: 0) followed by a line with a blank cursor, as if no log entries are being sent. I can’t find any posts for that error that could be related to my situation.

I’m using xcode 13 on an M1 mac. Any ideas that could help?

1 post - 1 participant

Read full topic

Development of modules and components for the No-code platform

It is necessary to develop an online chat module

We use Laravel and Angular in the backend, mobile applications are generated by our CMS under the Ionic framework with Angular.

1 post - 1 participant

Read full topic

We looking Ionic developer for integrate RUTTER API into our NoCode Mobile Application Builder CMS.

We use Laravel and Angular in the backend, mobile applications are generated by our CMS under the Ionic framework with Angular (Ionic 6 and Capacitor3).

It is necessary to integrate the RUTTER API into the mobile applications created by our service so that the application can view the list of categories and products, view the history of purchases, and place an order.

Integration is carried out using our API GitHub - nwicode/nwicode_api

1 post - 1 participant

Read full topic

Hi, I have difficulties with a new ion-datetime in Ionic 6. We used ion-datetime with displayFormat=“HH:mm” to allow users set some duration. But in a new version displayFormat is not available anymore and when I use something like <ion-datetime presentation="time"></ion-datetime> there is AM/PM that I want to hide. The documentation says that these options are optional, but I cannot find how to disable them, could please help with that?

1 post - 1 participant

Read full topic

I have a fully functional ionic + cordova + oneSignal project, the push notifications are correctly received by the device and handled inside the app

Now I migrated to Capacitor, following the OneSignal instructions to setup the XCode project (adding push notification capacity and so on) but the device doesn’t receive the notification

The only difference I can notice is the file App.entitlements not present in the cordova version

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
	<key>aps-environment</key>
	<string>development</string>
</dict>
</plist>

I tried to change development to production without success.

Have you some hint?

1 post - 1 participant

Read full topic

Hello!

I am using Ionic Angular together with @videogular/ngx-videogular - npm in order to display video in my app. The video player can be opened in fullscreen mode with the help of the browsers fullscreen API.

However, Ionic modals and Ionic toasts does not show up inside the browser fullscreen mode by default.

What do I need to do to make the modals and toasts show up inside fullscreen mode?

Cheers!

1 post - 1 participant

Read full topic

I’ve created a brand new App and created all the certs etc.

In AppFlow my Dev builds work ok but when I try to automatically deploy to the App Store (iOS) I get this error:

[11:42:03]: Successfully exported and compressed dSYM file
[11:42:03]: Successfully exported and signed the ipa file:
[11:42:03]: /Users/ionic/builds/project-0/xxx.ipa
[11:42:03]: ------------------------------
[11:42:03]: --- Step: get_filename_ipa ---
[11:42:03]: ------------------------------
[11:42:03]: -------------------------------------
[11:42:03]: --- Step: upload_ipa_to_app_store ---
[11:42:03]: -------------------------------------
[11:42:05]: Ready to upload new build to TestFlight (App: xxx)...
[11:42:07]: Fetching password for transporter from environment variable named `FASTLANE_APPLE_APPLICATION_SPECIFIC_PASSWORD`
[11:42:07]: Going to upload updated app to App Store Connect
[11:42:07]: This might take a few minutes. Please don't interrupt the script.
[11:42:21]: [Transporter Error Output]: Your account information was entered incorrectly. (-20101)

[11:42:21]: Transporter transfer failed.
[11:42:21]: 
[11:42:21]: Your account information was entered incorrectly. (-20101)

I have no idea what this error really means - could it be that we have 2FA enabled on our App Store account and if so how would I get round this? (and actually, we have other apps that deploy ok to the App Store so would this error only occur for this new app?)

1 post - 1 participant

Read full topic

I want to implement a sip client that can receive the call or can make a call using sip server. Is there any library available for the same?

[Please note I don’t want to use WebSocket for this]

1 post - 1 participant

Read full topic

Hi all,

This just started happening today. I’ve done this a hundred times and I don’t think anything chaged on my system.

I build a brand new ionic application using ionic start. As soon as I start it and try to do a ionic build --prod I get a whole shlooo of errors. Here are the errors. There is more to the error but this form will not let me post that many characters

> ng.cmd run app:build:production
? Would you like to share anonymous usage data about this project with the Angular Team at
Google under Google’s Privacy Policy at https://policies.google.com/privacy? For more
details and how to change this setting, see https://angular.io/analytics. Yes

Thank you for sharing anonymous usage data. Should you change your mind, the following
command will disable this feature entirely:

    ng analytics project off

✔ Browser application bundle generation complete.

Warning: D:/IONIC/disablefirebase/src/environments/environment.prod.ts is part of the TypeScript compilation but it's unused.
Add only entry points to the 'files' or 'include' properties in your tsconfig.



./node_modules/css-loader/dist/runtime/api.js - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js):
Transform failed with 1 error:
error: Invalid version: "15.2-15.3"

./node_modules/css-loader/dist/runtime/noSourceMaps.js - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js):
Transform failed with 1 error:
error: Invalid version: "15.2-15.3"

./src/main.ts - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js):
Transform failed with 1 error:
error: Invalid version: "15.2-15.3"

./src/polyfills.ts - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js):
Transform failed with 1 error:
error: Invalid version: "15.2-15.3"

./src/global.scss - Error: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
HookWebpackError: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js):
Transform failed with 1 error:
error: Invalid version: "15.2-15.3"
    at tryRunOrWebpackError (D:\IONIC\disablefirebase\node_modules\webpack\lib\HookWebpackError.js:88:9)
    at __webpack_require_module__ (D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4979:12)
    at __webpack_require__ (D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4936:18)
    at Module.<anonymous> (D:\IONIC\disablefirebase\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[3].rules[0].oneOf[1].use[1]!D:\IONIC\disablefirebase\node_modules\postcss-loader\dist\cjs.js??ruleSet[1].rules[3].rules[0].oneOf[1].use[2]!D:\IONIC\disablefirebase\node_modules\resolve-url-loader\index.js??ruleSet[1].rules[3].rules[1].use[0]!D:\IONIC\disablefirebase\node_modules\sass-loader\dist\cjs.js??ruleSet[1].rules[3].rules[1].use[1]!D:\IONIC\disablefirebase\src\global.scss:5:111)
    at D:\IONIC\disablefirebase\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:432:11
    at Hook.eval [as call] (eval at create (D:\IONIC\disablefirebase\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)
    at D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4981:39
    at tryRunOrWebpackError (D:\IONIC\disablefirebase\node_modules\webpack\lib\HookWebpackError.js:83:7)
    at __webpack_require_module__ (D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4979:12)
    at __webpack_require__ (D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4936:18)
-- inner error --
Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js):
Transform failed with 1 error:
error: Invalid version: "15.2-15.3"
    at Object.<anonymous> (D:\IONIC\disablefirebase\node_modules\@angular-devkit\build-angular\src\babel\webpack-loader.js??ruleSet[1].rules[1].use[0]!D:\IONIC\disablefirebase\node_modules\@angular-devkit\build-angular\node_modules\@ngtools\webpack\src\ivy\index.js!D:\IONIC\disablefirebase\node_modules\css-loader\dist\runtime\noSourceMaps.js:1:7)
    at D:\IONIC\disablefirebase\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:432:11
    at Hook.eval [as call] (eval at create (D:\IONIC\disablefirebase\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)
    at D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4981:39
    at tryRunOrWebpackError (D:\IONIC\disablefirebase\node_modules\webpack\lib\HookWebpackError.js:83:7)
    at __webpack_require_module__ (D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4979:12)
    at __webpack_require__ (D:\IONIC\disablefirebase\node_modules\webpack\lib\Compilation.js:4936:18)
    at Module.<anonymous> (D:\IONIC\disablefirebase\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[3].rules[0].oneOf[1].use[1]!D:\IONIC\disablefirebase\node_modules\postcss-loader\dist\cjs.js??ruleSet[1].rules[3].rules[0].oneOf[1].use[2]!D:\IONIC\disablefirebase\node_modules\resolve-url-loader\index.js??ruleSet[1].rules[3].rules[1].use[0]!D:\IONIC\disablefirebase\node_modules\sass-loader\dist\cjs.js??ruleSet[1].rules[3].rules[1].use[1]!D:\IONIC\disablefirebase\src\global.scss:5:111)
    at D:\IONIC\disablefirebase\node_modules\webpack\lib\javascript\JavascriptModulesPlugin.js:432:11
    at Hook.eval [as call] (eval at create (D:\IONIC\disablefirebase\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)

Generated code for D:\IONIC\disablefirebase\node_modules\@angular-devkit\build-angular\src\babel\webpack-loader.js??ruleSet[1].rules[1].use[0]!D:\IONIC\disablefirebase\node_modules\@angular-devkit\build-angular\node_modules\@ngtools\webpack\src\ivy\index.js!D:\IONIC\disablefirebase\node_modules\css-loader\dist\runtime\noSourceMaps.js
1 | throw new Error("Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/@ngtools/webpack/src/ivy/index.js):\nTransform failed with 1 error:\nerror: Invalid version: \"15.2-15.3\"");

Generated code for D:\IONIC\disablefirebase\node_modules\css-loader\dist\cjs.js??ruleSet[1].rules[3].rules[0].oneOf[1].use[1]!D:\IONIC\disablefirebase\node_modules\postcss-loader\dist\cjs.js??ruleSet[1].rules[3].rules[0].oneOf[1].use[2]!D:\IONIC\disablefirebase\node_modules\resolve-url-loader\index.js??ruleSet[1].rules[3].rules[1].use[0]!D:\IONIC\disablefirebase\node_modules\sass-loader\dist\cjs.js??ruleSet[1].rules[3].rules[1].use[1]!D:\IONIC\disablefirebase\src\global.scss
 1 | __webpack_require__.r(__webpack_exports__);
 2 | /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 3 | /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 4 | /* harmony export */ });
 5 | /* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("D:\\IONIC\\disablefirebase\\node_modules\\@angular-devkit\\build-angular\\src\\babel\\webpack-loader.js??ruleSet[1].rules[1].use[0]!D:\\IONIC\\disablefirebase\\node_modules\\@angular-devkit\\build-angular\\node_modules\\@ngtools\\webpack\\src\\ivy\\index.js!D:\\IONIC\\disablefirebase\\node_modules\\css-loader\\dist\\runtime\\noSourceMaps.js");
 6 | /* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
 7 | /* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("D:\\IONIC\\disablefirebase\\node_modules\\@angular-devkit\\build-angular\\src\\babel\\webpack-loader.js??ruleSet[1].rules[1].use[0]!D:\\IONIC\\disablefirebase\\node_modules\\@angular-devkit\\build-angular\\node_modules\\@ngtools\\webpack\\src\\ivy\\index.js!D:\\IONIC\\disablefirebase\\node_modules\\css-loader\\dist\\runtime\\api.js");
 8 | /* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
 9 | // Imports
10 | 
11 | 
12 | var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
13 | // Module

Does anyone know what is happening?

Thanks
Darrell

3 posts - 2 participants

Read full topic

Hi,

I have an app that should upload a gif image to a small embedded device which accepts only small media files (< 10kb). I’m building an app which the user can select the gif but then the app would need to compress that image. I didn’t want to call a backend on my end to do this I was expecting I could do this at the device which is running an Ionic app with Angular.

Does anyone have any experience optimizing GIFs? I know we have libraries that optimize images but I tried using on gifs and they end up converting it to JPEG.

Thanks,

2 posts - 2 participants

Read full topic

i used this function to get rows count

CountPanier() {

      return this.dbInstance.executeSql(`SELECT count(*) FROM ${this.db_table}`).then((res) => {

        this.count=res;

        return this.count;

      });

but i have this error :
2022-01-31 19:55:47.765 20966-20966/io.ionic.starter E/Capacitor/Console: File: http://localhost/vendor.js - Line 59622 - Msg: ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of undefined (reading ‘executeSql’)
TypeError: Cannot read properties of undefined (reading ‘executeSql’)
at CrudService.CountPanier (http://localhost/main.js:249:32)
at HomePage.ngOnInit (http://localhost/main.js:489:19)
at callHook (http://localhost/vendor.js:55057:14)
at callHooks (http://localhost/vendor.js:55013:9)
at executeInitAndCheckHooks (http://localhost/vendor.js:54949:5)
at refreshView (http://localhost/vendor.js:63326:11)
at renderComponentOrTemplate (http://localhost/vendor.js:63465:5)
at tickRootContext (http://localhost/vendor.js:64912:5)
at detectChangesInRootView (http://localhost/vendor.js:64937:3)
at RootViewRef.detectChanges (http://localhost/vendor.js:76963:5)

how can i solve this ?

1 post - 1 participant

Read full topic

We’re Hiring a Front end developer at Vert.run

Check all the info and apply here: Notion – The all-in-one workspace for your notes, tasks, wikis, and databases.

1 post - 1 participant

Read full topic

Hello everyone,

I am using the <IonBackButton /> on a page, and when I click on it to return the main page who is an <IonList />, the ScrollBar goes automatically to the bottom of the <IonList />.
And I want it, to stands as it was at the last time, before opening the page who contains the <IonBackButton />.

Thanks for your helps.

1 post - 1 participant

Read full topic

I made an app with capacitor and react, the andoid build works perfetly, but when I try to make the iOS build on xcode, I get the white screen. I’m confident the code works because the android build doesn’t give me any errors.
Any tips?

1 post - 1 participant

Read full topic

I need to manage timeout of all backend request. This is my code…

    ...
    var httpHeaders = this.getHeader();
    return this.http.post(httpUrl, JSON.stringify(data), httpHeaders);
 

I tried to use timeout function but it is not present.

this.http.post(httpUrl, JSON.stringify(data), httpHeaders).timeout(10000);

What is the solution?

1 post - 1 participant

Read full topic