Merge pull request #2 from championswimmer/counterclockwise

Fixes Issue #1 : add option for counterclockwise rotation

Author: droidchef

README.md

@@ -26,7 +26,7 @@ dependencies {
 
 # Usage
 
-In your Layout XML add this
+In your Layout XML add this (all the app:.... attributes are optional and have default values
 
 ```
     <org.lazysource.uberprogressview.UberProgressView
@@ -35,6 +35,7 @@ In your Layout XML add this
         app:fading_circle_color="@android:color/holo_red_dark"
         app:stationary_circle_color="@android:color/holo_red_dark"
         app:orbiting_circle_color="@android:color/holo_red_dark"
+        app:direction="counterclockwise"
         app:orbiting_circle_radius="6dp"
         app:stationary_circle_radius="12dp" />
 
@@ -47,6 +48,7 @@ In your Layout XML add this
 | stationary_circle_color | Color of the stationary circle in the center.            | color     | #29B6F6   |
 | orbiting_circle_radius  | Radius of the orbiting circles.                          | dimension | 2dp       |
 | stationary_circle_radius| Radius of the stationary circle in the center.           | dimension | 4dp       |
+| direction               | Direction of rotation of outer dot                       | enum      | clockwise |
 
 
 # Design Inspiration

uberprogressview/src/main/java/org/lazysource/uberprogressview/UberProgressView.java

@@ -37,6 +37,7 @@ public class UberProgressView extends View {
     private int stationaryCircleColor;
     private int fadingCircleColor;
     private int oribitingCircleColor;
+    private int roationDirection;
 
     // Animation calculation fields
     private float currentAnimationTime = 0;
@@ -77,6 +78,7 @@ private void init(Context context, AttributeSet attributeSet) {
             stationaryCircleColor = typedArray.getColor(R.styleable.UberProgressView_stationary_circle_color, Color.parseColor("#29B6F6"));
             fadingCircleColor = typedArray.getColor(R.styleable.UberProgressView_fading_circle_color, Color.parseColor("#29B6F6"));
             oribitingCircleColor = typedArray.getColor(R.styleable.UberProgressView_orbiting_circle_color, Color.parseColor("#29B6F6"));
+            roationDirection = typedArray.getInt(R.styleable.UberProgressView_direction, 0);
             rStationary = typedArray.getDimension(R.styleable.UberProgressView_stationary_circle_radius, 12f);
             float orbitingCircleRadius = typedArray.getDimension(R.styleable.UberProgressView_orbiting_circle_radius, 6f);
             // In order to make sure the orbiting circles are at least 75% the
@@ -150,6 +152,7 @@ protected void onDraw(Canvas canvas) {
 
         drawCircle(canvas, theta, mPaintOrbitingCircle1);
 
+
         if (theta > 15 && theta < 270) {
             drawCircle(canvas, theta - movementFactor1, mPaintOrbitingCircle2);
         }
@@ -177,11 +180,18 @@ protected void onWindowVisibilityChanged(int visibility) {
     private void drawCircle(Canvas canvas, float theta, Paint paint) {
 
         double thetaInRadians = Math.toRadians(theta);
+        float oribitingCX, oribitingCY;
 
-        float oribitingCX = cXStationary + (orbitPathDistanceFromCenter * (float) Math.cos(thetaInRadians));
-        float oribitingCY = cYStationary + (orbitPathDistanceFromCenter * (float) Math.sin(thetaInRadians));
+        if (roationDirection == 0) {
+            oribitingCX = cXStationary + (orbitPathDistanceFromCenter * (float) Math.cos(thetaInRadians));
+            oribitingCY = cYStationary + (orbitPathDistanceFromCenter * (float) Math.sin(thetaInRadians));
+        } else {
+            oribitingCX = cXStationary + (orbitPathDistanceFromCenter * (float) Math.sin(thetaInRadians));
+            oribitingCY = cYStationary + (orbitPathDistanceFromCenter * (float) Math.cos(thetaInRadians));
+        }
 
         canvas.drawCircle(oribitingCX, oribitingCY, rOrbiting, paint);
+
     }
 
     private float getLagFactor(float K) {

uberprogressview/src/main/res/values/attrs.xml

@@ -8,6 +8,10 @@
         <attr name="fading_circle_color" format="color" />
         <attr name="orbiting_circle_color" format="color" />
         <attr name="animation_time" format="integer" />
+        <attr name="direction" format="enum">
+            <enum name="clockwise" value="0"/>
+            <enum name="counterclockwise" value="1"/>
+        </attr>
     </declare-styleable>
 
 </resources>