Question

我正在尝试录制时进行可视化。我能够在画布上绘制可视化。但是绘图从视图的顶部开始并且放大了太多。怎么能在中心显示这个。以下是我的代码

VisualizerView.java：

package com.example.hp.recordingvisualization;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

import java.util.ArrayList;
import java.util.List;

public class VisualizerView extends View {
private static final int LINE_WIDTH = 1; // width of visualizer lines
private static final int LINE_SCALE = 75; // scales visualizer lines
private List<Float> amplitudes; // amplitudes for line lengths
private int width; // width of this View
private int height; // height of this View
private Paint linePaint; // specifies line drawing characteristics
private float[] mPoints;


// constructor
public VisualizerView(Context context, AttributeSet attrs) {
    super(context, attrs); // call superclass constructor
    linePaint = new Paint(); // create Paint for lines
    linePaint.setColor(Color.GREEN); // set color to green
    linePaint.setStrokeWidth(LINE_WIDTH); // set stroke width
}

// called when the dimensions of the View change
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    width = w; // new width of this View
    height = h; // new height of this View
    amplitudes = new ArrayList<Float>(width / LINE_WIDTH);
}

// clear all amplitudes to prepare for a new visualization
public void clear() {
    amplitudes.clear();
}

// add the given amplitude to the amplitudes ArrayList
public void addAmplitude(float amplitude) {
    amplitudes.add(amplitude); // add newest to the amplitudes ArrayList

    // if the power lines completely fill the VisualizerView
    if (amplitudes.size() * LINE_WIDTH >= width) {
        amplitudes.remove(0); // remove oldest power value
    }
}

// draw the visualizer with scaled lines representing the amplitudes
@Override
public void onDraw(Canvas canvas) {

    // for each item in the amplitudes ArrayList
    for (float power : amplitudes) {
        float scaledHeight = power / LINE_SCALE; // scale the power
        if (mPoints == null || mPoints.length < amplitudes.size() * 4) {
            mPoints = new float[amplitudes.size() * 4];
        }
        for (int i = 0; i < amplitudes.size() - 1; i++) {
            mPoints[i * 4] = width * i / (amplitudes.size() - 1);
            mPoints[i * 4 + 1] = scaledHeight / 2
                    + ((amplitudes.get(i) + 128)) * (scaledHeight / 2) / 128;
            mPoints[i * 4 + 2] = width * (i + 1) / (amplitudes.size() - 1);
            mPoints[i * 4 + 3] =scaledHeight / 2
                    + ((amplitudes.get(i+1) + 128)) * (scaledHeight / 2)
                    / 128;
        }
        // draw a line representing this item in the amplitudes ArrayList
        canvas.drawLines(mPoints, linePaint);
    }
}
}

RecordingActivity.java：

package com.example.hp.recordingvisualization;

/**
 * Created by hp on 11/3/2015.
 */
import android.app.Activity;
import android.media.MediaRecorder;
import android.media.MediaRecorder.OnErrorListener;
import android.media.MediaRecorder.OnInfoListener;
import android.os.Bundle;
import android.os.Environment;
import android.os.Handler;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;

import java.io.File;
import java.io.IOException;



public class RecordingActivity extends Activity {
public static final String DIRECTORY_NAME_TEMP = "AudioTemp";
public static final int REPEAT_INTERVAL = 40;
private TextView txtRecord;

VisualizerView visualizerView;

private MediaRecorder recorder = null;

File audioDirTemp;
private boolean isRecording = false;


private Handler handler; // Handler for updating the visualizer
// private boolean recording; // are we currently recording?

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

    visualizerView = (VisualizerView) findViewById(R.id.visualizer);

    txtRecord = (TextView) findViewById(R.id.txtRecord);
    txtRecord.setOnClickListener(recordClick);

    audioDirTemp = new File(Environment.getExternalStorageDirectory(),
            DIRECTORY_NAME_TEMP);
    if (audioDirTemp.exists()) {
        deleteFilesInDir(audioDirTemp);
    } else {
        audioDirTemp.mkdirs();
    }

    // create the Handler for visualizer update
    handler = new Handler();
}

OnClickListener recordClick = new OnClickListener() {

    @Override
    public void onClick(View v) {

        if (!isRecording) {
            // isRecording = true;

            txtRecord.setText("Stop Recording");

            recorder = new MediaRecorder();

            recorder.setAudioSource(MediaRecorder.AudioSource.MIC);
            recorder.setOutputFormat(MediaRecorder.OutputFormat.THREE_GPP);
            recorder.setAudioEncoder(MediaRecorder.AudioEncoder.AMR_NB);
            recorder.setOutputFile(audioDirTemp + "/audio_file"
                    + ".mp3");

            OnErrorListener errorListener = null;
            recorder.setOnErrorListener(errorListener);
            OnInfoListener infoListener = null;
            recorder.setOnInfoListener(infoListener);

            try {
                recorder.prepare();
                recorder.start();
                isRecording = true; // we are currently recording
            } catch (IllegalStateException e) {
                e.printStackTrace();
            } catch (IOException e) {
                e.printStackTrace();
            }
            handler.post(updateVisualizer);

        } else {

            txtRecord.setText("Start Recording");

            releaseRecorder();
        }

    }
};

private void releaseRecorder() {
    if (recorder != null) {
        isRecording = false; // stop recording
        handler.removeCallbacks(updateVisualizer);
        visualizerView.clear();
        recorder.stop();
        recorder.reset();
        recorder.release();
        recorder = null;
    }
}

public static boolean deleteFilesInDir(File path) {

    if( path.exists() ) {
        File[] files = path.listFiles();
        if (files == null) {
            return true;
        }
        for(int i=0; i<files.length; i++) {

            if(files[i].isDirectory()) {

            }
            else {
                files[i].delete();
            }
        }
    }
    return true;
}

@Override
protected void onDestroy() {

    super.onDestroy();
    releaseRecorder();
}

Runnable updateVisualizer = new Runnable() {
    @Override
    public void run() {
        if (isRecording) // if we are already recording
        {
            // get the current amplitude
            int x = recorder.getMaxAmplitude();
            visualizerView.addAmplitude(x); // update the VisualizeView
            visualizerView.invalidate(); // refresh the VisualizerView

            // update in every second
            handler.postDelayed(this, REPEAT_INTERVAL);
        }
    }
};


}

activity_recording.xml：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="180dp"
android:layout_alignParentBottom="true"
android:background="#231f20" >

<com.example.hp.recordingvisualization.VisualizerView
    android:id="@+id/visualizer"
    android:layout_width="220dp"
    android:layout_height="75dp"
    android:layout_centerHorizontal="true"
    android:layout_margin="5dp" />

<TextView
    android:id="@+id/txtRecord"
    android:layout_width="wrap_content"
    android:layout_height="40dp"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="25dp"
    android:gravity="center"
    android:text="Start Recording"
    android:textColor="@android:color/white"
    android:textSize="30sp" />

</RelativeLayout>

Answer 1

要使图形居中，您需要计算width和height。在onDraw()方法中执行此操作。
```
width = canvas.getWidth();
height = canvas.getHeight();
```
然后计算画布的中心（x，y）=（宽度/ 2，高度/ 2）。您需要围绕此中心点（x，y）绘制所有点。
就相关的缩放而言，您可以选择canvas.scale(scalefactor, x,y )，而不是缩放所有幅度。这很简单，易于维护。

录制时可视化：图形也放大/缩小视图并从顶部开始

1 个答案: