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

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

XML 
阅读更多
三种方式实现自定义圆形页面加载中效果的进度条 收藏
一、通过动画实现
定义res/anim/loading.xml如下:
<?xml version="1.0" encoding="UTF-8"?>
<animation-list android:oneshot="false"
  xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:duration="150" android:drawable="@drawable/loading_01" />
  <item android:duration="150" android:drawable="@drawable/loading_02" />
  <item android:duration="150" android:drawable="@drawable/loading_03" />
  <item android:duration="150" android:drawable="@drawable/loading_04" />
  <item android:duration="150" android:drawable="@drawable/loading_05" />
  <item android:duration="150" android:drawable="@drawable/loading_06" />
  <item android:duration="150" android:drawable="@drawable/loading_07" />
</animation-list>

在layout文件中引用如下:
<ProgressBar android:id="@+id/loading_process_dialog_progressBar"
  android:layout_width="wrap_content" android:layout_height="wrap_content"
  android:indeterminate="false" android:indeterminateDrawable="@anim/loading" />

二、通过自定义颜色实现
定义res/drawable/dialog_style_xml_color.xml如下:
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0"
android:toDegrees="360">
<shape android:shape="ring" android:innerRadiusRatio="3"
  android:thicknessRatio="8" android:useLevel="false">
  <gradient android:type="sweep" android:useLevel="false"
   android:startColor="#FFFFFF" android:centerColor="#FFDC35"
   android:centerY="0.50" android:endColor="#CE0000" />
</shape>
</rotate>

在layout文件中引用如下:
<ProgressBar android:id="@+id/loading_process_dialog_progressBar"
  android:layout_width="wrap_content" android:layout_height="wrap_content"
  android:indeterminate="false" android:indeterminateDrawable="@drawable/dialog_style_xml_color" />

三、使用一张图片进行自定义
定义res/drawable/dialog_style_xml_icon.xml如下:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
  <rotate android:drawable="@drawable/dialog_progress_round"
   android:fromDegrees="0.0" android:toDegrees="360.0" android:pivotX="50.0%"
   android:pivotY="50.0%" />
</item>
</layer-list>

在layout文件中引用如下:
<ProgressBar android:id="@+id/loading_process_dialog_progressBar"
  android:layout_width="wrap_content" android:layout_height="wrap_content"
  android:indeterminate="false" android:indeterminateDrawable="@drawable/dialog_style_xml_icon" />

main.xml如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent" android:gravity="center"
android:background="#FFF">
<Button android:text="@string/anim" android:id="@+id/anim"
  android:layout_width="120dip" android:layout_height="wrap_content" />
<Button android:text="@string/color" android:id="@+id/color"
  android:layout_width="120dip" android:layout_height="wrap_content" />
<Button android:text="@string/icon" android:id="@+id/icon"
  android:layout_width="120dip" android:layout_height="wrap_content" />
</LinearLayout>
分享到:
评论
1 楼 ntop 2011-07-13  
Thax , it's just what i need !!

