Failed to find 'ANDROID_HOME' environment variable

I am getting below error when I am trying to run project -

> cordova build android
Android Studio project detected
(node:15997) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Failed to find 'ANDROID_HOME' environment variable. Try setting it manually.
Failed to find 'android' command in your 'PATH'. Try update your 'PATH' to include path to valid SDK directory.


To resolve this issue please run below commands in the terminal -

export ANDROID_HOME="/Users/chetandeshmukh/Library/Android/sdk"
export PATH="$ANDROID_HOME/platform-tools:$ANDROID_HOME/tools:$PATH"


How to find the Android SDK path?

First open android studio, Then click on SDK manager. For more info please check below image -

Now select Appearance & Behavior -> System Settings -> Android SDK

 Now copy your SDK location with the help of the above steps and update in command.


This process will set the Android Home path in your system.


Now try once again to run your project. This process will resolve your problem. If you still facing any issue please add your error in the comment section. We will resolve this. 

Ionic round progressbar

To integrate this first we need to install the below module with the help of npm :

npm install angular-svg-round-progressbar --save

After installing this you need to import the RoundProgressModule in your module file :

import {NgModule} from '@angular/core';
import {RoundProgressModule} from 'angular-svg-round-progressbar';

@NgModule({
  imports: [RoundProgressModule]
})


Now in your page TS file add below lines -

export class RatePage {

  public selectedRange=0;

  
  constructor(public navCtrl: NavController) {

}

  close(){
    alert(this.selectedRange)
  }

  save(){
    alert(this.selectedRange)
  }

}


Now add below code in your html file -

<div class="main_box">
<div class="box">

 <div class="current">{{ selectedRange }}/{{ 100 }}</div>
 <round-progress
 [current]="selectedRange"
 [max]="100"
 [color]="'#45ccce'"
 [background]="'#eaeaea'"
 [radius]="80"
 [stroke]="20"
 [semicircle]="false"
 [rounded]="true"
 [clockwise]="true"
 [responsive]="false"
 [duration]="800"
 [animation]="'easeInOutQuart'"
 [animationDelay]="0"></round-progress>


<ion-range min="0" max="100" [(ngModel)]="selectedRange" color="secondary">
 <ion-label range-left>0</ion-label>
 <ion-label range-right>100</ion-label>
</ion-range>


<ion-row class="row">
 <ion-col class="col" col-6="">
     <button (click)="save()" class="login-btn button button-md button-default button-default-md" ion-button="" type="submit"><span class="button-inner">Submit
     </span><div class="button-effect"></div></button>
 </ion-col>
 <ion-col class="col" col-6="">
   <button (click)="close()" class="login-btn button button-md button-default button-default-md" ion-button="" type="submit"><span class="button-inner">Cancel
   </span><div class="button-effect"></div></button>
</ion-col>
</ion-row>


</div>

</div>


Add below code in your CSS file -

.scroll-content{
    padding: 0px !important;
}
.box{ margin: 0% 5%; padding: 0px 10px; font-size: 1.4rem; height: 60%; background-color: #fff; opacity: 1 !important; margin-top: 20%; border: 1px solid gray; }

round-progress{
    margin: 20% 25% 0% 25%;
}
.main_box{
    height: 100%;
}
[col-6]{
    text-align: center;
}
.range-md .range-knob, .range-ios .range-knob{
    width: 30px;
    height: 30px;
}
.range-md .range-bar, .range-ios .range-bar{
    top: 28px;
}
.label-md, .label-ios{ margin-top: 16px !important;}
.current {
    position: absolute;
    margin: 34% 25% 0% 35%;
    font-weight: 400;
    font-size: 2rem;
}


You can check more details on below link, also other options are available on below link -
https://github.com/crisbeto/angular-svg-round-progressbar

Check below demo link -
http://crisbeto.github.io/angular-svg-round-progressbar