Andorid Clip 实现自定义进度条效果实例

Android系统提供了水平进度条供我们显示进度使用,水平进度条在显示进度时使用的就是Clip Drawable技术

下面我们就通过一个具体的实例来说明Clip Drawable的使用。

有个知识大家要注意:

Clip类型的图片默认裁剪级别为0,此时是全部裁剪,图片看不见;

当级别为10000时,不裁剪图片,图片全部可见

程序运行结果:第一张为初始界面,第二张为点击5次界面,第三张为点击10的界面

    
 

新建一个名称为:Clip Drawable的Android 工程。

程序结构目录:

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

   <ImageView
       android:id="@+id/gril_img"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/clip"
        android:contentDescription="@string/app_name"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/Clip"
        android:onClick="change"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="20dp"/>
</RelativeLayout>

clip.xml

<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/girl"
    android:clipOrientation="horizontal"
    android:gravity="left"
    >
</clip>

strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">ClipDrawable</string>
    <string name="hello_world">Hello world!</string>
    <string name="action_settings">Settings</string>
	<string name="Clip">clip</string>
</resources>

MainActivity.java

package com.shen.clipdrawable;

import android.support.v7.app.ActionBarActivity;
import android.graphics.drawable.ClipDrawable;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ImageView;

public class MainActivity extends ActionBarActivity {

	private ImageView imageView;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		// 获取Imageview控件
		imageView = (ImageView) findViewById(R.id.gril_img);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

	@Override
	public boolean onOptionsItemSelected(MenuItem item) {
		// Handle action bar item clicks here. The action bar will
		// automatically handle clicks on the Home/Up button, so long
		// as you specify a parent activity in AndroidManifest.xml.
		int id = item.getItemId();
		if (id == R.id.action_settings) {
			return true;
		}
		return super.onOptionsItemSelected(item);
	}

	public void change(View v) {
		// 获得ClipDrawable对象
		ClipDrawable clipDrawable = (ClipDrawable) imageView.getBackground();
		// 设置裁剪级别,Clip类型的图片默认裁剪级别为0,此时是全部裁剪,图片看不见;
		// 当级别为10000时,不裁剪图片,图片全部可见
		// 当全部显示后,设置不可见
		if (10000 == clipDrawable.getLevel()) {
			clipDrawable.setLevel(0);
		}
		else {
			clipDrawable.setLevel(clipDrawable.getLevel() + 1000);
		}

	}
}

程序中用的资源图片:

源码下载

时间: 2024-10-17 15:12:07

Andorid Clip 实现自定义进度条效果实例的相关文章

Andorid Clip 实现自定义的进度条效果实例

Android该系统提供了一个水平进度条为我们展现了运行使用进展情况,水平进度条显示用于运行进度Clip Drawable技术 下面我们通过一个具体的例子来说明Clip Drawable使用. 还有我们要注意知识: Clip0,此时是所有裁剪,图片看不见: 当级别为10000时,不裁剪图片,图片所有可见 程序执行结果:第一张为初始界面,第二张为点击5次界面,第三张为点击10的界面        watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvY3F0ZG

Android自定义进度条样式

最近在做一个widget,上面需要一个progressbar,产品经理和设计师给出来的东西是要实现一个圆角的progress和自定义的颜色,研究一小下,分享出来给大家哦. 测试于:Android4.0+ 操作步骤: 1.创建你的layout文件引用progressbar如下,标红处引用你自定的样式: <ProgressBar android:id="@+id/progressDownload" style="?android:attr/progressBarStyleH

自定义进度条\文字描边样式\文字上下滚动TextSwithcher的应用

一.自定义进度条 1.<ProgressBar         android:id="@+id/patch_progress"         style="@style/gxProgressStyle"         android:layout_width="match_parent"         android:layout_height="12dp"         android:layout_alig

android 自定义进度条颜色

先看图 基于产品经理各种自定义需求,经过查阅了解,下面是自己对Android自定义进度条的学习过程!   这个没法了只能看源码了,还好下载了源码, sources\base\core\res\res\  下应有尽有,修改进度条颜色只能找progress ,因为是改变样式,首先找styles.xml 找到xml后,进去找到 [html] view plaincopyprint? <span style="font-size: 18px;">    <style name

Javascript 及 CSS3 实现进度条效果

一:css2 属性clip实现网页进度条:  在实现之前,我们先来介绍一下clip属性,因为这个属性在css2.1中很少使用到,所以我们有必要来了解一下: 浏览器支持程度:所有主流浏览器都支持 clip 属性. Clip属性在w3c官网是这样描述的:通过对元素进行裁剪来控制元素的可视区域,默认情况下 元素是不进行任何裁剪的. Clip裁剪的语法如下: .xx {clip:rect(<top>, <right>, <bottom>, <left>)} Rect

自定义进度条PictureProgressBar——从开发到开源发布全过程

自定义进度条PictureProgressBar--从开发到开源发布全过程 出处: 炎之铠邮箱:[email protected] 本文原创,转载请注明本出处! 本项目JCenter地址:https://bintray.com/yanzhikaijky/CustomViewRepository/PictureProgressbar/ 本项目GitHub地址:https://github.com/totond/PictureProgressBar 欢迎 Star or Fork和在Issue里提出

图解CSS3制作圆环形进度条的实例教程

圆环形进度条制作的基本思想还是画出基本的弧线图形,然后CSS3中我们可以控制其旋转来串联基本图形,制造出部分消失的效果,下面就来带大家学习图解CSS3制作圆环形进度条的实例教程 首先,当有人说你能不能做一个圆形进度条效果出来时,如果是静态完整圆形进度条,那么就很简单了: .circleprogress{        width: 160px;        height: 160px;        border:20px solid red;        border-radius: 50

Android_自定义进度条

转载:http://blog.csdn.net/lmj623565791/article/details/43371299 ,本文出自:[张鸿洋的博客] 1.概述 最近需要用进度条,秉着不重复造轮子的原则,上github上搜索了一番,看了几个觉得比较好看的ProgressBar,比如:daimajia的等.简单看了下代码,基本都是继承自View,彻彻底底的自定义了一个进度条.盯着那绚丽滚动条,忽然觉得,为什么要通过View去写一个滚动条,系统已经提供了ProgressBar以及属于它的特性,我们

跟随进度而变色进度条效果ios源码

这个是跟随进度而变色进度条效果案例,源码EAColourfulProgressView,EAColourfulProgressView的进度条能够跟随进度而变色.颜色和进度的总量可以通过Storyboard改变.效果图: <ignore_js_op> 使用方法: 支持CocoaPods: pod 'EAColourfulProgressView', '~> 0.1.0' 导入头文件: #import "EAColourfulProgressView.h" 可以在Sto