雷达动画android

Question

事情是这样的。我正在监控特定的距离，我想用雷达动画来显示它们。基本雷达图像应该是like this (not exactly)格式的

其中每个圆圈表示一个距离范围。这个想法是，随着距离的变化，点向圆移动。我最初的方法是用每个圆圈上的圆点为同一雷达制作不同的图像，然后简单地根据距离切换它们。但是我想知道是否有机会(performant，这在不同的分辨率下工作得很好)有一个雷达的基础图像，并简单地移动点。我希望我说得很清楚，如果任何人有一个想法，我将非常感谢。

我不会张贴任何代码，因为我需要这个想法，然后我会努力实现

Answer 1

你有没有试过这些例子？

https://github.com/jfabrix101/RadarCustomVIew

https://github.com/gpfduoduo/RadarScanView

i.e

Radar.java

public class RadarView extends View {

    private final String LOG = "RadarView";
    private final int POINT_ARRAY_SIZE = 25;

    private int fps = 100;
    private boolean showCircles = true;

    float alpha = 0;
    Point latestPoint[] = new Point[POINT_ARRAY_SIZE];
    Paint latestPaint[] = new Paint[POINT_ARRAY_SIZE];

    public RadarView(Context context) {
        this(context, null);
    }

    public RadarView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public RadarView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        Paint localPaint = new Paint();
        localPaint.setColor(Color.GREEN);
        localPaint.setAntiAlias(true);
        localPaint.setStyle(Paint.Style.STROKE);
        localPaint.setStrokeWidth(1.0F);
        localPaint.setAlpha(0);

        int alpha_step = 255 / POINT_ARRAY_SIZE;
        for (int i=0; i < latestPaint.length; i++) {
            latestPaint[i] = new Paint(localPaint);
            latestPaint[i].setAlpha(255 - (i* alpha_step));
        }
    }


        android.os.Handler mHandler = new android.os.Handler();
        Runnable mTick = new Runnable() {
        @Override
        public void run() {
            invalidate();
            mHandler.postDelayed(this, 1000 / fps);
        }
        };


    public void startAnimation() {
        mHandler.removeCallbacks(mTick);
        mHandler.post(mTick);
    }

    public void stopAnimation() {
        mHandler.removeCallbacks(mTick);
    }

    public void setFrameRate(int fps) { this.fps = fps; }
    public int getFrameRate() { return this.fps; };

    public void setShowCircles(boolean showCircles) { this.showCircles =     showCircles; }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);


        int width = getWidth();
        int height = getHeight();

        int r = Math.min(width, height);


        //canvas.drawRect(0, 0, getWidth(), getHeight(), localPaint);

        int i = r / 2;
        int j = i - 1;
        Paint localPaint = latestPaint[0]; // GREEN

        if (showCircles) {
            canvas.drawCircle(i, i, j, localPaint);
            canvas.drawCircle(i, i, j, localPaint);
            canvas.drawCircle(i, i, j * 3 / 4, localPaint);
            canvas.drawCircle(i, i, j >> 1, localPaint);
            canvas.drawCircle(i, i, j >> 2, localPaint);
        }

        alpha -= 0.5;
        if (alpha < -360) alpha = 0;
        double angle = Math.toRadians(alpha);
        int offsetX =  (int) (i + (float)(i * Math.cos(angle)));
        int offsetY = (int) (i - (float)(i * Math.sin(angle)));

        latestPoint[0]= new Point(offsetX, offsetY);

        for (int x=POINT_ARRAY_SIZE-1; x > 0; x--) {
            latestPoint[x] = latestPoint[x-1];
        }



        int lines = 0;
        for (int x = 0; x < POINT_ARRAY_SIZE; x++) {
            Point point = latestPoint[x];
            if (point != null) {
                canvas.drawLine(i, i, point.x, point.y, latestPaint[x]);
            }
        }


        lines = 0;
        for (Point p : latestPoint) if (p != null) lines++;

        boolean debug = false;
        if (debug) {
            StringBuilder sb = new StringBuilder(" >> ");
            for (Point p : latestPoint) {
                if (p != null) sb.append(" (" + p.x + "x" + p.y + ")");
            }

            Log.d(LOG, sb.toString());
            //  " - R:" + r + ", i=" + i +
            //  " - Size: " + width + "x" + height +
            //  " - Angle: " + angle +
            //  " - Offset: " + offsetX + "," + offsetY);
        }

    }

}

在你的activity.xml中

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@android:color/black">

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="start"
    android:onClick="startAniamtion"/>

<frusso.radartest.RadarView
    android:id="@+id/radarView"
    android:layout_width="240dp"
    android:layout_height="240dp"
    android:layout_gravity="center_horizontal"

    />

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="stop"
    android:onClick="stopAnimation"/>

Activity.java

public class MainActivity extends Activity {

    RadarView mRadarView = null;

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

        mRadarView = (RadarView) findViewById(R.id.radarView);
        mRadarView.setShowCircles(true);
    }


    public void stopAnimation(View view) {
        if (mRadarView != null) mRadarView.stopAnimation();
    }

    public void startAnimation(View view) {
        if (mRadarView != null) mRadarView.startAnimation();
    }
}

希望这篇文章能指导你满足你的需求。

Answer 2

我的方法是有一个雷达的静态图像和另一个点的静态图像(如果你想要一个自定义的)。我有两个主线，一个是游戏循环，另一个是根据你的位置移动雷达图像上的点。

Answer 3

“我正在监控特定的距离”~这是什么意思？

要创建雷达，请创建一个扩展ImageView的类。覆盖onDraw(画布画布)并将图像资源设置为雷达背景。

 @Override
 public void onDraw(Canvas canvas) {
     //draw background
     super.onDraw(canvas);

     for(PointF p : points)
     {
         //draw each point as an image.  Maybe, translate by width/2 and height/2
     }
 }