# Have a custom animation with the $ionicLoading instead of a spinner

**URL:** <https://forum.ionicframework.com/t/have-a-custom-animation-with-the-ionicloading-instead-of-a-spinner/57976>\
**Category:** ionic-v1\
**Created:** [July 19, 2016, 4:19pm UTC](https://forum.ionicframework.com/t/have-a-custom-animation-with-the-ionicloading-instead-of-a-spinner/57976 "2016-07-19T16:19:40Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![peterhriser](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/peterhriser/32/101809_2.png) [@peterhriser](https://forum.ionicframework.com/u/peterhriser)\
**Post date:** [July 19, 2016, 4:19pm UTC](https://forum.ionicframework.com/t/have-a-custom-animation-with-the-ionicloading-instead-of-a-spinner/57976/1 "2016-07-19T16:19:40Z")

</div>

I am trying to have a custom animation, preferably a gif displayed on the splash screen. `

`.controller('LoadingCtrl', function ($scope, $ionicLoading) { $scope.show = function () { $ionicLoading.show({ content: "", template: 'Loading...', noBackdrop: 'true', hideOnStateChange: 'false' }).then(function () { console.log("The loading indicator is now displayed"); }); }; $scope.hide = function () { $ionicLoading.hide().then(function () { console.log("The loading indicator is now hidden"); }); }; });`

Right now it defaults to a spinner and I do not know why or how to make it so my own gif will appear.

---

<div class="post-metadata">

**Author:** ![baviskarmitesh](https://avatars.discourse-cdn.com/v4/letter/b/df788c/32.png) [@baviskarmitesh](https://forum.ionicframework.com/u/baviskarmitesh)\
**Post date:** [July 20, 2016, 8:34am UTC](https://forum.ionicframework.com/t/have-a-custom-animation-with-the-ionicloading-instead-of-a-spinner/57976/2 "2016-07-20T08:34:11Z")

</div>

add cordova-plugin-splashscreen plugin  
in config.xml file add this line

and store the gifimage with defaultname in Resources-\>android-\>splash folder
