Tech Seeker

Introduction: Ionic Picker(ion-picker) is a popup slides up from the bottom of the device screen, which contains rows with selectable column separated items. The main building block of ion-picker as follows: PickerController PickerOptions PickerController: PickerController object helps in creating an ion-picker overlay. create(opts?: Opts): Promise<Overlay> PickerController create method helps in create the picker overlay with the picker options PickerOptions: PickerOptions is a configuration object used by PickerController to display ion-picker. Single Column Ionic Picker: single.item.picker.ts: import { Component } from "@angular/core"; import { PickerController } from "@ionic/angular"; import { PickerOptions } from "@ionic/core"; @Component({ selector: "single-column-picker", templateUrl:"single.item.picker.html" }) export class SingleItemPicker { animals: string[] = ["Tiger&quo

Introduction: The Ionic DevApp mobile   application, which helps to test and run our ionic application on mobile device at the time of development. It is the most comfortable and fast way to test application when compared to traditional approaches like either run on emulators or connecting the real device to the application test machine. Ionic DevApp free mobile application which is available on Google Play Store and Apple App Store. How It Works: 1. Both development machine and mobile enable and connect  to the same WIFI 2. Run the application using the command "ionic serve --devapp" , after that application get build 3. mobile get detects our application and starts running. Step 1: Download "Ionic DevApp" from google play store on to your mobile as below Step 2: Open Ionic Dev App, on the first time it shows up login form just sign up with your account. After login, you can see where application tries to search for an ionic application running on

Introduction: In part -1 we have written code to create contacts, now using the mock-up plugin API  "Cordova-Plugin-Contacts-Mock" access user mobile contact to our application listing contacts page .   Click here to read part - 1 Install Contact Mock Plugin: Install below mock plug-in                       "npm install cordava-plugin-contacts-mock --save-dev" for more  go to this mock plugin link Configure Mock Plugin Script To Our Application: Now add the below js file path to "Scripts" array property in the angular.json file.   "node_modules/cordova-plugin-contacts-mock/build/contacts-mock.js" after adding js file path rebuild the project again. Mock Contacts To Chrome Browser Local Storage: Run the application and go to the second tab in the sample project which is created to add new contacts. Using that code creates few dummy contacts which are going to be accessed as mobile contact to test "Cordova-plugin-contact

Introduction: In Ionic 4 had been provided with native API "Cordova-plugin-Contacts" to access mobile contacts. At development to test, accessing mobile contacts either we need to configure mobile emulators, or we need to connect the real device which bit complex approach. "Cordova-Plugin-Contacts-Mock" a third party plugin helps to mock the contacts and access them in the browser and test on the browser like do on mobile . So testing on the browser is the fastest and comfortable approach to test user contacts "Cordova-Plugin-Contact-Mock"  API helps mock the contacts in our local browser (Developer Tools => Application => Local Storage) which helps to test all the features that are originally provided by Ionic 4 native API   "Cordova-Plugin-Contacts". "Note: Mocking of contact only works with chrome browser" . About Platform : 1.Ionic 4 2.Angular 8.0v Create Ionic4 Application: Create an Ionic 4 application, i