`
gjhappyyy
  • 浏览: 259559 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

自定义ProgressBar的加载效果

 
阅读更多

【转】http://gundumw100.iteye.com/blog/1289348

三种方式实现自定义圆形页面加载中效果的进度条 

To get a ProgressBar in the default theme that is to be used on white/light back ground, use one of the inverse styles: 
<ProgressBar style="@android:style/Widget.ProgressBar.Inverse"/> 
<ProgressBar style="@android:style/Widget.ProgressBar.Large.Inverse"/> 
<ProgressBar style="@android:style/Widget.ProgressBar.Small.Inverse"/> 

进度条 

Xml代码  收藏代码
  1. <ProgressBar android:layout_width="fill_parent" android:layout_height="wrap_content" style="?android:attr/progressBarStyleHorizontal"  />  


一、通过动画实现 
定义res/anim/loading.xml如下: 

Xml代码  收藏代码
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <animation-list android:oneshot="false"  
  3.   xmlns:android="http://schemas.android.com/apk/res/android">  
  4.   <item android:duration="150" android:drawable="@drawable/loading_01" />  
  5.   <item android:duration="150" android:drawable="@drawable/loading_02" />  
  6.   <item android:duration="150" android:drawable="@drawable/loading_03" />  
  7.   <item android:duration="150" android:drawable="@drawable/loading_04" />  
  8.   <item android:duration="150" android:drawable="@drawable/loading_05" />  
  9.   <item android:duration="150" android:drawable="@drawable/loading_06" />  
  10.   <item android:duration="150" android:drawable="@drawable/loading_07" />  
  11. </animation-list>   



在layout文件中引用如下: 

Xml代码  收藏代码
  1. <ProgressBar  
  2.   android:layout_width="wrap_content"   
  3. android:layout_height="wrap_content"  
  4.   android:indeterminate="false"   
  5. android:indeterminateDrawable="@anim/loading" />  



二、通过自定义颜色实现 
定义res/drawable/dialog_style_xml_color.xml如下: 

Xml代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <rotate xmlns:android="http://schemas.android.com/apk/res/android"  
  3. android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0"  
  4. android:toDegrees="360">  
  5. <shape android:shape="ring" android:innerRadiusRatio="3"  
  6.   android:thicknessRatio="8" android:useLevel="false">  
  7.   <gradient android:type="sweep" android:useLevel="false"  
  8.    android:startColor="#FFFFFF" android:centerColor="#FFDC35"  
  9.    android:centerY="0.50" android:endColor="#CE0000" />  
  10. </shape>  
  11. </rotate>  



在layout文件中引用如下: 

Xml代码  收藏代码
  1. <ProgressBar  
  2.   android:layout_width="wrap_content"   
  3. android:layout_height="wrap_content"  
  4.   android:indeterminate="false" android:indeterminateDrawable="@drawable/dialog_style_xml_color" />  



三、使用一张图片进行自定义 
定义res/drawable/dialog_style_xml_icon.xml如下: 

Xml代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">  
  3. <item>  
  4.   <rotate android:drawable="@drawable/dialog_progress_round"  
  5.    android:fromDegrees="0.0"   
  6. android:toDegrees="360.0"   
  7. android:pivotX="50.0%"  
  8.    android:pivotY="50.0%" />  
  9. </item>  
  10. </layer-list>  



在layout文件中引用如下: 

Xml代码  收藏代码
  1. <ProgressBar  
  2.   android:layout_width="wrap_content"   
  3. android:layout_height="wrap_content"  
  4.   android:indeterminate="false" android:indeterminateDrawable="@drawable/dialog_style_xml_icon" />  



或者使用<animated-rotate/>旋转一张图片: 

Xml代码  收藏代码
  1. <ProgressBar    
  2.         style="@android:style/Widget.ProgressBar"    
  3.         android:layout_width="wrap_content"    
  4.         android:layout_height="wrap_content"    
  5.         android:indeterminateDrawable="@drawable/custom_progress_draw"    
  6.         android:indeterminate="false" />  


custom_progress_draw.xml: 

Xml代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:drawable="@drawable/circular"  
  4.     android:pivotX="50%"  
  5.     android:pivotY="50%" />  


circular就是一张转动效果的静态图片。 

main.xml如下: 

Xml代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3. android:orientation="vertical" android:layout_width="fill_parent"  
  4. android:layout_height="fill_parent" android:gravity="center"  
  5. android:background="#FFF">  
  6. <Button android:text="@string/anim" android:id="@+id/anim"  
  7.   android:layout_width="120dip" android:layout_height="wrap_content" />  
  8. <Button android:text="@string/color" android:id="@+id/color"  
  9.   android:layout_width="120dip" android:layout_height="wrap_content" />  
  10. <Button android:text="@string/icon" android:id="@+id/icon"  
  11.   android:layout_width="120dip" android:layout_height="wrap_content" />  
  12. </LinearLayout>  



 

分享到:
评论

相关推荐

    android中自定义progressbar组件

    自定义ProgressBar主要是通过重写默认的绘制逻辑,以及可能的动画效果来实现。在这个案例中,我们将使用逐帧动画来实现loading效果。逐帧动画是一种常见的动画形式,它通过连续播放一系列静态图片来形成动态效果。在...

    自定义ProgressBar的菊花加载

    你可以详细查看这些文件,理解并学习自定义加载效果的具体实现方法。 总之,自定义ProgressBar的菊花加载是提升用户体验的重要手段,通过巧妙地结合Drawable和动画,我们可以创建出各种吸引人的加载指示器。在实际...

    多种风格的Android 自定义progressbar控件

    自定义ProgressBar可以极大地提升应用的用户体验和视觉吸引力。本项目"多种风格的Android自定义progressbar控件"提供了多种不同设计风格的进度条,让开发者可以根据自己的应用主题和需求选择合适的样式。 首先,...

    课堂资源代码(Android-ProgressBar 自定义菊花加载效果)

    这个课堂资源代码主要探讨的是如何自定义ProgressBar,创建出一种特殊的“菊花”(也称为环形或旋转)加载效果。这种效果常用于网络请求或者数据加载时,让用户知道应用正在进行后台操作。 首先,我们需要了解...

    android自定义ProgressBar(仿淘宝)的加载效果

    android自定义ProgressBar(仿淘宝)的加载效果

    自定义progressbar和对号(修改bug)

    4. 混合使用:将自定义的对号与自定义ProgressBar结合,可以创建一种独特的加载完成指示器,例如当进度达到100%时,对号自动出现,表示任务已完成。 在修复和改进原始资源的过程中,可能需要关注以下问题: 1. ...

    android实现自定义ProgressBar

    实现自定义ProgressBar通常涉及以下几个步骤: 1. 创建自定义View类:创建一个新的Java类,继承自android.widget.ProgressBar。这个类将作为自定义进度条的基础,我们需要在这个类中重写一些关键方法。 2. 设计UI...

    自定义ProgressBar带进度数字效果

    总结来说,自定义ProgressBar带进度数字效果的关键在于创建一个新的布局资源文件,定义一个包含ProgressBar和TextView的结构,然后创建一个自定义View类,继承自ProgressBar并重写`onProgressChanged()`方法,以便在...

    android 自定义ProgressBar,实现了 进度文字跟随进度效果

    这个新的类将是我们自定义ProgressBar的基础。在MyProgressBar.java文件中,我们将重写onDraw()方法来绘制我们自己的进度条和文字。 ```java public class MyProgressBar extends ProgressBar { // 初始化相关的...

    android自定义progressBar颜色,圆角

    在Android开发中,Progress Bar是显示进度的一种常见组件,它能够直观地展示应用程序执行的进度,比如下载、加载数据等操作。默认情况下,Android的Progress Bar具有特定的颜色和形状,但有时为了满足UI设计需求或者...

    自定义Android ProgressBar ics4.0加载样式

    在这个类中,你可以重写`onDraw()`方法,直接绘制自定义的加载效果。这种方法灵活性更高,但需要编写更多的代码。 4. **使用StateListDrawable**:通过定义StateListDrawable,可以根据ProgressBar的状态(如正常、...

    Android自定义Progressbar

    本主题将深入探讨如何在Android中实现自定义Progressbar,使任何图片都能像Progressbar那样旋转。 首先,我们需要了解Android的ProgressDrawable类,这是实现自定义Progressbar的核心。ProgressDrawable允许我们...

    listview底部加载,自定义ProgressBar

    本篇文章将深入探讨如何在ListView中实现底部加载,并自定义ProgressBar来显示加载状态。 首先,我们需要监听ListView的滚动事件。通过设置OnScrollListener,我们可以获取到滚动的状态。以下是一个简单的...

    Android自定义ProgressBar

    而自定义ProgressBar则允许开发者根据项目需求,创建独特且符合品牌形象的进度条样式。本篇文章将深入探讨如何在Android中自定义ProgressBar,以及重写View的相关知识。 首先,自定义ProgressBar的基本步骤包括创建...

    自定义ProgressBar图片资源

    在某些情况下,开发者可能希望自定义ProgressBar的外观,以使其更符合应用的设计风格或者提供更丰富的用户体验。本教程将深入探讨如何自定义一个最常见的“菊花”型加载进度条。 首先,我们要了解Android中的...

    Android移植之自定义ProgressBar.doc

    自定义ProgressBar可以帮助开发者根据项目需求定制独特的视觉效果。本文将详细讲解如何在Android中进行ProgressBar的移植与自定义,包括理解构造函数的工作原理、解析XML属性以及自定义样式。 首先,`ProgressBar`...

    WP8.1自定义Progressbar

    在本教程中,我们将探讨如何在WP8.1中实现一个仿Android风格的自定义Progressbar。这个Progressbar不仅在外观上接近Android,还可能包含一些Android特有的交互特性。 首先,让我们理解什么是Progressbar。...

    利用anim实现自定义progressbar

    2. **自定义ProgressBar** 接下来,我们需要创建一个自定义的ProgressBar。这通常通过继承`ProgressBar`类并重写必要的方法来实现。例如,我们可以创建一个名为`CustomProgressBar`的新类: ```java public ...

    自定义progressBar和动画显示对号

    首先,让我们来理解一下自定义ProgressBar。系统提供的默认ProgressBar虽然能满足基本需求,但在某些特定场景下,可能需要定制化设计以符合应用的视觉风格或功能需求。自定义主要包括两方面:形状和进度变化效果。...

    自定义progressbar

    自定义ProgressBar则允许开发者根据设计需求,创建独特且具有品牌特色的进度条。本文将深入探讨如何自定义圆形ProgressBar,以及在这个过程中可能遇到的关键知识点。 首先,我们从基础开始。在Android SDK中,...

Global site tag (gtag.js) - Google Analytics