Android开发仪表盘控件

Android开发仪表盘控件

仪表盘在工业软件中很常见,今天整一个图片式仪表盘控件(非几何图形绘制)。实现非常简单,一张背景图,一张指针。创建一个RelativeLayout布局文件,然后在里面布置好控件的位置,代码如下

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/id_dial"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:src="@mipmap/meter_h_bk" />
    <ImageView
        android:id="@+id/id_dial_point"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/id_dial"
        android:layout_centerInParent="true"
        android:src="@mipmap/meter_fr" />
    <com.tech.view.DigitalText
        android:id="@+id/id_value"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/id_dial"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="2dp"
        android:text="29.9"
        android:textColor="@android:color/white"
        android:textSize="21sp" />
</RelativeLayout>

DigitalText是使用第三方字体控件,这个可自行百度搜索想要的字体。然后写一个仪表盘控件类,DialBoard

代码如下

public class DialBoard {
    private static final String TAG = DialBoard.class.getName();
    private ImageView dialPoint;
    private TextView text;
    private static final float MAX = 120.0f;
    private static final float MIN = -120.0f;
    private boolean animationDone = true;
    public DialBoard(Activity activity) {
        dialPoint = activity.findViewById(R.id.id_dial_point);
        text = activity.findViewById(R.id.id_value);
        text.setText(String.format("%.02f", 0.0f));
        setRotation(MIN, true);
    }
    public synchronized void moveTo(float progress) {
        if (animationDone) new Thread(() -> move(progress)).start();
    }
    private void move(float progress) {
        animationDone = false;
        float offset = (MAX - MIN) / 100;
        final float STEP = 2.0f;//理论上要小于offset
        float curProgress = (dialPoint.getRotation() - MIN) / offset;
        //计算当前进度和目标进度方向,步数
        float value = Math.abs(curProgress - progress);
        while (value > 0.1f) {
            value = (value < 1.0f ? 0.2f : STEP);
            if (progress < curProgress) value = -value;
            setRotation(dialPoint.getRotation() + value, false);
            Tools.sleep(10);
            curProgress = (dialPoint.getRotation() - MIN) / offset;
            value = Math.abs(curProgress - progress);
            final float textValue = curProgress;
            text.post(() -> text.setText(String.format("%.02f", textValue)));
        }
        text.post(() -> text.setText(String.format("%.02f", progress)));
        animationDone = true;
    }
    /**
     * @param rotation MIN~MAX
     */
    public void setRotation(float rotation) {
        this.setRotation(rotation, false);
    }
    private void setRotation(float rotation, boolean onCreate) {
        if (onCreate) {
            int w = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
            int h = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
            dialPoint.measure(w, h);//测量控件大小
        }
        int width = dialPoint.getMeasuredWidth();
        int height = dialPoint.getMeasuredHeight();
        dialPoint.post(() -> {
            dialPoint.setPivotX(width * 0.5f);
            dialPoint.setPivotY(height * 0.82666f);
            dialPoint.setRotation(rotation);
        });
    }
}

最终效果图
最终效果图

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值