[历史归档]本文原发布于 cstriker1407.info 个人博客内容为历史存档仅供参考。发布时间2013-10-24 标题Android应用开发笔记ProgressBar的使用分类编程 / android 标签android·进度条Android应用开发笔记ProgressBar的使用1. 最简单的 ProgressBar圆形旋转2. 横向进度条3. 标题栏进度条4. 横向图片加载进度条5. 自定义旋转进度条左边自定义颜色渐变旋转进度条右边自定义图片旋转进度条6. 竖向进度条7. 横向图片平铺进度条8. 渐变色横向进度条备注备忘 ProgressBar 的常用方法和样式设置。GitHubHelloProgressBar1. 最简单的 ProgressBar圆形旋转从左到右依次为 Large、Normal、Small 三种尺寸XML 定义ProgressBarandroid:idid/bar_largestyle?android:attr/progressBarStyleLargeandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentLefttrueandroid:layout_alignParentToptrue/ProgressBarandroid:idid/bar_normalandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentToptrueandroid:layout_centerHorizontaltrue/ProgressBarandroid:idid/bar_smallstyle?android:attr/progressBarStyleSmallandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentRighttrueandroid:layout_alignParentToptrue/2. 横向进度条XML 定义使用progressBarStyleHorizontal样式ProgressBarandroid:idid/bar_horizontalstyle?android:attr/progressBarStyleHorizontalandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentLefttrueandroid:layout_alignParentRighttrueandroid:layout_belowid/bar_large/Java 调用bar_horizontal.setMax(100);bar_horizontal.setProgress(50);bar_horizontal.setSecondaryProgress(75);3. 标题栏进度条该进度条无 XML 定义通过 Java 实现OverrideprotectedvoidonCreate(BundlesavedInstanceState){super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_PROGRESS);setContentView(R.layout.activity_main);}OverridepublicvoidonClick(Viewv){setProgressBarVisibility(true);setProgress(5000);}4. 横向图片加载进度条进度为 0 时显示黑白图进度为 100 时显示全彩图。XML 定义背景为黑白图片进度色为自定义 XMLProgressBarandroid:idid/bar_colorstyle?android:attr/progressBarStyleHorizontalandroid:layout_widthmatch_parentandroid:layout_height50dpandroid:layout_alignParentLefttrueandroid:layout_alignParentRighttrueandroid:layout_belowid/bar_horizontalandroid:layout_marginTop32dpandroid:backgrounddrawable/sword_blackandroid:progressDrawabledrawable/picture/picture.xml使用clip表示图片不重复?xml version1.0 encodingutf-8?layer-listxmlns:androidhttp://schemas.android.com/apk/res/androiditemandroid:idandroid:id/progressclipandroid:drawabledrawable/sword_color//item/layer-list5. 自定义旋转进度条左边自定义颜色渐变旋转进度条ProgressBarandroid:idid/progressBar1android:indeterminateDrawabledrawable/dialog_style_xml_colorandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentLefttrueandroid:layout_belowid/bar_color/dialog_style_xml_color.xml?xml version1.0 encodingutf-8?rotatexmlns:androidhttp://schemas.android.com/apk/res/androidandroid:fromDegrees0android:pivotX50%android:pivotY50%android:toDegrees360shapeandroid:innerRadiusRatio3android:shaperingandroid:thicknessRatio8android:useLevelfalsegradientandroid:centerColor#FFDC35android:centerY0.50android:endColor#CE0000android:startColor#FFFFFFandroid:typesweepandroid:useLevelfalse//shape/rotate右边自定义图片旋转进度条ProgressBarandroid:idid/progressBar2android:indeterminateDrawabledrawable/circle_progress_rotateandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignTopid/progressBar1android:layout_toRightOfid/btn_left/circle_progress_rotate.xml?xml version1.0 encodingutf-8?animated-rotatexmlns:androidhttp://schemas.android.com/apk/res/androidandroid:drawabledrawable/circle_progressandroid:pivotX50%android:pivotY50%/6. 竖向进度条竖向进度条通过设置clip的填充方向实现ProgressBarandroid:idid/progressBar5style?android:attr/progressBarStyleHorizontalandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_aboveid/btn_leftandroid:layout_alignParentLefttrueandroid:layout_belowid/progressBar4android:max100android:progress50android:progressDrawabledrawable/verticalandroid:secondaryProgress78/vertical.xmlclipOrientationverticalgravitybottom实现从下往上填充?xml version1.0 encodingutf-8?layer-listxmlns:androidhttp://schemas.android.com/apk/res/androiditemandroid:idandroid:id/progressclipandroid:clipOrientationverticalandroid:gravitybottomshapecornersandroid:radius5dip/gradientandroid:startColor#ffffd300android:centerColor#ffffb600android:centerX0.75android:endColor#ffffcb00android:angle90//shape/clip/item/layer-list7. 横向图片平铺进度条ProgressBarandroid:idid/progressBar6style?android:attr/progressBarStyleHorizontalandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignBottomid/progressBar5android:layout_alignParentRighttrueandroid:layout_toRightOfid/progressBar5android:max100android:progress50android:progressDrawabledrawable/picture_progressbar/picture_progressbar.xml与剑的对比可体会clip的作用——此处不使用 clip图片直接平铺?xml version1.0 encodingutf-8?layer-listxmlns:androidhttp://schemas.android.com/apk/res/androiditemandroid:idandroid:id/backgroundandroid:drawabledrawable/background/itemandroid:idandroid:id/progressandroid:drawabledrawable/progress//layer-list8. 渐变色横向进度条ProgressBarandroid:idid/progressBar4style?android:attr/progressBarStyleHorizontalandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_alignParentLefttrueandroid:layout_alignParentRighttrueandroid:max100android:progress50android:secondaryProgress78android:progressDrawabledrawable/color_progressbarandroid:layout_belowid/progressBar3/color_progressbar.xml?xml version1.0 encodingutf-8?layer-listxmlns:androidhttp://schemas.android.com/apk/res/androiditemandroid:idandroid:id/backgroundshapecornersandroid:radius5dip/gradientandroid:startColor#ff9d9e9dandroid:centerColor#ff5a5d5aandroid:centerY0.75android:endColor#ff747674android:angle270//shape/itemitemandroid:idandroid:id/secondaryProgressclipshapecornersandroid:radius5dip/gradientandroid:startColor#80ffd300android:centerColor#80ffb600android:centerY0.75android:endColor#a0ffcb00android:angle270//shape/clip/itemitemandroid:idandroid:id/progressclipshapecornersandroid:radius5dip/gradientandroid:startColor#FF3030android:endColor#AEEEEEandroid:angle270//shape/clip/item/layer-list备注clip的具体作用需要详细查询。旋转型进度条的style需要进一步学习。参考cnblogs - ProgressBar 样式大全51CTO - 进度条自定义