简单的仪表视图像android中的speedmeter？

Question

我想要一个简单的仪表视图,我将定义起始值和结束值,并有一个指针来显示给定的变量值.

所以我可以像速度计一样显示给定的值.例如,如果我的textView的值是1300,那么在textview旁边我想要这样的自定义仪表视图动画!

有可能的？任何现有的示例代码？

Answer 1

我找到的另一个Evelina Vrabie's blog,使用它并且工作完美!

看看Evelina Vrabie's GitHub.它有一个仪表库和一些与之交互的样本.

非常感谢主人Evelina Vrabie!

然而,它不适用于XHDPI /几个版本的Android设备(4以上).问题是仪表视图中的文本.

Answer 2

对于任何寻找简单量表视图的人,我创建了一个库,您可以根据需要克隆和使用/修改.

CustomGauge

Answer 3

您推荐的所有其他仪表都有缺陷,并且在Kitkat和Lollipop上运行不正常.此处还没有Android Studio和gradle友好库.

这里是git repo,用于为Lollipop更新的最新版本,您可以使用Gradle:

• https://github.com/Sulejman/GaugeView

在项目中包含库后,将gaugelibrary添加到活动的xml布局中:

<io.sule.gaugelibrary.GaugeView
 android:id="@+id/gauge_view"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="#ffffff"
 gauge:showOuterShadow="false"
 gauge:showOuterRim="false"
 gauge:showInnerRim="false"
 gauge:needleWidth="0.010"
 gauge:needleHeight="0.40"
 gauge:scaleStartValue="0"
 gauge:scaleEndValue="100"
 />

这将显示无针的静态量规.要使用随机动画实例化针,您需要在活动类文件中执行此操作.看看它是如何完成的:

package io.sule.testapplication;

import android.app.Activity;
import android.os.Bundle;
import android.os.CountDownTimer;
import android.view.Menu;
import android.view.MenuItem;

import java.util.Random;

import io.sule.gaugelibrary.GaugeView;

public class MainActivity extends Activity {
   private GaugeView mGaugeView;
   private final Random RAND = new Random();

   @Override
   protected void onCreate(Bundle savedInstanceState) {
     super.onCreate(savedInstanceState);
     setContentView(R.layout.activity_main);

      mGaugeView = (GaugeView) findViewById(R.id.gauge_view);
      mTimer.start();
   }


   private final CountDownTimer mTimer = new CountDownTimer(30000, 1000) {

      @Override
      public void onTick(final long millisUntilFinished) {
         mGaugeView.setTargetValue(RAND.nextInt(101));
      }

      @Override
      public void onFinish() {}
   };
}

这将实例化针并使其动画移动到随机值.

Answer 4

我不久前做了这个。随意克隆和修改。（它借鉴了旧老式温度计的一些想法。）

github.com/Pygmalion69/Gauge

它可以轻松添加到您的 Gradle 项目中：

repositories {
    maven {
        url 'https://www.jitpack.io'
    }
}

dependencies {
    compile 'com.github.Pygmalion69:Gauge:1.1'
}

视图以 XML 形式声明：

<de.nitri.gauge.Gauge
    android:id="@+id/gauge1"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    android:layout_gravity="center"
    android:layout_marginTop="10dp"
    android:layout_weight="0.75"
    gauge:labelTextSize="42"
    gauge:maxValue="1000"
    gauge:minValue="0"
    gauge:totalNicks="120"
    gauge:valuePerNick="10"
    gauge:upperText="Qty"
    gauge:lowerText="@string/per_minute" />

以下是以编程方式设置值的示例：

    final Gauge gauge1 = (Gauge) findViewById(R.id.gauge1);
    final Gauge gauge2 = (Gauge) findViewById(R.id.gauge2);
    final Gauge gauge3 = (Gauge) findViewById(R.id.gauge3);
    final Gauge gauge4 = (Gauge) findViewById(R.id.gauge4);

    gauge1.moveToValue(800);

    HandlerThread thread = new HandlerThread("GaugeDemoThread");
    thread.start();
    Handler handler = new Handler(thread.getLooper());

    handler.postDelayed(new Runnable() {
        @Override
        public void run() {
            gauge1.moveToValue(300);
        }
    }, 2800);
    handler.postDelayed(new Runnable() {
        @Override
        public void run() {
            gauge1.moveToValue(550);
        }
    }, 5600);

    HandlerThread gauge3Thread = new HandlerThread("Gauge3DemoThread");
    gauge3Thread.start();
    Handler gauge3Handler = new Handler(gauge3Thread.getLooper());
    gauge3Handler.post(new Runnable() {
        @Override
        public void run() {
            for (float x = 0; x <= 6; x += .1) {
                float value = (float) Math.atan(x) * 20;
                gauge3.moveToValue(value);
                try {
                    Thread.sleep(100);
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
            }
        }
    });

    gauge4.setValue(333);