matthieu-D

.controller('ChatsCtrl', function( $timeout, ionicMaterialMotion) {
  
  $timeout(function () {
    ionicMaterialMotion.fadeSlideInRight();
    ionicMaterialMotion.fadeSlideIn();
    ionicMaterialMotion.ripple();
    ionicMaterialMotion.blinds();
}, 500);

})

matthieu-D

<h2 class='calm'>Welcome to Ionic Material</h2>

matthieu-D

$ionicLoading.show({
    template:"<div class='loader'><svg class='circular'><circle class='path' cx='50' cy='50' r='20' fill='none' stroke-width='2' stroke-miterlimit='10'/></svg></div>"
            })

matthieu-D

<h2 class='calm ink'>Welcome to Ionic</h2

matthieu-D

<button class='button button-fab balanced ink-dark'>Dark</button>

matthieu-D

<button class="button" id='drop-it' ng-click="toggleDrop();">Drop</button>

matthieu-D

ionicMaterialInk.displayEffect();
function cancelDrop(){
  document.getElementById('drop-it').classList.remove('drop')
}
$scope.toggleDrop = function (){
  document.getElementById('drop-it').classList.add('drop');
  $timeout(cancelDrop, 2000)
}

matthieu-D

$timeout(function () {
    ionicMaterialMotion.fadeSlideInRight();
    ionicMaterialMotion.fadeSlideIn();
    ionicMaterialMotion.ripple();
    ionicMaterialMotion.blinds();
}, 500);

matthieu-D

<ion-view view-title="Chats">
  <ion-content>
    <ion-list class="animate-fade-slide-in">
      <ion-item ng-repeat="chat in chats">fade slide in </ion-item>
    </ion-list>
    <ion-list class="animate-fade-slide-in-right">
      <ion-item ng-repeat="chat in chats"> fade slide in right </ion-item>
    </ion-list>
    <ion-list class="animate-ripple">
      <ion-item ng-repeat="chat in chats"> ripple </ion-item>

matthieu-D

npm install aws-sdk