Post a Comment On: Brillian Solution

Ionic - Backdrop. Show dan hide backdrop UI. Seringkali, beberapa komponen UI membutuhkan backdrop.  Backdrop akan membuat layar menjadi gelap seperti akan menampilkan popup atau semacamnya. Ada dua mehod yang dapat digunakan untuk backdrop : $ionicBackdrop.retain() akan mengaktifkan backdrop $ionicBackdrop.release() backdrop akan hilang
Berikut Cara penggunaanya : Pada js: .controller('BackdropCtrl',function($scope,$ionicBackdrop, $timeout){
  $scope.showBackdrop = function() {
    $ionicBackdrop.retain();
 
    $timeout(function() {
     $ionicBackdrop.release();
   }, 3000);
  };
    // Execute action on backdrop disappearing
    $scope.$on('backdrop.hidden', function() {
    // Execute action
    alert('hidden bro');
  });
  // Execute action on backdrop appearing
  $scope.$on('backdrop.shown', function() {
    // Execute action
    alert('show bro!')
  });
})

Pada html viewnya: <ion-view view-title="Backdrop">
<ion-content class="padding">
<p>Backdrop Page</p>
<button class="button" ng-click="showBackdrop()">Show Backdrop</button>
</ion-content>
</ion-view>
Hasilnya sebagai berikut:  [Image] backdrop awal


[Image] backdrop show



[Image] backdrop aktif


[Image] backdrop hidden
Mudah bukan? :D Sekian untuk malam ini. Nantikan beberapa kemudahan berikutnya :)