Android自定义循环ProgressBar方向

时间:2017-07-03 11:23:30

标签: android android-progressbar layer-list android-layout

我有一个自定义循环进度条。这是我可以确定的可绘性:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:id="@android:id/secondaryProgress">
    <shape
        android:innerRadiusRatio="6"
        android:shape="ring"
        android:thicknessRatio="20.0"
        android:useLevel="true">
     <gradient
          android:centerColor="#999999"
          android:endColor="#999999"
          android:startColor="#999999"
          android:type="sweep" />
    </shape>
  </item>
  <item android:id="@android:id/progress">
   <rotate
      android:fromDegrees="270"
      android:pivotX="50%"
      android:pivotY="50%"
      android:toDegrees="270">

  <shape
      android:innerRadiusRatio="6"
      android:shape="ring"
      android:thicknessRatio="20.0"
      android:useLevel="true">


    <rotate
        android:fromDegrees="360"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="0" />

    <gradient
        android:centerColor="?attr/colorAccent"
        android:endColor="?attr/colorAccent"
        android:startColor="?attr/colorAccent"
        android:type="sweep" />

      </shape>
    </rotate>
  </item>
</layer-list>

我希望它以顺时针方向显示进度,但现在它显示逆时针方向。

如何更改?

4 个答案:

答案 0 :(得分:6)

我猜你使用的是rtl语言?您可以通过在layoutDirection上设置ProgressBar属性,将进度条强制为ltr或顺时针方向。

<ProgressBar
    ...
    android:layoutDirection="ltr" />

答案 1 :(得分:0)

更改此

<rotate
    android:fromDegrees="360"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="0" />

<rotate
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360" />

答案 2 :(得分:0)

我不确定它是否有用,但只是尝试设置self.addEventListener('fetch', function(e) { console.log('[ServiceWorker] Fetch', e.request.url); e.respondWith( caches.match(e.request).then(function(response) { return response || fetch(e.request); }) ); }); ,如下所示:

module.exports = angular.module('aah-yes-no-directive-module', [
  require('./yes-no.controller').name,
]).directive('aahYesNo', [function YesNoDirective() {

  return {
    restrict: 'A',
    templateUrl: 'partials/yes-no.template.html',
    require: ['aahYesNo', 'ngModel'],
    controller: 'aahYesNoController',
    controllerAs: 'ctrl',
    link: (scope, el, attrs, ctrls) => {
      let ctrl = ctrls[0],
        ngModelCtrl = ctrls[1];

      ctrl.init(ngModelCtrl, attrs.onValue, attrs.offValue);

      angular.element(el).children().addClass(attrs.size || '');
    },
    scope: {}
  };
}]);

答案 3 :(得分:0)

通过使用最新版本的 material design library,您可以实现:

  • 在具有此属性的布局中
    app:indicatorDirectionCircular
    
  • 或以编程方式使用此方法
    setIndicatorDirection()
    

有关详细信息,请参阅 here