自定义多状态高仿应用下载百分数视图

http://blog.csdn.net/u013278099/article/details/51173870
http://blog.csdn.net/u013278099/article/details/51173870 


自定义多状态高仿应用下载百分数视图

标签: 应用程序下载进度
3672阅读人  评论 (3) 收藏 举报    
  分类:
 

目录(?)[+]

说在前面

话说很多的应用下载中心就有一个下载的过程,然后呢就需要用一个图标来显示下载的状态。
不多说,看图说话:

这里写图片描述

从图上看下载都会有这么几种状态:未开始、正在下载、下载暂停、下载完成。然后还可能出现的状况就是下载出错和等待下载是无法从图里面体现的。

实现思路

实现思路:你看下载的状态是通过几张图片来给我们不同的视觉,确切的是5种状态,应用没有下载之前是下载状态,加入下载列表后没有下载的时候是等待状态,下载过程中会显示进度数字被分数加载变化和进度条变化,点击后出现的暂停状态并且显示进度,下载完成后是完成的状态。

这5种状态下:只有暂停状态和正在下载状态需要我们draw圆环和文字,其他情况下只需要drawImage就可以了,然后这里使用的是自定义属性来实现这个view,通过handle来刷新下载状态从而实现用户界面的刷新。

代码的具体实现

自定义属性文件的书写:

先新建attrs.xml文件,里面代码如下:

<code class="hljs xml has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-pi" style="color: rgb(0, 102, 102); box-sizing: border-box;"><?xml version="1.0" encoding="utf-8"?></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">resources</span>></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">declare-styleable</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"DownloadPercentView"</span>></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"radius"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"dimension"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"notBeginImg"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"string"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"waitImg"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"string"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"pausedImg"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"string"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"finishedImg"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"string"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"strokeWidth"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"dimension"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"circleColor"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"color"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"ringColor"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"color"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"textColor"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"color"</span>/></span>
        <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"><<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">attr</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">name</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"textSize"</span> <span class="hljs-attribute" style="box-sizing: border-box; color: rgb(102, 0, 102);">format</span>=<span class="hljs-value" style="box-sizing: border-box; color: rgb(0, 136, 0);">"dimension"</span>/></span>
    <span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">declare-styleable</span>></span>
<span class="hljs-tag" style="color: rgb(0, 102, 102); box-sizing: border-box;"></<span class="hljs-title" style="box-sizing: border-box; color: rgb(0, 0, 136);">resources</span>></span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li></ul>

属性解析:

  • 半径就是我们所要显的控件的半径
  • notBeginImg没有开始下载的图片
  • waitImg等待下载的图片
  • pausedImg按下暂停时的图片
  • finishedImg下载完成时的图片
  • strokeWidth圈画笔的宽度
  • circleColor圆环默认颜色
  • ringColor进度展示的颜色
  • 文字颜色进度文字颜色
  • TEXTSIZE进度文字尺寸
自定义视图代码的书写

步骤一:
获取自定义属性:

