@MrTob wrote:
Hey Guys,
why is this not working
it is from the official github
Posts: 1
Participants: 1
@MrTob wrote:
Hey Guys,
why is this not working
it is from the official github
Posts: 1
Participants: 1
@rodrigojrmartinez wrote:
Hi Guys,
Did anyone tried installing and using the Lottie Splash Screen plugin from cordova to use custom animated splash screens? https://ionicframework.com/docs/native/lottie-splash-screen#usage
I’ve tried to install it myself on my Ionic 4 project but it seems the app crashed when running it, my ionic info is the following:
Ionic: ionic (Ionic CLI) : 4.9.0 (C:\Users\rodrigomartinezjr\AppData\Roaming\npm\node_modules\ionic) Ionic Framework : @ionic/angular 4.3.0 @angular-devkit/build-angular : 0.12.4 @angular-devkit/schematics : 7.2.1 @angular/cli : 7.3.0 @ionic/angular-toolkit : 1.3.0 Cordova: cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1) Cordova Platforms : android 8.0.0, browser 5.0.4 Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.0.1, (and 16 other plugins) System: NodeJS : v10.14.1 (C:\Program Files\nodejs\node.exe) npm : 6.7.0 OS : Windows 10
Thanks a lot!
Posts: 1
Participants: 1
@pefe wrote:
ion-searchbar { .searchbar-input-container { .searchbar-input { border-radius: 10px !important; --background: rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.07) !important; box-shadow: none !important; } } }
i have this style on my component’s scss and for some reason it doesn’t work. but when adding this same style on global.scss it works. any idea why?
Posts: 1
Participants: 1
@Ali112al wrote:
guys you can all download free mac application free by visiting
Posts: 1
Participants: 1
@Jerodis wrote:
Hi peoples!
I’m having terrible performance issues in ionic-v4 with the ion-slide element when adding many slides all at once. I have this same bit of code in ionic-v3 and it works seamlessly which is why I’m quite confused. Consider the code below:
.html<ion-slides [options]="sliderConfig" pager="false"> <ion-slide *ngFor="let item of displayedSlides"> <ion-card> {{ item.id }} {{ item.title}} </ion-card> </ion-slide> </ion-slides> <button (click)="setShortSlides()">Short Slides</button> <button (click)="setLongSlides()">Long Slides</button>
.ts
sliderConfig = { slidesPerView: 1, spaceBetween: 10, centeredSlides: true }; displayedSlides: SlidesObject[] = []; longSlides: SlidesObject[] = []; shortSlides: SlidesObject[] = []; ionViewDidLoad() { for (let i = 0; i < 122; i++){ this.longSlides.push({ id: i, title: 'long title ' + i }); } for (let i = 0; i < 12; i++){ this.shortSlides.push({ id: i, title: 'short title ' + i }); } this.displayedSlides = this.longSlides; } setLongSlides(): void { this.displayedSlides = this.longSlides; } setShortSlides(): void { this.displayedSlides = this.shortSlides; }
In ionic-v3 whenever you switch from the long list to the short list or visa versa the performance appears to be the same. However in ionic-v4 whenever I change from the long list to the short list the application updates without any issues. But when you change from the short to the long list the application hangs for a brief but noticeable amount of time, like a 1-2 seconds.
I’ve removed the ion-slide element and just used a div and the performance goes back to quick as expected but of course I then lack some of the functionality of the ion-slide.
Am I just totally misusing the element or is this maybe a bug?
Thanks in advance for any assistance!
Posts: 1
Participants: 1
@shiva11629 wrote:
Good morning everyone I want to make Bus tracker app so I am sending driver latitude and longitude to cloud firestore here I am using. Watchpistion() method to automatically update database when there is change in driver location. Now my question is that whenever user views driver location I need to get updated values from cloud firestore.
Is there any method to automatically read data when there is change in data?
Posts: 1
Participants: 1
@datawaslost wrote:
I’ve got an Ionic 4.5.0 app running on Angular and Capacitor, with a few very resource-intensive pages. I’ve tried to implement a few fade-in animations on these pages, and they only fire intermittently, often staying stuck at opacity:0. This seems to happen more frequently on older, slower devices, and with animations that fire on page load. I’ve tried implementing these animations both as pure CSS and within the angular animation library, and both get similar results.
Has anyone dealt with a similar problem? Info and sample code below.
Ionic: Ionic CLI : 5.2.1 (/usr/local/lib/node_modules/ionic) Ionic Framework : @ionic/angular 4.5.0 @angular-devkit/build-angular : 0.12.4 @angular-devkit/schematics : 7.2.4 @angular/cli : 7.2.4 @ionic/angular-toolkit : 2.0.0 Capacitor: Capacitor CLI : 1.1.0 @capacitor/core : 1.1.0 Cordova: Cordova CLI : 9.0.0 (cordova-lib@9.0.1) Cordova Platforms : ios 5.0.1
div { animation: fadein .2s ease-in; animation-fill-mode: both; } @keyframes fadein { from { opacity: 0; } to { opacity: 1; } }
@Component({ selector: 'app-home', templateUrl: 'home.page.html', styleUrls: ['home.page.scss'], animations: [ trigger('fadeInOutDelay', [ transition(':enter', [ // :enter is alias to 'void => *' style({opacity:0}), animate('200ms 300ms ease-out', style({opacity:1})) ]), transition(':leave', [ // :leave is alias to '* => void' style({opacity:1}), animate('200ms ease-out', style({opacity:0})) ]) ]) ] }) <div [@fadeInOut] *ngIf="!fade">Fade this in and out</div>
Posts: 1
Participants: 1
@moccker wrote:
When I create a new empty app and navigate to “Apps” in the Dev Hub, then click on the App, the hub just crashes.
— Update:
It now crashes even when clicking on “Apps”.
Posts: 1
Participants: 1
@rakesh_appycodes wrote:
I have an small application where user can edit their account and after edit user route back to my account page.
Situation:
My account Tab > Edit Account Page > Save and Route Back to My account Tab*
When User redirect to My account page none of the life cycle event trigger in ionic 4
Screenshoot: http://prntscr.com/oatlru [edit account page code ] , http://prntscr.com/oatlvz [My account page]
Posts: 1
Participants: 1
@ssaravananerd wrote:
Hi Team,
I have created an angular workspace with library and a web application. I would like to add an Ionic application with in the existing workspace. Can anyone guide me how can I add an new Ionic Angular application with existing angular workspace.
I have created workspace, library and angular web application using angular cli commands.
Thanks
Posts: 1
Participants: 1
@ioclaudio wrote:
Hi,
is there a way on an Ionic4 PWA to show the description of a button or of an icon (when the user goes with the mouse over it) with the ALT tag?
Probably it works only with images.Or there are other ways to do this?
<ion-col size="3"> <ion-button expand="full" (click)="changeUserRole()" color="warning" alt="Change the role of the user"> <ion-icon name="ribbon" alt="Change the role of the user"></ion-icon> </ion-button> </ion-col>
Thank you very much
cld
Posts: 1
Participants: 1
@AndrWeisR wrote:
This is a capacitor email plugin. I can’t get the demo to work at all in Android Studio 3.4.1 and @ionic/angular 4.0.0-beta.7 and @capacitor/core 1.1.0. I get 5 build errors like
ERROR: Unable to resolve dependency for ':app@debug/compileClasspath': Could not resolve project :capacitor-android-plugins.
If I try to use the sample code in a starter Ionic app, I get a runtime error:
E/Capacitor/Plugin/Console: ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'requestPermission' of undefined
Has anyone got this capacitor plugin to work at all?
Posts: 1
Participants: 1
@ahmedkhabkhab wrote:
I installed my app in Android and iOS. The first day, everything works fine. Then suddenly, the app stopped working on iOS. When I launch it, It crashes immediately. I opened settings and I listed all apps installed in my device. My app doesn’t appear. It looks like iOS has deleted it somehow. I removed iOS platform, updated plugins, added it again, compiled and build my app. It worked for a while then the same problem appeared.
{ "name": "Foo", "version": "0.0.1", "author": "Ionic Framework", "homepage": "https://ionicframework.com/", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/common": "^7.2.2", "@angular/core": "^7.2.2", "@angular/fire": "^5.1.2", "@angular/forms": "^7.2.2", "@angular/http": "^7.2.2", "@angular/platform-browser": "^7.2.2", "@angular/platform-browser-dynamic": "^7.2.2", "@angular/router": "^7.2.2", "@ionic-native/ble": "^5.8.0", "@ionic-native/core": "^5.0.0", "@ionic-native/splash-screen": "^5.0.0", "@ionic-native/sqlite": "^5.4.0", "@ionic-native/status-bar": "^5.0.0", "@ionic/angular": "^4.1.0", "@ionic/pro": "2.0.4", "ajv": "^6.10.0", "chart.js": "^2.8.0", "cordova-android": "8.0.0", "cordova-ios": "^5.0.1", "cordova-plugin-ble-central": "1.2.2", "cordova-plugin-compat": "1.2.0", "cordova-plugin-device": "^2.0.2", "cordova-plugin-ionic": "^5.3.0", "cordova-plugin-ionic-keyboard": "^2.1.3", "cordova-plugin-ionic-webview": "^3.1.2", "cordova-plugin-splashscreen": "^5.0.2", "cordova-plugin-statusbar": "^2.4.2", "cordova-plugin-whitelist": "^1.3.3", "cordova-sqlite-storage": "3.2.0", "core-js": "^2.5.4", "firebase": "^5.9.3", "g": "^2.0.1", "moment": "^2.24.0", "rxjs": "^6.5.2", "rxjs-compat": "^6.4.0", "sharp": "^0.22.1", "zone.js": "~0.8.29" }, "devDependencies": { "@angular-devkit/architect": "~0.12.3", "@angular-devkit/build-angular": "~0.13.0", "@angular-devkit/core": "~7.2.3", "@angular-devkit/schematics": "~7.2.3", "@angular/cli": "~7.3.1", "@angular/compiler": "~7.2.2", "@angular/compiler-cli": "~7.2.2", "@angular/language-service": "~7.2.2", "@ionic/angular-toolkit": "~1.4.0", "@types/jasmine": "~2.8.8", "@types/jasminewd2": "~2.0.3", "@types/node": "~10.14.2", "codelyzer": "~4.5.0", "jasmine-core": "~2.99.1", "jasmine-spec-reporter": "~4.2.1", "karma": "^4.1.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~1.1.2", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.4.0", "ts-node": "~8.0.0", "tslint": "~5.12.0", "typescript": "~3.1.6" }, "description": "An Ionic project", "cordova": { "plugins": { "cordova-plugin-whitelist": {}, "cordova-plugin-statusbar": {}, "cordova-plugin-device": {}, "cordova-plugin-splashscreen": {}, "cordova-plugin-ionic-webview": {}, "cordova-plugin-ionic-keyboard": {}, "cordova-sqlite-storage": {}, "cordova-plugin-ble-central": { "BLUETOOTH_USAGE_DESCRIPTION": " " } }, "platforms": [ "android", "ios" ] } }
ionic version: 5.2.0
cordova version: 9.0.0 (cordova-lib@9.0.1)
Posts: 1
Participants: 1
@deepakjionic wrote:
Hello Everyone,
I am creating an item reorder can anybody please help me i want to make that using long press on device.
Thanks For Your Response in advance
Posts: 1
Participants: 1
@ionicstudying wrote:
*pp.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 { AppComponent } from ‘./app.component’;
import { AppRoutingModule } from ‘./app-routing.module’;
import { HttpClientModule } from ‘@angular/common/http’;
@NgModule({
declarations: [AppComponent],
entryComponents: ,
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, HttpClientModule],
providers: [
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule {}app-routing.module.ts
import { NgModule } from ‘@angular/core’;
import { PreloadAllModules, RouterModule, Routes } from ‘@angular/router’;const routes: Routes = [
{ path: ‘’, redirectTo: ‘movies’, pathMatch: ‘full’ },
{ path: ‘movies’, loadChildren: ‘./pages/movies/movies.module#MoviesPageModule’ },
{ path: ‘movie/:id’, loadChildren: ‘./pages/movie-details/movie-details.module#MovieDetailsPageModule’ },
];@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule { }movie.service.ts
import { HttpClient } from ‘@angular/common/http’;
import { Injectable } from ‘@angular/core’;
import { Observable } from ‘rxjs’;
import { map } from ‘rxjs/operators’;export enum SearchType {
all = ’ ',
movie = ‘movie’,
series = ‘series’,
episode = ‘episode’,
}@Injectable({
providedIn: ‘root’
})
export class MovieService {
url = ‘http://www.omdbapi.com/’;
apikey = ‘a39fbbdc’;
constructor(private http: HttpClient) { }searchData(title: string, type: SearchType): Observable {
return this.http.get(’{this.url}?s={encodeURI(title)}&type={type}&apikey={this.apiKey}’)
.pipe(
map(results => {
console.log('RAW: ', results);
return results[‘Search’];
})
);
}getDetails(id) {
return this.http.get(’{this.url}?i={id}&plot=full&apikey=${this.apiKey}’);
}
}movies.page.ts
import { Component, OnInit } from ‘@angular/core’;
import { Observable } from ‘rxjs’;
import { MovieService, SearchType } from ‘…/…/services/movie.service’;
@Component({
selector: ‘app-movies’,
templateUrl: ‘./movies.page.html’,
styleUrls: [’./movies.page.scss’],
})
export class MoviesPage implements OnInit {results: Observable;
searchTerm = ‘’;
type: SearchType = SearchType.all;
constructor(private movieSerivce: MovieService) { }ngOnInit() {
}searchChanged(){
this.results = this.movieSerivce.searchData(this.searchTerm, this.type);}
}movies.page.html
movies {{ item.Title}}
Posts: 1
Participants: 1
@PrasenjitKhardaha wrote:
When adding cordova-camera plugin and try to build for android facing problem with the following error message…
Step 1: ionic cordova build android --debug
then the following error is displaying
Task :app:transformClassesWithMultidexlistForDebug FAILED
D8: Program type already present: android.support.v4.app.ActionBarDrawerToggle$DelegateFAILURE: Build failed with an exception.
- What went wrong:
Execution failed for task ‘:app:transformClassesWithMultidexlistForDebug’.com.android.build.api.transform.TransformException: Error while generating the main dex list:
Error while merging dex archives:
Learn how to resolve the issue at https://developer.android.com/studio/build/dependencies#duplicate_classes.
Program type already present: android.support.v4.app.ActionBarDrawerToggle$Delegate[ERROR] An error occurred while running subprocess cordova.
cordova.cmd build android --debug exited with exit code 1. Re-running this command with the --verbose flag may provide more information.
Posts: 1
Participants: 1
@Harikag wrote:
[{"mail":"XXXXXX@YYYYYY.com","checked":false},{"mail":"aaaa@ibbbbb.com","checked":false},{"mail":"xxxx@wwww.com","checked":false},{"mail":"qqqqqq@s.com","checked":false},{"mail":"a@s.com","checked":false},{"mail":"n@ico.com","checked":false},{"mail":"b@ethc.com","checked":false},{"mail":"s@sat.com","checked":false}] promptAlertForReply() { // this.showCheckbox(); let alert = this.alertCtrl.create(); // this.chatService.getIncludeLIst(); for (let i = 0; i < this.uniqueMails.length; i++) { // alert.setTitle(receipeints); alert.addInput({ type: 'checkbox', label: this.uniqueMails[i].mail, value: i.toString(), checked: this.uniqueMails[i].checked }) } alert.addButton('Cancel'); alert.addButton({ text: 'Okay', handler: data => { for (let i = 0; i < data.length; i++) { console.log('Checkbox data:', data[i]+ " email is "+this.uniqueMails[data[i]].mail); this.unCheckArray(data); this.receipeintsList = this.receipeintsList + this.uniqueMails[data[i]].mail+ ";"; } // this.chatService.sendReply(this.editorMsg, this.receipeintsList, this.message[index].msgFrom, // this.message[index].room, this.message[index].refId, this.message[index].tetraId, // this.message[index].parentRefId); } }); alert.present(); }
This is my unCheckArray
unCheckArray(selectedIndexesList){ //making all list check status as false for(var i=0;i<this.uniqueMails.length;i++){ this.uniqueMails[i].checked=false; } //making all list check status to true for(var i=0;i<selectedIndexesList.length;i++){ this.uniqueMails[selectedIndexesList[i]].checked=true; } }
So is there any other best way to check and uncheck staus to maintan in array when alert is prompted
Posts: 1
Participants: 1
@jangofett44 wrote:
Hello there! I’ve been developing in ionic 4, and this ‘bug’ is driving me crazy.
Ionic CLI 5.2.1
Angular 7.1.4
OS: Windows x64Basically I put a ion-input type=“number” in HTML file of a page and when user clicks decimal button (’.’) input clears itself.
HTML Content:
<ion-header> <ion-toolbar> <ion-buttons slot="start"> <ion-menu-toggle> <ion-button> <ion-icon slot="icon-only" name="menu"></ion-icon> </ion-button> </ion-menu-toggle> </ion-buttons> <ion-title>Kasa Ekle</ion-title> </ion-toolbar> </ion-header> <ion-content> <ion-item> <ion-label position="floating">Bakiye</ion-label> <ion-input type="number" value="0"></ion-input> </ion-item> <ion-button expand="full" (click)="AddSafe()">Ekle</ion-button> </ion-content>
Typescript Content:
import { Component, OnInit } from '@angular/core'; import { MbAcExchangeType } from 'src/app/classes/MbAcSafe'; import { Globals } from 'src/app/classes/Globals'; import { QuickToast } from 'src/app/classes/Helper'; import { ToastController } from '@ionic/angular'; import { Location } from '@angular/common'; @Component({ selector: 'app-add-safe', templateUrl: './add-safe.page.html', styleUrls: ['./add-safe.page.scss'], }) export class AddSafePage implements OnInit { public name : string; public exchange : number; public balance : number; public get exchanges(): MbAcExchangeType[] { return Globals.AppState.exchanges; } constructor(private toast : ToastController, private location : Location) { } ngOnInit() { } AddSafe() { Globals.AppState.AddSafe(this.name, this.exchange, this.balance) .then(() => { QuickToast(this.toast, "Kasa eklendi!", 3000); this.location.back(); }) .catch((e) => { QuickToast(this.toast, "Kasa eklerken hata, programı yeniden başlatmayı deneyin.", 3000); console.log(e); }) } }
I’ve also had another 2 inputs, but wanted to check if it works without them I deleted them.
This is the result:As seen on gif, pressing dot key causes input to clear, but when input is empty it causes dots to appear. I used scrcpy for screencast, so I tried to write with keyboard. Tried to input 12.0 but it still resets, entering 12,0 works tho. I also deleted ngModel in order to test if that was causing anything, but it still does not work. Any help?
Posts: 1
Participants: 1