相关推荐

    动画实现自定义圆形加载中效果的进度条

    "动画实现自定义圆形加载中效果的进度条"就是一种常见的设计,它通过视觉动效来吸引用户的注意力,同时传达出系统正在工作的信息。 进度条主要分为两种类型:线性进度条和圆形进度条。线性进度条通常沿水平或垂直...

    Android三种方式实现ProgressBar自定义圆形进度条

    进度条样式在项目中经常可以见到,下面小编给大家分享Android三种方式实现ProgressBar自定义圆形进度条。 Android进度条有4种风格可以使用。 默认值是progressBarStyle。 设置成progressBarStyleSmall后,图标变小...

    安卓进度条loadingprogress相关-动画实现自定义圆形加载中效果的进度条Android开发中在处理耗时工作的时候例如列表加载大多数会有一个精度条加载的框里面有一个像gif的图片在旋转一样。.rar

    动画实现自定义圆形加载中效果的进度条 ,Android开发中在处理耗时工作的时候,例如:列表加载,大多数会有一个精度条加载的框,里面有一个像gif的图片在旋转一样。.rar,太多无法一一验证是否可用,程序如果跑不起来...

    Qt案例之利用QPainter实现自定义圆形进度条.zip

    Qt案例之利用QPainter实现自定义圆形进度条,纯QPainter绘制,不包括图片,详情可参考文章:https://blog.csdn.net/didi_ya/article/details/124378255

    flex可自定义圆形加载进度条例子代码下载

    在这个特定的案例中,我们关注的是使用Flex实现的自定义圆形加载进度条。 在Web应用中,进度条是用户界面中常见的一种元素,用于指示某个任务或数据加载的进度。圆形进度条与传统的水平进度条不同,它以圆形图案...

    Android自定义圆形进度条

    首先,我们需要创建一个新的Java类,继承自Android的View类,作为自定义圆形进度条的基础。在`ProgressDemo`项目中,这个类可能被命名为`CircleProgressBar.java`。在该类中,我们需要重写以下关键方法: 1. **构造...

    自定义圆形加载进度条弹窗

    首先,我们从标题"自定义圆形加载进度条弹窗"入手。这里的"圆形加载进度条"通常是指一个以圆形形式显示加载进度的UI组件,它可以是渐进式的,也可以是旋转的。在Android中,我们可以使用` ProgressBar `或` Circular...

    Android 自定义图片加载进度条

    本文将详细介绍如何创建一个自定义的加载进度条,以及如何实现一个圆形进度条来展示图片加载的百分比。 首先,我们从基础开始。Android原生系统并未提供专门用于图片加载进度显示的控件,但我们可以利用ImageView、...

    自定义圆形进度条中间加图

    在智能家居领域,用户界面设计是至关...综上所述,自定义圆形进度条中间加图是一种提高智能家居应用界面吸引力的有效手段。通过Android的图形API和动画机制,开发者可以创建出既实用又美观的组件,提升用户的使用体验。

    WPF实现的圆形进度条

    在Windows Presentation Foundation (WPF) 中,开发人员可以利用丰富的图形功能来创建各种自定义UI元素,其中之一就是圆形进度条。圆形进度条通常用于展示一个任务的进度,它以直观的方式呈现百分比完成状态,与传统...

    自定义圆形 进度条 circleProgressbar

    "自定义圆形进度条"(circleProgressbar)就是这样的一个实例,它允许开发者根据特定需求创建具有个性化外观和行为的进度条组件。这个自定义视图通常用于展示某种任务或进程的完成程度,比如加载、刷新或者计时等...

    安卓自定义圆形进度条

    一、自定义圆形进度条的基本概念 自定义圆形进度条通常涉及以下关键点: 1. 绘制:利用Android的`View`或`ViewGroup`作为基类,重写`onDraw()`方法,在这个方法内使用`Canvas`进行绘制。我们可以使用`Path`来创建...

    自定义View之——图片加载进度条

    本篇文章将深入探讨如何实现一个自定义的图片加载进度条,以提升用户体验并展示图片加载过程。 首先,我们需要理解进度条的基本概念。进度条通常用于表示一个操作的进度,比如网络数据的加载、文件的下载等。在...

    自定义Qt圆形进度条

    具体实现自定义圆形进度条的过程包括以下几个步骤: 1. **创建自定义控件类**:首先,我们需要创建一个新的Qt类,继承自QWidget或QQuickItem(如果使用Qt Quick)。这里我们有两个cpp文件(diaplot.cpp和widget.cpp...

    自定义圆形进度条--加载动画

    自定义圆形进度条,带加载动画和颜色渐变

    自定义进度条&自定义弧形进度条(附带动画效果)

    在IT开发领域,自定义控件常常能提升应用的用户体验和视觉效果。本文将深入探讨如何使用HTML5的Canvas元素来实现自定义的弧形...在实际开发中,你可以根据项目需求进行调整和优化,以实现更加复杂和精细的进度条效果。

    Android自定义View-实现圆形水波进度条

    本教程将深入探讨如何实现一个特殊的自定义View:圆形水波进度条。这个组件通常用于显示进度或加载状态,同时以其独特的视觉效果吸引用户的注意力。 首先,我们需要创建一个新的Java类,继承自`android.view.View`...

    自定义圆形缓冲进度条

    "自定义圆形缓冲进度条"是一个专门设计的UI组件,它允许开发者在应用程序中创建一个动态的、可定制的进度指示器,特别是在视频加载、数据同步或其他需要显示加载进度的情景下非常实用。这种进度条的独特之处在于其...

    自定义圆形百分比进度条

    "自定义圆形百分比进度条"是一个常见的需求,它通常用于显示任务完成的百分比、投票结果或者资源加载的状态。这种控件可以直观地向用户展示数据,并且在视觉上更吸引人。下面将详细讲解如何实现这样一个功能。 首先...

    安卓进度条loadingprogress相关-Android自定义圆形进度条效果.rar

    以下将详细讲解如何在Android中实现自定义圆形进度条以及相关知识点。 首先,我们来看圆形进度条的基本概念。在Android的默认组件中,ProgressBar提供了线性(Horizontal)和旋转(Circular)两种模式。但是,为了...

Global site tag (gtag.js) - Google Analytics