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

来源:互联网 发布:淘宝买家秀百度云 编辑:程序博客网 时间:2024/05/27 16:41

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

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

    本篇代码下载地址:
    android-async-http progress-wheel测试程序

  2. 开源项目ProgressWheel效果图:
    这里写图片描述

  3. 自定义滚动条(透明效果)的实现:

    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>

最后,附上自定义滚动条(透明效果)的效果图:
这里写图片描述

开源的力量是无穷的!

代码下载:
android-async-http progress-wheel测试程序

0 0
原创粉丝点击