自定义圆形滚动条（透明效果）--利用开源项目ProgressWheel

开源项目ProgressWheel为我们提供了多样化的圆形滚动条，本篇带领读者利用它来实现自定义的滚动条。在官方demo中，一屏显示了好几种风格，而本篇只介绍一种风格，就是居中显示，透明布局。而且使用static进行了封装，启动和关闭都只需要一行代码即可完成。

开源项目ProgressWheel地址：
https://github.com/Todd-Davies/ProgressWheel

本篇代码下载地址：
android-async-http progress-wheel测试程序
开源项目ProgressWheel效果图：
自定义滚动条（透明效果）的实现：

1）. xml：

<code class="language-java hljs  has-numbering"><?xml version=<span class="hljs-string">"1.0"</span> encoding=<span class="hljs-string">"utf-8"</span>?>
<LinearLayout xmlns:android=<span class="hljs-string">"http://schemas.android.com/apk/res/android"</span>
    xmlns:ProgressWheel=<span class="hljs-string">"http://schemas.android.com/apk/res-auto"</span>
    android:id=<span class="hljs-string">"@+id/layout_progress_wheel"</span>
    android:layout_width=<span class="hljs-string">"fill_parent"</span>
    android:layout_height=<span class="hljs-string">"match_parent"</span>
    android:layout_gravity=<span class="hljs-string">"center"</span>
    android:orientation=<span class="hljs-string">"vertical"</span>
    >

    <com.todddavies.components.progressbar.ProgressWheel
            android:id=<span class="hljs-string">"@+id/pw_spinner"</span>
            android:layout_width=<span class="hljs-string">"100dp"</span>
            android:layout_height=<span class="hljs-string">"100dp"</span>
            android:layout_gravity=<span class="hljs-string">"center"</span>
            ProgressWheel:barColor=<span class="hljs-string">"#0097D6"</span>
            ProgressWheel:barLength=<span class="hljs-string">"100dp"</span>
            ProgressWheel:barWidth=<span class="hljs-string">"5dp"</span>
            ProgressWheel:rimColor=<span class="hljs-string">"#330097D6"</span>
            ProgressWheel:rimWidth=<span class="hljs-string">"10dp"</span>
            ProgressWheel:text=<span class="hljs-string">"Loading..."</span>
            ProgressWheel:textColor=<span class="hljs-string">"#222"</span>
            ProgressWheel:contourColor=<span class="hljs-string">"#330097D6"</span>
            ProgressWheel:textSize=<span class="hljs-string">"14sp"</span> />
</LinearLayout></code><ul style="" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li><li>10</li><li>11</li><li>12</li><li>13</li><li>14</li><li>15</li><li>16</li><li>17</li><li>18</li><li>19</li><li>20</li><li>21</li><li>22</li><li>23</li><li>24</li><li>25</li></ul>

2）. style：

<code class="language-java hljs  has-numbering">  <style name=<span class="hljs-string">"Dialog"</span> parent=<span class="hljs-string">"android:style/Theme.Dialog"</span>>
        <item name=<span class="hljs-string">"android:background"</span>>#<span class="hljs-number">00000000</span></item>
        <item name=<span class="hljs-string">"android:windowBackground"</span>><span class="hljs-annotation">@android</span>:color/transparent</item>
        <item name=<span class="hljs-string">"android:windowNoTitle"</span>><span class="hljs-keyword">true</span></item>
        <item name=<span class="hljs-string">"android:windowIsFloating"</span>><span class="hljs-keyword">true</span></item>
    </style></code><ul style="" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li></ul>

3）. java代码：

<code class="language-java hljs  has-numbering">   <span class="hljs-keyword">public</span> <span class="hljs-class"><span class="hljs-keyword">class</span> <span class="hljs-title">LoadingCommentDialog</span> {</span>
    <span class="hljs-keyword">private</span> <span class="hljs-keyword">static</span> Dialog mDialog = <span class="hljs-keyword">null</span>;
    <span class="hljs-keyword">private</span> <span class="hljs-keyword">static</span> ProgressWheel mProgressWheel = <span class="hljs-keyword">null</span>;

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">void</span> <span class="hljs-title">showCommentDialog</span>(Context context, String text) {
        closeCommentDialog(context);

        WindowManager m = ((Activity) context).getWindowManager();
        Display d = m.getDefaultDisplay(); <span class="hljs-comment">// 获取屏幕宽、高用</span>

        mDialog = <span class="hljs-keyword">new</span> Dialog(context, R.style.Dialog);

        LayoutInflater inflater = ((Activity) context).getLayoutInflater();
        View layout = inflater.inflate(R.layout.layout_progress_wheel, <span class="hljs-keyword">null</span>);
        mDialog.setContentView(layout);

        mProgressWheel = (ProgressWheel) layout.findViewById(R.id.pw_spinner);
        mProgressWheel.setText(text);

        Window dialogWindow = mDialog.getWindow();<span class="hljs-comment">//</span>
        WindowManager.LayoutParams lp = dialogWindow.getAttributes();
        lp.gravity = Gravity.CENTER;

        <span class="hljs-comment">// lp.x = 20; // 新位置X坐标</span>
        <span class="hljs-comment">// lp.y = 60; // 新位置Y坐标</span>
        lp.width = d.getWidth() - <span class="hljs-number">20</span>; <span class="hljs-comment">// 宽度</span>
        <span class="hljs-comment">// lp.height = (int) (d.getHeight()*0.4); // 高度</span>

        dialogWindow.setAttributes(lp);
        mProgressWheel.spin();
        mDialog.show();
    }

    <span class="hljs-keyword">public</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">void</span> <span class="hljs-title">closeCommentDialog</span>(Context context) {
        <span class="hljs-keyword">if</span> (mProgressWheel!=<span class="hljs-keyword">null</span>) {
            mProgressWheel.stopSpinning();
            mProgressWheel = <span class="hljs-keyword">null</span>;
        }

        <span class="hljs-keyword">if</span> (mDialog!=<span class="hljs-keyword">null</span>) {
            mDialog.dismiss();
            mDialog = <span class="hljs-keyword">null</span>;
        }
    }
}</code><ul style="" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li><li>10</li><li>11</li><li>12</li><li>13</li><li>14</li><li>15</li><li>16</li><li>17</li><li>18</li><li>19</li><li>20</li><li>21</li><li>22</li><li>23</li><li>24</li><li>25</li><li>26</li><li>27</li><li>28</li><li>29</li><li>30</li><li>31</li><li>32</li><li>33</li><li>34</li><li>35</li><li>36</li><li>37</li><li>38</li><li>39</li><li>40</li><li>41</li><li>42</li><li>43</li><li>44</li><li>45</li></ul>

4）. 调用方法：

<code class="language-java hljs  has-numbering">打开：
LoadingCommentDialog.showCommentDialog(mContext,mContext.getString(R.string.loading)); <span class="hljs-comment">//这里可以自定义圆形中的文字。</span>
<span class="hljs-comment">//YourFouction() //这里，是开始你的线程，或者异步请求，或者耗时的操作...</span>

关闭：
LoadingCommentDialog.closeCommentDialog(mContext);
</code><ul style="" class="pre-numbering"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li></ul><div style="display: block;" class="save_code tracking-ad" data-mod="popu_249"><a target=_blank target="_blank"><img src="http://static.blog.csdn.net/images/save_snippets.png" alt="" /></a></div>

最后，附上自定义滚动条（透明效果）的效果图：
这里写图片描述