title: Why does the xml drawable look different in Android Studio than the phone?
body: <p>I am trying to make a circle progressbar that looks like a snake.
  In my phone, it looks exactly like I want:</p>
  <p><a href="https://i.stack.imgur.com/euApV.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/euApV.jpg" alt="enter image description here" /></a></p>
  <p>Yet, Android Studio shows something very different:</p>
  <p><a href="https://i.stack.imgur.com/Qh5Zg.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Qh5Zg.jpg" alt="enter image description here" /></a></p>
  <p>That is, the &quot;head&quot; of the snake is stretched, out of center... I am afraid that Android will show different drawables in different phones. How to solve this?</p>
  <p>This is the <code>progress_gradient.xml</code> of the drawable that I placed in <code>res &gt; drawables</code> (I came out to this after several tries and errors in my phone):</p>
  <pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
  &lt;rotate xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
      android:fromDegrees=&quot;0&quot;
      android:pivotX=&quot;50%&quot;
      android:pivotY=&quot;50%&quot;
      android:toDegrees=&quot;720&quot;&gt;
  
      &lt;layer-list&gt;
          &lt;item&gt;
              &lt;shape
                  android:innerRadiusRatio=&quot;3&quot;
                  android:shape=&quot;ring&quot;
                  android:thicknessRatio=&quot;30&quot;
                  android:useLevel=&quot;false&quot;&gt;
  
                  &lt;size
                      android:width=&quot;100sp&quot;
                      android:height=&quot;100sp&quot; /&gt;
  
                  &lt;gradient
                      android:angle=&quot;0&quot;
                      android:endColor=&quot;#9ac14e&quot;
                      android:startColor=&quot;@android:color/transparent&quot;
                      android:type=&quot;sweep&quot;
                      android:useLevel=&quot;false&quot; /&gt;
  
              &lt;/shape&gt;
          &lt;/item&gt;
          &lt;item
              android:left=&quot;82sp&quot;
              android:right=&quot;16dp&quot;
              android:top=&quot;47sp&quot;
              android:bottom=&quot;45sp&quot;
              &gt;
  
              &lt;shape
                  android:shape=&quot;oval&quot; &gt;
                  &lt;solid android:color=&quot;#9ac14e&quot;/&gt;
  
              &lt;size
                      android:width=&quot;1sp&quot;
                      android:height=&quot;5sp&quot; /&gt;
  
              &lt;/shape&gt;
          &lt;/item&gt;
      &lt;/layer-list&gt;
  
  &lt;/rotate&gt;
  </code></pre>
  <p>And this is how I load it in the layout:</p>
  <pre><code>&lt;LinearLayout xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
  xmlns:tools=&quot;http://schemas.android.com/tools&quot;
  
  android:layout_width=&quot;fill_parent&quot;
  android:layout_height=&quot;fill_parent&quot;
  android:gravity=&quot;center_vertical&quot;
  android:orientation=&quot;vertical&quot;&gt;
  
  ...
  
  &lt;ProgressBar
      android:id=&quot;@+id/waitcircle&quot;
      android:layout_width=&quot;100sp&quot;
      android:layout_height=&quot;100sp&quot;
      android:layout_marginTop=&quot;50dp&quot;
      android:layout_gravity=&quot;center_horizontal&quot;
      android:indeterminate=&quot;true&quot;
      android:indeterminateDrawable=&quot;@drawable/progress_gradient&quot;/&gt;
  
  &lt;/LinearLayout&gt;
  </code></pre>