Android中自定义控件之液位指示器

由于安卓应用很广泛,在工业中也常有一些应用,比如可以用安卓来去工业中的一些数据进行实现的监测,显示,同时可以做一些自动化控制,当然在这里,我不是做这些自动化控制方面的研究,只是做一个控件,液位指示,其实就是继承自progressbar,然后重新写一测量与绘制,算是对自定义控件进行一下复习。

  我们要做的最终就是下面这个效果:

在这里,我们要做到对这个指示器的以下属性可设置:

容器壁的厚度、容器壁的颜色、容器中液体的宽度、液体总高度、液体当前高度的颜色显示、液体未达到颜色显示、当前高度的文字指示、指示文字大小的显示。

对以上属性的可以设置,会使在实现应用中让显示更加直观人性化。下面就开始我们的指示器的制作。

1.先在项目的res目录下建一个resouce文件,用来定义自定义的属性,这些都会在下面给出的源码中给出,新人可以参考下,老家伙你就绕道吧^^:

<?xml version="." encoding="utf-"?> <resources> <declare-styleable name="JianWWIndicateProgress"> <attr name="progress_height" format="dimension" /> <attr name="progress_width" format="dimension" /> <attr name="progress_unreachedcolor" format="color" /> <attr name="progress_reached_color" format="color" /> <attr name="progress_reached_height" format="integer" /> <attr name="progress_cheek_width" format="dimension" /> <attr name="progress_cheek_color" format="color" /> <attr name="progress_reached_textsize" format="dimension" /> <attr name="progress_reached_textcolor" format="color" /> </declare-styleable> </resources>

2.继承progressbar,这里继承他主要是为了能够用progressbar的getProgress()方法得到当前的progress,与setProgress()方法等progress中提供的一些方法,便于对数据的一些处理。

