I can not find any oficial plugin yo work with Google Play games service. I can only find this Google Play Games Services - Ionic - The Cross-Platform App Development Leader but it does not give any help.
Thanks!
1 post - 1 participant
↧
How can I use Google Play Games Services with Ionic?
↧
Ionic React Disable Hardware Back Button
Hi,
I have an issue with my Ionic React App. Whenever an ion modal is open and I use the android hardware back button (or window.history.back() on chrome), my modal becomes unresponsive. I believe that is due to the fact that the route has been switched but the modal is still displayed, so we’re not able to interact with the modal.
At this point, I’m just trying to disable the hardware back button for all devices, as it sounds like the most reasonable solution, but I’m having trouble with that.
I tried to setupIonicReact to not allow swiping:
setupIonicReact({
swipeBackEnabled: false,
hardwareBackButton: false
});
but that didn’t block the functionality. I tried to listen to the backButton event and that should have blocked the functionality, but still nothing:/
import { App as CapApp } from '@capacitor/app';
CapApp .addListener('backButton', (e) => {
});
Does anyone know how I can accomplish disabling the hardware back button functionality using ionic react?
1 post - 1 participant
↧
↧
Various errors while using ionic ,error code 1
i am using $npm cordova platform add android
getting various errors
npm ERR! code 1
npm ERR! path E:\inc\todo\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 E:\inc\todo\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 ‘E:\inc\todo\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 (E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:13:12)
npm ERR! gyp verb which failed at F (E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:68:19)
npm ERR! gyp verb which failed at E (E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:80:29)
npm ERR! gyp verb which failed at E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:89:16
npm ERR! gyp verb which failed at E:\inc\todo\node_modules\isexe\index.js:42:5
npm ERR! gyp verb which failed at E:\inc\todo\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 (E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:13:12)
npm ERR! gyp verb which failed at F (E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:68:19)
npm ERR! gyp verb which failed at E (E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:80:29)
npm ERR! gyp verb which failed at E:\inc\todo\node_modules\node-gyp\node_modules\which\which.js:89:16
npm ERR! gyp verb which failed at E:\inc\todo\node_modules\isexe\index.js:42:5
npm ERR! gyp verb which failed at E:\inc\todo\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\prave\AppData\Local\Programs\Python\Python39\python.EXE
npm ERR! gyp ERR! configure error
npm ERR! gyp ERR! stack Error: Command failed: C:\Users\prave\AppData\Local\Programs\Python\Python39\python.EXE -c import sys; print “%s.%s.%s” % sys.version_info[:3];
npm ERR! gyp ERR! stack File “”, 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.22000
npm ERR! gyp ERR! command “C:\Program Files\nodejs\node.exe” “E:\inc\todo\node_modules\node-gyp\bin\node-gyp.js” “rebuild” “–verbose” “–libsass_ext=” “–libsass_cflags=” “–libsass_ldflags=” “–libsass_library=”
npm ERR! gyp ERR! cwd E:\inc\todo\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\prave\AppData\Local\npm-cache_logs\2022-02-04T04_02_08_349Z-debug-0.log
[ERROR] An error occurred while running subprocess cordova.
cordova platform add android --save exited with exit code 1.
Re-running this command with the --verbose flag may provide more information.1 post - 1 participant
↧
Adding third party package dependencies in iOS
Hi,
I am trying to create a plugin which uses the third party Swift package dependencies and it is building successfully, however, when the same plugin is used inside the capacitor app it shows the package dependencies are missing.
I tried adding the same dependency files to the capacitor app too, however, the issue remains the same.
Can anyone suggest or help me resolve this issue.
1 post - 1 participant
↧
Menu animation from top
Hi there,
is it possible to have ion-menu animation from top to bottom?
Thanks
1 post - 1 participant
↧
↧
Programmatically calling out an alert doesn't work in Ionic 6 React
In some cases we don’t want to use hooks or JSX to invoke an alert (or toast, loading etc). Using plain JS used to work in Ionic 5 but it stays hidden in the new version (including the official starter templates). Is there anything we could do to fix this?
const alert = document.createElement('ion-alert');
alert.header = 'Alert';
document.body.appendChild(alert);
alert.present();
Cheers
1 post - 1 participant
↧
Certificate transparency
Hi everybody, I’m looking for a solution to implement certificate transparency on my ionic/angular app.
I don’t much experience working with hybrid technology. I don’t have code.
The idea is to validate the certificate and show an alert when something happens, to say to the user the connection is secure.
Thank you! for any advice in this cases.
1 post - 1 participant
↧
Push notifications strategy on logout
What is the proper way to implement push notifications when you log out? I am still getting push notifications so trying to figure out what to do? Remove the tokens from the db? Tell the app to stop receiving pushes? I thought I had that figured out and await PushNotifications.removeAllListeners(); didn’t seem to work. What is everyone else doing?
And since I’m on that note, I am using Ionic/Vue and putting my logic for push notifications in App.vue. Is that the right place? Should it be in main.ts?
1 post - 1 participant
↧
Right align ion-select with popover
Right now I have an ion-select element on my page that I would like to have right aligned with a popover.
This is the code for my ion-select:
<ion-item lines="none">
<ion-select (ionChange)="selectLang($event)" [(ngModel)]="language" interface="popover" [disabled]="loading">
<ion-select-option value="en_US">{{ 'segments.en_US' | translate }}</ion-select-option>
<ion-select-option value="es_MX">{{ 'segments.es_MX' | translate }}</ion-select-option>
</ion-select>
</ion-item>
And the css for the html:
ion-select {
width: 100%;
text-align: right;
}
This is how it is displayed in the app:
When activated:
And the popover:
Can I get the activated backdrop to just cover the select and not the entire width of the ion-select, and how can I get the popover to be right aligned?
Appreciate any guidance.
1 post - 1 participant
↧
↧
Close DateTime popover after selecting date
↧
Ionic 6 with Capacitor 3.4 - Android 7.1.1 Not working
I am trying to get a new ionic 6, capacitor 3.4 application to work on an Android 7.1.1 device. It builds fine, runs in the browser, but when I deploy to the device all I get is a white screen. When I look at the error in Android Studio, I get the error shown in the screen shot below.
My app is very simple. I haven’t add any code, just created a tabs template project. Any help is appreciated.
1 post - 1 participant
↧
IOS app was unable to make http calls until Network Settings reset
Hello everyone. I have a bit of a weird one and I hope you can help point me in the right direction.
I recently released our app into Apple app store and on the first day a user reported being unable to log in. After some troubleshooting it was apparent that http calls to perform the login were not actually leaving the app (no network traffic registered on our end). The same application exists as a webapp and the user could log in fine from the browser (communicating to the same backend). After some fiddling the user was able to reset the network settings in iOS and the app was able to communicate and successfully log in. I had a customer support person reproduce and confirm the settings fix. Unfortunately I was unable to obtain logs from the user device to look into it in more detail, and have been unable to reproduce on my device or emulators.
Does this sound familiar? Looking for a potential cause and ways to mitigate.
I’m suspicious of one area: the original developers were storing the url for the backend in local storage after pulling it from the environment global (I’m not sure why).
ios 15.2 and 15.3
ionic 5.33
angular 11.2
capacitor 3.0.2
Any advice you could offer is appreciated!
1 post - 1 participant
↧
Ionic 6, capacitor and local database (SQLite?)
Hello,
I’m trying to find the best solution with the latest version of Ionic and Capacitor.
My main target is Android.
I have large amount of pictures (thousands) and I want to give the user the ability to add them to favourites, to mark them as read and to hide (ban) them.
I want also to give them the ability to search them by tags (there are also thsoudands of them) ansd save sets of tags.
I want to give them the ability to do it locally, on the device, without having to query a distant database to save those informations.
I think that I will have to do some SQL queries, so I’m not sure that ionic-storage will be enough for this practice?
I’ve found a lot of tutorials, but they are all outdated, using Ionic 5, Cordova, etc.
Do you know if there is a simple example repository with a orking up-to-date example of Ionic 6 + database working ith Capacitor?
3 posts - 2 participants
↧
↧
Suggestions for how to handle push notifications in project with auth wall?
In my projects I usually set-up my push notification initialization and operations in my app.component.ts file. However, when creating a project with an auth wall (login/registration), is it a better practice to have the push initialization moved to behind the authorization, or should you always keep the initialization in the app.component.ts and just figure out a way to only subscribe users once authenticated?
1 post - 1 participant
↧
Deploy to IOS - Ionic 5
Hi there,
I am (re-)deploying an app to App Store. The last update was in 2018 I belive and it´s in sore need of an update. I´ve now rewritten the app using Ionic 5 Vue instead of Ionic 4 Angular.
Now, what is the correct way of updating the App store info. Do I edit Config.xml or info.plist directly in the IOS project, or is there somewhere else I can edit the values, ex Version, app name etc.
If I updated the config.xml/info.plist should I add these to git?
Thanks folks
1 post - 1 participant
↧
Capacitor Clipboard IOS not working
Hi,
I am using the Capacitor/Clipboard plugin for an IOS app. And it seems to not work. I am guessing I have to enable something in the info.plist file somehow?
const copyToClipboard = (selectedItem: string) => {
const writeToClipboard = async () => {
await Clipboard.write({
string: selectedItem,
});
};
};
This is the code I am using, copied directly from the plugin page (Capacitor - build cross platform apps with the web)
Thanks in advance.
2 posts - 1 participant
↧
Class not found error after Integrating Android library(.aar) file in the third party app
I am using Cordova 7.0/IONIC 3.20 project and successfully generated Android library file(.aar) to reuse in third party android application. And we have implemented custom Cordova plugin(com.global.banpi.library.ValidatorPage) to interact with native platform.
But while running the third party app after integration getting Class not found exception. Can any one help the cause of the error.
The below is the implementation in third party App:
MainActivity.java
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Intent intent = intent = new Intent(this, com.sd.app.MainActivity.class);
intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
this.startActivity(intent);
}
}
build.gradle:
allprojects {
repositories {
google()
mavenCentral()
jcenter() // Warning: this repository is going to shut down soon
flatDir {
dirs 'libs'
}
}
}
dependencies{
implementation files('libs/android-debug.aar')
implementation files('libs/cordova.jar')
implementation fileTree(dir: 'libs', include: ['*.jar, *.aar'])
}
Getting the below error,
java.lang.ClassNotFoundException: com.global.banpi.library.ValidatorPage
2022-02-04 20:43:49.560 23643-23643/com.example.sdkproj W/System.err: at java.lang.Class.classForName(Native Method)
2022-02-04 20:43:49.560 23643-23643/com.example.sdkproj W/System.err: at java.lang.Class.forName(Class.java:454)
2022-02-04 20:43:49.560 23643-23643/com.example.sdkproj W/System.err: at java.lang.Class.forName(Class.java:379)
2022-02-04 20:43:49.560 23643-23643/com.example.sdkproj W/System.err: at org.apache.cordova.PluginManager.instantiatePlugin(PluginManager.java:489)
2022-02-04 20:43:49.560 23643-23643/com.example.sdkproj W/System.err: at org.apache.cordova.PluginManager.getPlugin(PluginManager.java:169)
2022-02-04 20:43:49.560 23643-23643/com.example.sdkproj W/System.err: at org.apache.cordova.PluginManager.startupPlugins(PluginManager.java:97)
And below is the custom plugin implemented my project: package name -
com.global.banpi.library.ValidatorPage;
And in config.xml,
<feature name="ValidatorPage">
<param name="android-package" value="com.global.banpi.library.ValidatorPage" />
<param name="onload" value="true" />
</feature>
1 post - 1 participant
↧
↧
I6 : segment : design : how to?
Any one know how to design ion-segment ?
Would like to use many on the same page
3 posts - 2 participants
↧
Using --color vs color: in css
I’m a bit confused as to how styling should be done, I’m wondering for example what is the difference between these two?
.photo-card-header__title {
--color: var(--ion-color-danger);
}
.photo-card-header__title {
color: var(--ion-color-danger);
}
If anyone knows of an open source ionic project that shows this well, feel free to share! I might pick it up from there
2 posts - 2 participants
↧
Ionic Storage - Create the DB
Using this API https://github.com/ionic-team/ionic-storage
when we create a database we call the following method
export const createStore = (name:string) => {
storage = new Storage({
name,
driverOrder: [Drivers.IndexedDB, Drivers.LocalStorage]
});
storage.create();
}
So we create it and then we set it a value
createStore(“providers”)
setDB(“providers”, JSON.stringify(providers))
Once it has already been created and a value has been stored. When the application is run again to read or write to the database. Is it necessary to recreate it? I mean, use the statement createStore
1 post - 1 participant
↧