infomofo / angular-md-pull-to-refresh

material pull to refresh
https://infomofo.github.io/angular-md-pull-to-refresh/app/
18 stars 9 forks source link

How to show only circular progress and hide linear progress #5

Open parthmehta opened 7 years ago

parthmehta commented 7 years ago

With current options, it shows only linear progress, and its not showing circular progress to me. Can you please suggest how to show circular progress of material design.

braytonstafford commented 7 years ago

In the directive (inside angular-md-pull-to-refresh.js) change the template to be md-progress-circular instead of md-progress-linear. I also wrapped mine in a <div> to add some padding and center it.

CHANGE THIS:

<md-progress-linear md-mode="indeterminate" class="md-accent ng-hide im-pull-to-refresh-progress-bar" ng-show="pullToRefreshActive"></md-progress-linear><ng-transclude></ng-transclude>

TO THIS:

<div layout="row" layout-align="center" layout-padding><md-progress-circular md-mode="indeterminate" class="md-accent ng-hide im-pull-to-refresh-progress-bar" ng-show="pullToRefreshActive"></md-progress-circular></div><ng-transclude></ng-transclude>