package com.jianww.firstview; import com.example.jwwcallback.R; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Paint.Style; import android.graphics.Rect; import android.util.AttributeSet; import android.util.TypedValue; import android.widget.ProgressBar; public class JianWWIndicateProgress extends ProgressBar { private static final int unreached_color = Xaaff;// 未到达的颜色 private static final int reached_color = Xaaff;// 到达颜色 private static final int progress_height = ;// 容器中液位的默认高度 private static final int progress_width = ;// 容器中液位的宽度 private static final int reached_height = ;// 默认到达到达的高度 private static final int progress_cheek_width = ;// 容器的边框宽度 private static final int progress_cheek_color = xff;// 容器的边框颜色 private static final int progress_reached_textsize = ;// 指示字体尺寸 private static final int progress_reached_textcolor = Xffff;// 指示字体颜色 protected int unReachedColor;// 未到达的颜色 protected int reachedColor;// 到达颜色 protected int progressHeight;// 容器中液位的总高度 protected int progressWidth;// 容器中液面的宽度 protected int reachedHeight;// 默认液位到达的到达的高度 protected int cheekWidth;// 容器的边框宽度 protected int cheekColor;// 容器的边框颜色 protected int reachedTextsize;// 指示字体尺寸 protected int reachedTextcolor;// 指示字体颜色 protected float widthZoom; protected float heightZoom; /** * dp px * */ protected int dppx(int dpVal) { return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dpVal, getResources().getDisplayMetrics()); } /** * sp px * */ protected int sppx(int spVal) { return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, spVal, getResources().getDisplayMetrics()); } private Paint paintCheek = new Paint(); private Paint paint = new Paint(); private float radio; private float progressNowHeight; public JianWWIndicateProgress(Context context) { this(context, null); } public JianWWIndicateProgress(Context context, AttributeSet asets) { this(context, asets, ); } public JianWWIndicateProgress(Context context, AttributeSet asets, int defStyle) { super(context, asets, defStyle); obtainStyledAttributes(asets); // paint.setTextSize(reachedTextsize); // paint.setColor(reachedTextcolor); } /** * 定义属性 * * @param asets属性 */ private void obtainStyledAttributes(AttributeSet asets) { final TypedArray typeArray = getContext().obtainStyledAttributes(asets, R.styleable.JianWWIndicateProgress); unReachedColor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_unreachedcolor, unreached_color); reachedColor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_reached_color, reached_color);// 到达颜色 progressHeight = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_height, progress_height); progressWidth = dppx( (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_width, progress_width));// 容器的总宽度 reachedHeight = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_reached_height, reached_height);// 到达的高度 cheekWidth = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_cheek_width, progress_cheek_width);// 容器的边框宽度 cheekColor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_cheek_color, progress_cheek_color); reachedTextsize = (int) typeArray.getDimension(R.styleable.JianWWIndicateProgress_progress_reached_textsize, progress_reached_textsize);// 指示字体尺寸 reachedTextcolor = typeArray.getColor(R.styleable.JianWWIndicateProgress_progress_reached_textcolor, progress_reached_textcolor);// 指示字体颜色 typeArray.recycle(); } /** * onMeasure是对绘出的控件将来占的空间进行的安排, */ @Override protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); int totalWidth = measurdWidth(widthMeasureSpec); int totalHeight = measurdHeight(heightMeasureSpec); setMeasuredDimension(totalWidth, totalHeight); } /** * * @param widthMeasureSpec * @return 获取宽度尺寸 */ private int measurdWidth(int widthMeasureSpec) { int result = ; int widthSpaceSize = MeasureSpec.getSize(widthMeasureSpec); int widthSpaceMode = MeasureSpec.getMode(widthMeasureSpec); if (widthSpaceMode == MeasureSpec.EXACTLY) { result = widthSpaceSize; widthZoom = widthSpaceSize/(progressWidth+*cheekWidth); progressWidth = (int) (progressWidth * widthZoom); } else if (widthSpaceMode == MeasureSpec.UNSPECIFIED) { result = Math.max(widthSpaceSize, getPaddingLeft() + getPaddingRight() + progressWidth + * cheekWidth); } else if (widthSpaceMode == MeasureSpec.AT_MOST) { result = Math.min(widthSpaceSize, getPaddingLeft() + getPaddingRight() + progressWidth + * cheekWidth); } return result; } /** * * @param heightMeasureSpec * @return获取高度尺寸 */ private int measurdHeight(int heightMeasureSpec) { int result = ; int heightSpaceSize = MeasureSpec.getSize(heightMeasureSpec); int heightSpaceMode = MeasureSpec.getMode(heightMeasureSpec); if (heightSpaceMode == MeasureSpec.EXACTLY) { result = heightSpaceSize; heightZoom = heightSpaceSize/(progressHeight+*cheekWidth); progressHeight = (int) (progressHeight*heightZoom); } else if (heightSpaceMode == MeasureSpec.UNSPECIFIED) { result = Math.max(heightSpaceSize, getPaddingTop() + getPaddingBottom() + progressHeight + * cheekWidth); } else if (heightSpaceMode == MeasureSpec.AT_MOST) { result = Math.min(heightSpaceSize, getPaddingTop() + getPaddingBottom() + progressHeight + * cheekWidth); } return result; } /** * 绘制控件 */ @Override protected synchronized void onDraw(Canvas canvas) { super.onDraw(canvas); radio = getProgress() * .f / getMax(); progressNowHeight = (int) (progressHeight * radio); // 存绘画前画布状态 canvas.save(); // 把画布移动到要绘制的点 canvas.translate(getPaddingLeft(), getPaddingRight()); // 绘制容器外壳 paintCheek.setColor(cheekColor);// 画笔颜色 paintCheek.setAntiAlias(true);// 是否过度 paintCheek.setStyle(Style.STROKE);// 空心 paintCheek.setStrokeWidth(cheekWidth);// 边框的宽度 canvas.drawRect(cheekWidth/, cheekWidth/, progressWidth + cheekWidth*/, progressHeight + cheekWidth*/, paintCheek); // 绘总液位 paint.setColor(unReachedColor); paint.setStyle(Style.FILL); canvas.drawRect(cheekWidth, cheekWidth, progressWidth+cheekWidth, progressHeight+cheekWidth, paint); // 绘当前液位 paint.setStyle(Style.FILL); paint.setColor(reachedColor); canvas.drawRect(cheekWidth, cheekWidth + progressHeight - progressNowHeight, progressWidth + cheekWidth, progressHeight + cheekWidth, paint); // 绘液位指示 String text = getProgress() + "%"; paint.setTextSize(reachedTextsize); paint.setColor(reachedTextcolor); float textHeight = sppx(reachedTextsize)/; if(progressNowHeight >= progressHeight/){ canvas.drawText(text, cheekWidth + progressWidth / , cheekWidth + progressHeight - progressNowHeight+textHeight, paint); }else{ canvas.drawText(text, cheekWidth + progressWidth / , cheekWidth + progressHeight - progressNowHeight, paint); } canvas.restore(); } }

3.就是在布局中的引用了

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:jwwprogress="http://schemas.android.com/apk/res-auto" xmlns:app="http://schemas.android.com/apk/res/com.example.jwwcallback" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" > <com.jianww.firstview.JianWWIndicateProgress android:id="@+id/jp_progress" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:max="" app:progress_cheek_color="#ff" app:progress_cheek_width="dp" app:progress_height="dp" app:progress_reached_color="#ff" app:progress_reached_textcolor="#" app:progress_reached_textsize="sp" app:progress_unreachedcolor="#ff" app:progress_width="dp" /> </RelativeLayout>

4.就是在acitivity中的初始化与使用。

package com.example.jwwmain; import java.io.IOException; import java.net.HttpURLConnection; import java.net.MalformedURLException; import java.net.URL; import java.util.Random; import com.example.jwwcallback.R; import com.jianww.firstview.JianWWIndicateProgress; import android.app.Activity; import android.os.Bundle; import android.os.Handler; public class MainActivity extends Activity { private JianWWIndicateProgress jprogress; private int nowProgress; private Handler mHandler = new Handler() { public void handleMessage(android.os.Message msg) { int progress = jprogress.getProgress(); jprogress.setProgress(++progress); if (progress >= ) { jprogress.setProgress(); } mHandler.sendEmptyMessageDelayed(, ); }; }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initView(); } private void initView() { jprogress = (JianWWIndicateProgress) findViewById(R.id.jp_progress); mHandler.sendEmptyMessage(); } }