<code class="hljs avrasm has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 初始化自定义属性
     * @param context
     * @param attrs
     */</span><span style="box-sizing: border-box;"></span>
    private void initAttrs(Context context, AttributeSet attrs) {<span style="box-sizing: border-box;"></span>
        TypedArray typeArray = context<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getTheme</span>()<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.obtainStyledAttributes</span>(attrs,<span style="box-sizing: border-box;"></span>
                R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mRadius = (int)typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getDimension</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_radius, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mStrokeWidth = (int)typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getDimension</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_strokeWidth, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">2</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mCircleColor = typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getColor</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_circleColor, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0xFFFFFFFF</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mRingColor = typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getColor</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_ringColor, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0xFFFFFFFF</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mTextColor = typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getColor</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_textColor, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0xFFFFFFFF</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mNotBeginImg = ((BitmapDrawable)typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getDrawable</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_notBeginImg))<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getBitmap</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mPausedImg = ((BitmapDrawable)typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getDrawable</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_pausedImg))<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getBitmap</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mWatiImg = ((BitmapDrawable)typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getDrawable</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_waitImg))<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getBitmap</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        finishedImg = ((BitmapDrawable)typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getDrawable</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_finishedImg))<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getBitmap</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
        mTextSize = (int)typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.getDimension</span>(R<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.styleable</span><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.DownloadPercentView</span>_textSize, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">28</span>)<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span><span style="box-sizing: border-box;"></span>
        //记住recycle,并避免内存泄漏<span style="box-sizing: border-box;"></span>
        typeArray<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">.recycle</span>()<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">;</span>
    }</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li></ul>

计算控件大小:

<code class="hljs java has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 计算控件的宽高
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> widthMeasureSpec
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> heightMeasureSpec
     */</span>
    <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">protected</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onMeasure</span>(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> widthMeasureSpec, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> heightMeasureSpec) {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> width = (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span>)Math.ceil(mRadius) * SCALE;<span style="box-sizing: border-box;"></span>
        setMeasuredDimension(width, width);<span style="box-sizing: border-box;"></span>
    }</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li></ul>

初始化画笔:

<code class="hljs java has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     *
     * 初始化画文字的画笔
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> mTxtPaint
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initTextPaint</span>(Paint mTxtPaint) {<span style="box-sizing: border-box;"></span>
        mTxtPaint.setAntiAlias(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">true</span>);<span style="box-sizing: border-box;"></span>
        mTxtPaint.setColor(mTextColor);<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//Color.parseColor("#52ce90")</span><span style="box-sizing: border-box;"></span>
        mTxtPaint.setTextAlign(Paint.Align.CENTER);<span style="box-sizing: border-box;"></span>
        mTxtPaint.setTextSize(mTextSize);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 初始化圈和弧的画笔
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> targetPaint 区分画笔
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> color  画笔颜色
     */</span><span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initPaint</span>(Paint targetPaint,<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> color) {<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
        targetPaint.setAntiAlias(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">true</span>);<span style="box-sizing: border-box;"></span>
        targetPaint.setColor(color);<span style="box-sizing: border-box;"></span>
        targetPaint.setStyle(Paint.Style.STROKE);<span style="box-sizing: border-box;"></span>
        targetPaint.setStrokeWidth(mStrokeWidth);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
  <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initVariable</span>() {<span style="box-sizing: border-box;"></span>
        mCirclePaint = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Paint();<span style="box-sizing: border-box;"></span>
        mRingPaint= <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Paint();<span style="box-sizing: border-box;"></span>
        mTxtPaint = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Paint();
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化绘制灰色圆的画笔</span><span style="box-sizing: border-box;"></span>
        initPaint(mCirclePaint,mCircleColor);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化绘制圆弧的画笔</span><span style="box-sizing: border-box;"></span>
        initPaint(mRingPaint,mRingColor);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化绘制文字的画笔</span><span style="box-sizing: border-box;"></span>
        initTextPaint(mTxtPaint);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化要显示的图片</span><span style="box-sizing: border-box;"></span>
        initImage();<span style="box-sizing: border-box;"></span>
    }</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">23</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">24</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">25</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">26</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">27</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">28</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">29</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">三十</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">31</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">32</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">33</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">34</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">35</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">36</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">37</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">38</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">23</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">24</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">25</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">26</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">27</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">28</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">29</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">三十</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">31</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">32</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">33</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">34</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">35</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">36</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">37</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">38</span></li></ul>

接下来我们写的onDraw:

<code class="hljs java has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">protected</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onDraw</span>(Canvas canvas) {
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//控件的中心坐标</span><span style="box-sizing: border-box;"></span>
        mXCenter = getWidth() / SCALE;<span style="box-sizing: border-box;"></span>
        mYCenter = getHeight() / SCALE;<span style="box-sizing: border-box;"></span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">switch</span> (mStatus) {
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_NOBEGIN:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//原始状态</span>
                canvas.drawBitmap(mNotBeginImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_WAITING:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//等待下载状态</span>
                canvas.drawBitmap(mWatiImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_DOWNLOADING:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//下载中</span><span style="box-sizing: border-box;"></span>
                drawDownloadingView(canvas);<span style="box-sizing: border-box;"></span>
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_PAUSED:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//暂停</span><span style="box-sizing: border-box;"></span>
                drawPausedView(canvas);<span style="box-sizing: border-box;"></span>
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_FINISHED:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//下载完成</span>
                canvas.drawBitmap(finishedImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;<span style="box-sizing: border-box;"></span>
        }</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li></ul>

看代码就知道:只有暂停和下载过程需要我们去画进度:

下载过程:(需要画出灰色圆圈,接下来根据进度绘制进度和文字)

<code class="hljs java has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;">    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 绘制下载中的view
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> canvas
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">drawDownloadingView</span>(Canvas canvas) {
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制灰色圆环</span><span style="box-sizing: border-box;"></span>
        canvas.drawCircle(mXCenter, mYCenter, mRadius - mStrokeWidth/SCALE, mCirclePaint);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制进度扇形圆环</span>
        RectF oval = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> RectF();
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//设置椭圆上下左右的坐标</span><span style="box-sizing: border-box;"></span>
        oval.left = mXCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.top = mYCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.right = mXCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.bottom = mYCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        canvas.drawArc(oval, -<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">90</span>, ((<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span>)mProgress / mTotalProgress) * <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">360</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">false</span>, mRingPaint);<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//false顺势针</span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制中间百分比文字</span><span style="box-sizing: border-box;"></span>
        String percentTxt = String.valueOf(mProgress);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//计算文字垂直居中的baseline</span><span style="box-sizing: border-box;"></span>
        Paint.FontMetricsInt fontMetrics = mTxtPaint.getFontMetricsInt();<span style="box-sizing: border-box;"></span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span> baseline = oval.top + (oval.bottom - oval.top - fontMetrics.bottom + fontMetrics.top) / SCALE - fontMetrics.top;<span style="box-sizing: border-box;"></span>
        canvas.drawText(percentTxt+<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"%"</span>, mXCenter, baseline, mTxtPaint);<span style="box-sizing: border-box;"></span>
    }</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li></ul>

步骤就是先画出灰色圆圈,然后根据进度画出扇形区域,最后就是根据进度显示百分数的文字。

暂停过程的绘制:(同上,只不过不文字换成暂停图片)

<code class="hljs java has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;">    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 绘制暂停时的view
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> canvas
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">drawPausedView</span>(Canvas canvas) {
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制灰色圆环</span><span style="box-sizing: border-box;"></span>
        canvas.drawCircle(mXCenter, mYCenter, mRadius - mStrokeWidth/SCALE, mCirclePaint);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制进度扇形圆环</span>
        RectF oval = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> RectF();
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//设置椭圆上下左右的坐标</span><span style="box-sizing: border-box;"></span>
        oval.left = mXCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.top = mYCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.right = mXCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.bottom = mYCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        canvas.drawArc(oval, -<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">90</span>, ((<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span>) mProgress / mTotalProgress) * <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">360</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">false</span>, mRingPaint);
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制中间暂停图标</span>
        canvas.drawBitmap(mPausedImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);<span style="box-sizing: border-box;"></span>
    }</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li></ul>

现在贴出自定义视图完整代码:

<code class="hljs java has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">package</span> com.losileeya.downloadpercent_master;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.content.Context;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.content.res.TypedArray;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.Bitmap;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.Canvas;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.Matrix;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.Paint;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.RectF;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.graphics.drawable.BitmapDrawable;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.util.AttributeSet;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.view.View;<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
<span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
 *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @Class</span>: DownloadPercentView
 */</span>
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-class" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">class</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">DownloadPercentView</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">extends</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">View</span> {</span>
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//状态设置</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> STATUS_NOBEGIN= <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> STATUS_WAITING = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">2</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> STATUS_DOWNLOADING = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">3</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> STATUS_PAUSED = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">4</span>;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> STATUS_FINISHED = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">5</span>;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 画实心圆的画笔</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Paint mCirclePaint=<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 画圆环的画笔</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Paint mRingPaint=<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 绘制进度文字的画笔</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Paint mTxtPaint=<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 圆形颜色</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mCircleColor;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 圆环颜色</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mRingColor;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//文字颜色</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mTextColor;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//文字大小</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mTextSize;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 半径</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mRadius;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 圆环宽度</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mStrokeWidth = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">2</span>;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 圆心x坐标</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mXCenter;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 圆心y坐标</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mYCenter;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 总进度</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mTotalProgress = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 当前进度</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mProgress;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//下载状态</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mStatus = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>;<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//默认显示的图片</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Bitmap mNotBeginImg;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//暂停时中间显示的图片</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Bitmap mPausedImg;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//等待时显示的图片</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Bitmap mWatiImg;
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//下载完成时显示的图片</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Bitmap finishedImg;<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> SCALE=<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">2</span>;<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-title" style="box-sizing: border-box;">DownloadPercentView</span>(Context context, AttributeSet attrs) {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">super</span>(context, attrs);
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 获取自定义的属性</span><span style="box-sizing: border-box;"></span>
        initAttrs(context, attrs);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始值设置</span><span style="box-sizing: border-box;"></span>
        initVariable();<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 初始化自定义属性
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> context
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> attrs
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initAttrs</span>(Context context, AttributeSet attrs) {<span style="box-sizing: border-box;"></span>
        TypedArray typeArray = context.getTheme().obtainStyledAttributes(attrs,<span style="box-sizing: border-box;"></span>
                R.styleable.DownloadPercentView, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>);<span style="box-sizing: border-box;"></span>
        mRadius = (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span>)typeArray.getDimension(R.styleable.DownloadPercentView_radius, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>);<span style="box-sizing: border-box;"></span>
        mStrokeWidth = (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span>)typeArray.getDimension(R.styleable.DownloadPercentView_strokeWidth, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">2</span>);<span style="box-sizing: border-box;"></span>
        mCircleColor = typeArray.getColor(R.styleable.DownloadPercentView_circleColor, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0xFFFFFFFF</span>);<span style="box-sizing: border-box;"></span>
        mRingColor = typeArray.getColor(R.styleable.DownloadPercentView_ringColor, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0xFFFFFFFF</span>);<span style="box-sizing: border-box;"></span>
        mTextColor = typeArray.getColor(R.styleable.DownloadPercentView_textColor, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0xFFFFFFFF</span>);<span style="box-sizing: border-box;"></span>
        mNotBeginImg = ((BitmapDrawable)typeArray.getDrawable(R.styleable.DownloadPercentView_notBeginImg)).getBitmap();<span style="box-sizing: border-box;"></span>
        mPausedImg = ((BitmapDrawable)typeArray.getDrawable(R.styleable.DownloadPercentView_pausedImg)).getBitmap();<span style="box-sizing: border-box;"></span>
        mWatiImg = ((BitmapDrawable)typeArray.getDrawable(R.styleable.DownloadPercentView_waitImg)).getBitmap();<span style="box-sizing: border-box;"></span>
        finishedImg = ((BitmapDrawable)typeArray.getDrawable(R.styleable.DownloadPercentView_finishedImg)).getBitmap();<span style="box-sizing: border-box;"></span>
        mTextSize = (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span>)typeArray.getDimension(R.styleable.DownloadPercentView_textSize, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">28</span>);
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//记住recycle,并避免内存泄漏</span><span style="box-sizing: border-box;"></span>
        typeArray.recycle();<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initVariable</span>() {<span style="box-sizing: border-box;"></span>
        mCirclePaint = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Paint();<span style="box-sizing: border-box;"></span>
        mRingPaint= <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Paint();<span style="box-sizing: border-box;"></span>
        mTxtPaint = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Paint();
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化绘制灰色圆的画笔</span><span style="box-sizing: border-box;"></span>
        initPaint(mCirclePaint,mCircleColor);<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化绘制圆弧的画笔</span><span style="box-sizing: border-box;"></span>
        initPaint(mRingPaint,mRingColor);<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化绘制文字的画笔</span><span style="box-sizing: border-box;"></span>
        initTextPaint(mTxtPaint);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始化要显示的图片</span><span style="box-sizing: border-box;"></span>
        initImage();<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 显示图片的处理
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initImage</span>() {<span style="box-sizing: border-box;"></span>
        mNotBeginImg = imageSize(mNotBeginImg, mRadius * SCALE, mRadius * SCALE);<span style="box-sizing: border-box;"></span>
        mPausedImg = imageSize(mPausedImg, mRadius * SCALE, mRadius * SCALE);<span style="box-sizing: border-box;"></span>
        mWatiImg = imageSize(mWatiImg, mRadius *SCALE, mRadius * SCALE);<span style="box-sizing: border-box;"></span>
        finishedImg = imageSize(finishedImg, mRadius *SCALE, mRadius * SCALE);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     *
     * 初始化画文字的画笔
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> mTxtPaint
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initTextPaint</span>(Paint mTxtPaint) {<span style="box-sizing: border-box;"></span>
        mTxtPaint.setAntiAlias(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">true</span>);<span style="box-sizing: border-box;"></span>
        mTxtPaint.setColor(mTextColor);<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//Color.parseColor("#52ce90")</span><span style="box-sizing: border-box;"></span>
        mTxtPaint.setTextAlign(Paint.Align.CENTER);<span style="box-sizing: border-box;"></span>
        mTxtPaint.setTextSize(mTextSize);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 初始化圈和弧的画笔
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> targetPaint 区分画笔
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> color  画笔颜色
     */</span><span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">initPaint</span>(Paint targetPaint,<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> color) {<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
        targetPaint.setAntiAlias(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">true</span>);<span style="box-sizing: border-box;"></span>
        targetPaint.setColor(color);<span style="box-sizing: border-box;"></span>
        targetPaint.setStyle(Paint.Style.STROKE);<span style="box-sizing: border-box;"></span>
        targetPaint.setStrokeWidth(mStrokeWidth);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 计算控件的宽高
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> widthMeasureSpec
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> heightMeasureSpec
     */</span>
    <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">protected</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onMeasure</span>(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> widthMeasureSpec, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> heightMeasureSpec) {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> width = (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span>)Math.ceil(mRadius) * SCALE;<span style="box-sizing: border-box;"></span>
        setMeasuredDimension(width, width);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">protected</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onDraw</span>(Canvas canvas) {
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//控件的中心坐标</span><span style="box-sizing: border-box;"></span>
        mXCenter = getWidth() / SCALE;<span style="box-sizing: border-box;"></span>
        mYCenter = getHeight() / SCALE;<span style="box-sizing: border-box;"></span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">switch</span> (mStatus) {
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_NOBEGIN:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//原始状态</span>
                canvas.drawBitmap(mNotBeginImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_WAITING:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//等待下载状态</span>
                canvas.drawBitmap(mWatiImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_DOWNLOADING:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//下载中</span><span style="box-sizing: border-box;"></span>
                drawDownloadingView(canvas);<span style="box-sizing: border-box;"></span>
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_PAUSED:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//暂停</span><span style="box-sizing: border-box;"></span>
                drawPausedView(canvas);<span style="box-sizing: border-box;"></span>
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> STATUS_FINISHED:<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//下载完成</span>
                canvas.drawBitmap(finishedImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;<span style="box-sizing: border-box;"></span>
        }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 绘制下载中的view
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> canvas
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">drawDownloadingView</span>(Canvas canvas) {
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制灰色圆环</span><span style="box-sizing: border-box;"></span>
        canvas.drawCircle(mXCenter, mYCenter, mRadius - mStrokeWidth/SCALE, mCirclePaint);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制进度扇形圆环</span>
        RectF oval = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> RectF();
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//设置椭圆上下左右的坐标</span><span style="box-sizing: border-box;"></span>
        oval.left = mXCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.top = mYCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.right = mXCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.bottom = mYCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        canvas.drawArc(oval, -<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">90</span>, ((<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span>)mProgress / mTotalProgress) * <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">360</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">false</span>, mRingPaint);
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制中间百分比文字</span><span style="box-sizing: border-box;"></span>
        String percentTxt = String.valueOf(mProgress);<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//计算文字垂直居中的baseline</span><span style="box-sizing: border-box;"></span>
        Paint.FontMetricsInt fontMetrics = mTxtPaint.getFontMetricsInt();<span style="box-sizing: border-box;"></span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span> baseline = oval.top + (oval.bottom - oval.top - fontMetrics.bottom + fontMetrics.top) / SCALE - fontMetrics.top;<span style="box-sizing: border-box;"></span>
        canvas.drawText(percentTxt+<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"%"</span>, mXCenter, baseline, mTxtPaint);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 绘制暂停时的view
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> canvas
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">drawPausedView</span>(Canvas canvas) {
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制灰色圆环</span><span style="box-sizing: border-box;"></span>
        canvas.drawCircle(mXCenter, mYCenter, mRadius - mStrokeWidth/SCALE, mCirclePaint);<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制进度扇形圆环</span>
        RectF oval = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> RectF();
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//设置椭圆上下左右的坐标</span><span style="box-sizing: border-box;"></span>
        oval.left = mXCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.top = mYCenter - mRadius + mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.right = mXCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        oval.bottom = mYCenter + mRadius - mStrokeWidth/SCALE;<span style="box-sizing: border-box;"></span>
        canvas.drawArc(oval, -<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">90</span>, ((<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span>) mProgress / mTotalProgress) * <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">360</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">false</span>, mRingPaint);<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
        <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//绘制中间暂停图标</span>
        canvas.drawBitmap(mPausedImg, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>);<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 更新进度
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> progress
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">setProgress</span>(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> progress) {<span style="box-sizing: border-box;"></span>
        mProgress = progress;<span style="box-sizing: border-box;"></span>
        postInvalidate();<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//刷新</span><span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 设置下载状态
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @param</span> status
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">setStatus</span>(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> status) {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">this</span>.mStatus = status;<span style="box-sizing: border-box;"></span>
        postInvalidate();<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-javadoc" style="color: rgb(136, 0, 0); box-sizing: border-box;">/**
     * 获取下载状态
     *<span class="hljs-javadoctag" style="color: rgb(102, 0, 102); box-sizing: border-box;"> @return</span>
     */</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> <span class="hljs-title" style="box-sizing: border-box;">getStatus</span>() {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span> mStatus;<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> Bitmap <span class="hljs-title" style="box-sizing: border-box;">imageSize</span>(Bitmap b,<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span> x,<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span> y)<span style="box-sizing: border-box;"></span>
    {<span style="box-sizing: border-box;"></span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> w=b.getWidth();<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//获取图片的宽高</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> h=b.getHeight();
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span> sx=x/w;<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//要强制转换</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">float</span> sy=y/h;<span style="box-sizing: border-box;"></span>
        Matrix matrix = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Matrix();<span style="box-sizing: border-box;"></span>
        matrix.postScale(sx, sy); <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 长和宽放大缩小的比例</span>
        Bitmap resizeBmp = Bitmap.createBitmap(b, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, w,<span style="box-sizing: border-box;"></span>
                h, matrix, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">true</span>);
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span> resizeBmp;<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
}<span style="box-sizing: border-box;"></span>
</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">23</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">24</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">25</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">26</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">27</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">28</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">29</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">三十</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">31</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">32</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">33</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">34</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">35</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">36</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">37</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">38</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">39</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">40</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">41</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">42</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">43</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">44</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">45</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">46</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">47</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">48</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">49</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">50</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">51</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">52</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">53</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">54</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">55</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">56</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">57</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">58</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">59</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">60</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">61</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">62</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">63</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">64</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">65</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">66</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">67</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">68</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">69</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">70</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">71</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">72</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">73</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">74</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">75</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">76</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">77</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">78</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">79</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">80</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">81</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">82</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">83</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">84</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">85</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">86</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">87</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">88</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">89</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">90</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">91</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">92</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">93</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">94</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">95</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">96</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">97</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">98</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">99</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">100</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">101</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">102</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">103</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">104</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">105</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">106</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">107</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">108</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">109</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">110</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">111</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">112</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">113</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">114</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">115</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">116</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">117</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">118</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">119</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">120</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">121</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">122</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">123</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">124</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">125</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">126</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">127</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">128</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">129</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">130</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">131</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">132</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">133</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">134</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">135</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">136</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">137</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">138</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">139</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">140</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">141</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">142</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">143</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">144</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">145</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">146</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">147</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">148</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">149</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">150</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">151</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">152</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">153</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">154</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">155</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">156</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">157</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">158</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">159</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">160</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">161</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">162</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">163</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">164</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">165</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">166</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">167</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">168</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">169</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">170</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">171</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">172</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">173</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">174</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">175</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">176</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">177</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">178</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">179</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">180</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">181</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">182</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">183</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">184</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">185</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">186</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">187</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">188</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">189</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">190</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">191</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">192</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">193</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">194</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">195</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">196</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">197</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">198</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">199</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">200</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">201</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">202</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">203</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">204</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">205</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">206</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">207</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">208</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">209</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">210</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">211</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">212</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">213</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">214</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">215</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">216</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">217</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">218</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">219</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">220</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">221</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">222</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">223</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">224</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">225</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">226</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">227</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">228</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">229</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">230</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">231</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">232</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">233</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">234</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">235</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">236</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">237</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">238</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">239</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">240</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">241</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">242</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">243</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">244</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">245</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">246</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">247</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">248</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">249</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">250</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">251</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">252</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">253</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">254</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">255</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">256</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">257</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">258</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">259</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">260</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">261</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">262</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">263</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">264</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">23</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">24</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">25</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">26</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">27</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">28</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">29</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">三十</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">31</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">32</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">33</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">34</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">35</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">36</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">37</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">38</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">39</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">40</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">41</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">42</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">43</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">44</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">45</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">46</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">47</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">48</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">49</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">50</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">51</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">52</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">53</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">54</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">55</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">56</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">57</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">58</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">59</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">60</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">61</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">62</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">63</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">64</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">65</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">66</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">67</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">68</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">69</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">70</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">71</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">72</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">73</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">74</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">75</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">76</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">77</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">78</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">79</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">80</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">81</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">82</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">83</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">84</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">85</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">86</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">87</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">88</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">89</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">90</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">91</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">92</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">93</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">94</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">95</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">96</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">97</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">98</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">99</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">100</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">101</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">102</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">103</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">104</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">105</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">106</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">107</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">108</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">109</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">110</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">111</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">112</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">113</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">114</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">115</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">116</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">117</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">118</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">119</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">120</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">121</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">122</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">123</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">124</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">125</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">126</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">127</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">128</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">129</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">130</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">131</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">132</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">133</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">134</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">135</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">136</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">137</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">138</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">139</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">140</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">141</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">142</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">143</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">144</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">145</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">146</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">147</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">148</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">149</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">150</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">151</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">152</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">153</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">154</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">155</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">156</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">157</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">158</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">159</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">160</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">161</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">162</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">163</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">164</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">165</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">166</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">167</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">168</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">169</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">170</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">171</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">172</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">173</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">174</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">175</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">176</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">177</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">178</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">179</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">180</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">181</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">182</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">183</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">184</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">185</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">186</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">187</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">188</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">189</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">190</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">191</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">192</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">193</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">194</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">195</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">196</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">197</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">198</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">199</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">200</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">201</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">202</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">203</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">204</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">205</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">206</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">207</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">208</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">209</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">210</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">211</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">212</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">213</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">214</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">215</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">216</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">217</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">218</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">219</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">220</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">221</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">222</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">223</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">224</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">225</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">226</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">227</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">228</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">229</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">230</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">231</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">232</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">233</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">234</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">235</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">236</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">237</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">238</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">239</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">240</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">241</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">242</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">243</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">244</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">245</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">246</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">247</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">248</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">249</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">250</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">251</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">252</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">253</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">254</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">255</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">256</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">257</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">258</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">259</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">260</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">261</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">262</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">263</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">264</span></li></ul>

自定义控件的使用:

<code class="hljs vbnet has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><RelativeLayout xmlns:android=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"http://schemas.android.com/apk/res/android"</span>
    xmlns:<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"http://schemas.android.com/apk/res-auto"</span>
    android:layout_width=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"match_parent"</span>
    android:layout_height=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"match_parent"</span> ><span style="box-sizing: border-box;"></span>
<com.losileeya.downloadpercent_master.DownloadPercentView<span style="box-sizing: border-box;"></span>
        android:id=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"@+id/downloadView"</span>
        android:layout_width=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"wrap_content"</span>
        android:layout_height=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"wrap_content"</span>
        android:layout_centerInParent=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"true"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:notBeginImg=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"@drawable/ic_no_download"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:waitImg=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"@drawable/ic_wait"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:pausedImg=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"@drawable/ic_pause"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:finishedImg=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"@drawable/ic_finished"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:strokeWidth=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"4dp"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:circleColor=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"#bdbdbd"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:radius=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"40dp"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:ringColor=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"#52ce90"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:textSize=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"32sp"</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">custom</span>:textColor=<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"#52ce90"</span><span style="box-sizing: border-box;"></span>
        /><span style="box-sizing: border-box;"></span>
</RelativeLayout></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li></ul>

这里布局的使用就不用说了吧,主要就是申明控件和控件的前缀空间,并且对自定义属性赋值(你喜欢搞什么都可以)。使用过程贴代码:

<code class="hljs java has-numbering" style="display: block; padding: 0px; color: inherit; box-sizing: border-box; font-family: "Source Code Pro", monospace;font-size:undefined; white-space: pre; border-radius: 0px; word-wrap: normal; background: transparent;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">package</span> com.losileeya.downloadpercent_master;<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.os.Bundle;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.os.Handler;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.os.Message;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.support.v7.app.AppCompatActivity;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> android.view.View;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> java.lang.ref.WeakReference;
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">import</span> java.util.Random;<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-class" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">class</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">MainActivity</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">extends</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">AppCompatActivity</span> {</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> MSG_UPDATE = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>;<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//更新进度</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">final</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">static</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> MSG_FINISHED = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">2</span>;<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//完成</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> DownloadPercentView mDownloadPercentView;
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">int</span> mDownloadProgress = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>;<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//初始进度值</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Handler mHandler = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> ProgressHandler(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">this</span>);
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">boolean</span> downloading = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">false</span>;<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//是否下载中</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> Random mRandom;<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//模拟进度的随机数</span><span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">protected</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onCreate</span>(Bundle savedInstanceState) {
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">super</span>.onCreate(savedInstanceState);<span style="box-sizing: border-box;"></span>
        setContentView(R.layout.activity_main);<span style="box-sizing: border-box;"></span>
        mRandom = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Random();<span style="box-sizing: border-box;"></span>
        mDownloadPercentView = (DownloadPercentView)  findViewById(R.id.downloadView);<span style="box-sizing: border-box;"></span>
        mDownloadPercentView.setOnClickListener(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span>  View.OnClickListener() {
            <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">onClick</span>(View v) {
                <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//当进度为未开始或暂停</span>
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (mDownloadPercentView.getStatus() == DownloadPercentView.STATUS_NOBEGIN||   <span style="box-sizing: border-box;"></span>
                mDownloadPercentView.getStatus() == DownloadPercentView.STATUS_PAUSED) {<span style="box-sizing: border-box;"></span>
                    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//状态下点击变为下载状态</span>
                    downloading = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">true</span>;<span style="box-sizing: border-box;"></span>
                    mDownloadPercentView      .setStatus(DownloadPercentView.STATUS_DOWNLOADING);<span style="box-sizing: border-box;"></span>
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">// 线程控制进度</span>
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Thread(<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> Runnable() {
    <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">run</span>() {
         <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">while</span> (downloading) {
      <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//当进度为100时通过handler把状态转为下载完成,并且退出线程</span>
      <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (mDownloadProgress == <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>) {<span style="box-sizing: border-box;"></span>
            mHandler.sendEmptyMessage(MSG_FINISHED);<span style="box-sizing: border-box;"></span>
                                    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">return</span>;<span style="box-sizing: border-box;"></span>
                                }<span style="box-sizing: border-box;"></span>
      <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//进度随机增加1到10的数</span>
      mDownloadProgress += mRandom.nextInt(<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">10</span>) + <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>;
   <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//模拟过程大于100时显示100,小于则为进度值(真实不会存在大于100)</span>
     mDownloadProgress = mDownloadProgress > <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span> ? <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>:     <span style="box-sizing: border-box;"></span>
     mDownloadProgress;<span style="box-sizing: border-box;"></span>
                                <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//handler更新进度</span><span style="box-sizing: border-box;"></span>
     mHandler.sendEmptyMessage(MSG_UPDATE);<span style="box-sizing: border-box;"></span>
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">try</span> {
                    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//0.3秒更新一次精度值</span>
                    Thread.sleep(<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">300</span>);<span style="box-sizing: border-box;"></span>
                } <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">catch</span> (Exception e) {<span style="box-sizing: border-box;"></span>
                }}}}).start();<span style="box-sizing: border-box;"></span>
                } <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">else</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span>(mDownloadPercentView.getStatus()   <span style="box-sizing: border-box;"></span>
                == DownloadPercentView.STATUS_DOWNLOADING)  {<span style="box-sizing: border-box;"></span>
                <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//正在下载时点击则状态改为暂停</span>
                    downloading = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">false</span>;<span style="box-sizing: border-box;"></span>
                    mDownloadPercentView<span style="box-sizing: border-box;"></span>
            .setStatus(DownloadPercentView.STATUS_PAUSED);<span style="box-sizing: border-box;"></span>
                }<span style="box-sizing: border-box;"></span>
            }<span style="box-sizing: border-box;"></span>
        });<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> <span class="hljs-class" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">class</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">ProgressHandler</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">extends</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">Handler</span> {</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">private</span> WeakReference<MainActivity>   <span style="box-sizing: border-box;"></span>
        activityWeakReference;<span style="box-sizing: border-box;"></span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-title" style="box-sizing: border-box;">ProgressHandler</span>(MainActivity activity) {<span style="box-sizing: border-box;"></span>
            activityWeakReference = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">new</span> WeakReference<> <span style="box-sizing: border-box;"></span>
            (activity);<span style="box-sizing: border-box;"></span>
        }<span style="box-sizing: border-box;"></span>
<span style="box-sizing: border-box;"></span>
        <span class="hljs-annotation" style="color: rgb(155, 133, 157); box-sizing: border-box;">@Override</span>
        <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">public</span> <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span> <span class="hljs-title" style="box-sizing: border-box;">handleMessage</span>(Message msg) {<span style="box-sizing: border-box;"></span>
            MainActivity activity = activityWeakReference.get();<span style="box-sizing: border-box;"></span>
            <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">if</span> (activity != <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">null</span>) {
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">switch</span> (msg.what) {
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> MSG_FINISHED:<span style="box-sizing: border-box;"></span>
                    mDownloadPercentView<span style="box-sizing: border-box;"></span>
        .setStatus(DownloadPercentView.STATUS_FINISHED);<span style="box-sizing: border-box;"></span>
                    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">case</span> MSG_UPDATE:<span style="box-sizing: border-box;"></span>
         mDownloadPercentView.setProgress(mDownloadProgress);<span style="box-sizing: border-box;"></span>
                    <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">break</span>;<span style="box-sizing: border-box;"></span>
                }<span style="box-sizing: border-box;"></span>
                <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">super</span>.handleMessage(msg);<span style="box-sizing: border-box;"></span>
            }<span style="box-sizing: border-box;"></span>
        }<span style="box-sizing: border-box;"></span>
    }<span style="box-sizing: border-box;"></span>
}<span style="box-sizing: border-box;"></span>
</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">23</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">24</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">25</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">26</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">27</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">28</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">29</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">三十</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">31</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">32</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">33</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">34</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">35</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">36</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">37</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">38</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">39</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">40</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">41</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">42</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">43</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">44</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">45</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">46</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">47</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">48</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">49</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">50</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">51</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">52</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">53</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">54</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">55</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">56</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">57</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">58</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">59</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">60</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">61</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">62</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">63</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">64</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">65</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">66</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">67</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">68</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">69</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">70</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">71</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">72</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">73</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">74</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">75</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">76</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">77</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">78</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">79</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">80</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">81</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">82</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">83</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">84</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">85</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">86</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">87</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">88</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">89</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">90</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">91</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">92</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">93</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">94</span></li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right; background-color: rgb(238, 238, 238);"><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">1</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">2</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">3</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">4</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">五</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">6</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">7</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">8</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">9</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">10</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">11</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">12</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">13</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">14</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">15</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">16</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">17</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">18</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">19</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">20</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">21</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">22</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">23</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">24</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">25</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">26</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">27</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">28</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">29</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">三十</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">31</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">32</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">33</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">34</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">35</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">36</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">37</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">38</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">39</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">40</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">41</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">42</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">43</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">44</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">45</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">46</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">47</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">48</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">49</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">50</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">51</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">52</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">53</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">54</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">55</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">56</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">57</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">58</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">59</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">60</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">61</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">62</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">63</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">64</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">65</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">66</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">67</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">68</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">69</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">70</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">71</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">72</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">73</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">74</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">75</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">76</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">77</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">78</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">79</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">80</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">81</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">82</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">83</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">84</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">85</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">86</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">87</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">88</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">89</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">90</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">91</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">92</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">93</span></li><li style="box-sizing: border-box; padding: 0px 5px;"><span style="box-sizing: border-box;">94</span></li></ul>

这里没有网络请求,所以为了模仿真一点,进度每次变化用的是随机数,哈哈,就写到这里了,觉得有用帮忙顶起来。

由于没有传图片上来,想看一下效果的
演示传送门:DownloadPercent-master.rar

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
牙科就诊管理系统利用当下成熟完善的SSM框架,使用跨平台的可开发大型商业网站的Java语言,以及最受欢迎的RDBMS应用软件之一的Mysql数据库进行程序开发。实现了用户在线查看数据。管理员管理病例管理、字典管理、公告管理、药单管理、药品管理、药品收藏管理、药品评价管理、药品订单管理、牙医管理、牙医收藏管理、牙医评价管理、牙医挂号管理、用户管理、管理员管理等功能。牙科就诊管理系统的开发根据操作人员需要设计的界面简洁美观,在功能模块布局上跟同类型网站保持一致,程序在实现基本要求功能时,也为数据信息面临的安全问题提供了一些实用的解决方案。可以说该程序在帮助管理者高效率地处理工作事务的同时,也实现了数据信息的整体化,规范化与自动化。 管理员在后台主要管理病例管理、字典管理、公告管理、药单管理、药品管理、药品收藏管理、药品评价管理、药品订单管理、牙医管理、牙医收藏管理、牙医评价管理、牙医挂号管理、用户管理、管理员管理等。 牙医列表页面,此页面提供给管理员的功能有:查看牙医、新增牙医、修改牙医、删除牙医等。公告信息管理页面提供的功能操作有:新增公告,修改公告,删除公告操作。公告类型管理页面显示所有公告类型,在此页面既可以让管理员添加新的公告信息类型,也能对已有的公告类型信息执行编辑更新,失效的公告类型信息也能让管理员快速删除。药品管理页面,此页面提供给管理员的功能有:新增药品,修改药品,删除药品。药品类型管理页面,此页面提供给管理员的功能有:新增药品类型,修改药品类型,删除药品类型。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值