关于Android中自定义控件之液位指示器的相关知识就给大家介绍到这里,希望对大家有所帮助!

时间: 2024-11-09 02:19:57

Android中自定义控件之液位指示器的相关文章

Android中自定义控件之液位指示器_Android

由于安卓应用很广泛,在工业中也常有一些应用,比如可以用安卓来去工业中的一些数据进行实现的监测,显示,同时可以做一些自动化控制,当然在这里,我不是做这些自动化控制方面的研究,只是做一个控件,液位指示,其实就是继承自progressbar,然后重新写一测量与绘制,算是对自定义控件进行一下复习. 我们要做的最终就是下面这个效果: 在这里,我们要做到对这个指示器的以下属性可设置: 容器壁的厚度.容器壁的颜色.容器中液体的宽度.液体总高度.液体当前高度的颜色显示.液体未达到颜色显示.当前高度的文字指示.指

Android中自定义控件的declare-styleable属性重用方案_Android

最近接触了Android自定义控件,涉及到自定义xml中得属性(attribute),其实也很简单,但是写着写着,发现代码不完美了,就是在attrs.xml这个文件中,发现属性冗余,于是就想有没有类似属性继承或者include之类的方法.本文将就declare-stylable中属性重用记录一下. 不完美的代码 复制代码 代码如下: <?xml version="1.0" encoding="utf-8"?> <resources>     

Android中自定义控件的declare-styleable属性重用方案

最近接触了Android自定义控件,涉及到自定义xml中得属性(attribute),其实也很简单,但是写着写着,发现代码不完美了,就是在attrs.xml这个文件中,发现属性冗余,于是就想有没有类似属性继承或者include之类的方法.本文将就declare-stylable中属性重用记录一下. 不完美的代码 复制代码 代码如下: <?xml version="1.0" encoding="utf-8"?> <resources>     

Android中自定义控件让TextView的drawableLeft与文本一起居中

前言 TextView的drawableLeft.drawableRight和drawableTop是一个常用.好用的属性,可以在文本的上下左右放置一个图片,而不使用更加复杂布局就能达到,我也常常喜欢用RadioButton的这几个属性实现很多效果,但是苦于不支持让drawbleLeft与文本一起居中,设置gravity为center也无济于事,终于有空研究了一下,这里与大家一起分享. 一.效果图 查看本栏目更多精彩内容:http://www.bianceng.cnhttp://www.bian

Android的自定义控件Canvas解析

自定义控件分为两种一种是自定义ViewGroup控件,一种是自定义View控件:跟踪View的步伐其实能跟到Java实现的最下面我们能发现的也就只有Canvas了,再下去就是C++或C实现了:所以本文主要是站在设计的的角度讲解一下Canvas跟View的关系,再简单分析一下Canvas用法: View作为Android中一切显示视图的父类,我们可看到它的绘制方法draw(Canvas canvas)中,无非也是通过Canvas的绘制来达到各种View的显示,如此Android中各种控件如:Ima

请教大神,android中我需要在自定义控件中绘制一个透明的小三角行?

问题描述 请教大神,android中我需要在自定义控件中绘制一个透明的小三角行? 请教大神,android中我需要在自定义控件中绘制一个透明的小三角行,比如我需要在LinearLayout的底部绘制一个透明背景小三角,该怎么绘制呢? 我在绘制的时候将设置成透明背景,绘制小三角不显示,必须要给他设置一个背景才会显示,纠结啊 解决方案 可以定义一个path吧,连接成一个三角形,然后画出来 解决方案二: 让UI给你做一个三角形的透明图 设为背景 解决方案三: path连接成个三角形的话,如果这个自定义

Android中的Button控件

Android中Button控件应该算作是比较简单的控件,然而,它的使用频率却是非常的高,今天,我在这里总 结了三种常用的点击Button实现其功能的方法. 1.很多时候,我们在用到Button控件时,往往都是" 一次性"使用,这时,为了方便起见,我们一般采用的是匿名内部类的方法,形如这样: button1.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { // TODO

Android中获得手机屏幕大小实现代码

  这篇文章主要介绍了Android中获得手机屏幕大小实现代码,Android开发中经常需要获得屏幕的宽高,本文直接封装成一个工具类,需要的朋友可以参考下 Android在自定义控件时,经常需要获得屏幕的宽高,每次都要写,不妨直接把他封装成工具类,直接拿来用,废话不说,直接上代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39

想请教一下android中自定义布局实现的是什么?是让App自适应吗?

问题描述 想请教一下android中自定义布局实现的是什么?是让App自适应吗? 想请教一下android中自定义布局实现的是什么?是让App自适应吗? 解决方案 http://mobile.51cto.com/abased-459427.htm 解决方案二: 自定义,自己定义文件啊,,可以自己设置风格之类的,更加个性化 解决方案三: 你说的是自定义控件吧?实现的是View类 解决方案四: 自定义布局?你想说的是自定义view么?就是让你不仅仅局限于用它所提供的控件,自己去实现想要的的界面效果