Develop Reference

Convert sinusoid values to audio in android

I am graphically representing audio on x and y axis. From those y-axis points I want to generate audio again.
Followed https://github.com/billthefarmer/scope this to get points on y-axis. I have all of the values of y-axis points. These points can be used to represent a wave graphically.
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import java.io.IOException;
import java.io.OutputStreamWriter;
import java.util.Locale;
// Scope
public class Scope extends View {
private int width;
private int height;
private Path path;
private Canvas cb;
private Paint paint;
private Bitmap bitmap;
private Bitmap graticule;
protected boolean storage;
protected boolean clear;
protected float step;
protected float scale;
protected float start;
protected float index;
protected float yscale;
protected boolean points;
protected MainActivity.Audio audio;
// Scope
public Scope(Context context, AttributeSet attrs) {
super(context, attrs);
// Create path and paint
path = new Path();
paint = new Paint();
}
// On size changed
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
// Get dimensions
width = w;
height = h;
// Create a bitmap for trace storage
bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
cb = new Canvas(bitmap);
// Create a bitmap for the graticule
graticule = Bitmap.createBitmap(width, height,
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(graticule);
// Black background
canvas.drawColor(Color.BLACK);
// Set up paint
paint.setStrokeWidth(2);
paint.setStyle(Paint.Style.STROKE);
paint.setColor(Color.argb(255, 0, 63, 0));
// Draw graticule
for (int i = 0; i < width; i += MainActivity.SIZE)
canvas.drawLine(i, 0, i, height, paint);
canvas.translate(0, height / 2);
for (int i = 0; i < height / 2; i += MainActivity.SIZE) {
canvas.drawLine(0, i, width, i, paint);
canvas.drawLine(0, -i, width, -i, paint);
}
// Draw the graticule on the bitmap
cb.drawBitmap(graticule, 0, 0, null);
cb.translate(0, height / 2);
}
private int max;
// On draw
#Override
protected void onDraw(Canvas canvas) {
// Check for data
if ((audio == null) || (audio.data == null)) {
canvas.drawBitmap(graticule, 0, 0, null);
return;
}
// Draw the graticule on the bitmap
if (!storage || clear) {
cb.drawBitmap(graticule, 0, -height / 2, null);
clear = false;
}
// Calculate x scale etc
float xscale = (float) (2.0 / ((audio.sample / 100000.0) * scale));
int xstart = Math.round(start);
int xstep = Math.round((float) 1.0 / xscale);
int xstop = Math.round(xstart + ((float) width / xscale));
if (xstop > audio.length)
xstop = (int) audio.length;
// Calculate y scale
if (max < 4096)
max = 4096;
yscale = (float) (max / (height / 2.0));
max = 0;
// Draw the trace
path.rewind();
path.moveTo(0, 0);
if (xscale < 1.0) {
for (int i = 0; i < xstop - xstart; i += xstep) {
if (max < Math.abs(audio.data[i + xstart]))
max = Math.abs(audio.data[i + xstart]);
float x = (float) i * xscale;
float y = -(float) audio.data[i + xstart] / yscale;
path.lineTo(x, y);
Log.d("y values", "y = " + String.valueOf(y)); // KING
writeToFile("y = " + String.valueOf(y), getContext());
}
} else {
for (int i = 0; i < xstop - xstart; i++) {
if (max < Math.abs(audio.data[i + xstart]))
max = Math.abs(audio.data[i + xstart]);
float x = (float) i * xscale;
float y = -(float) audio.data[i + xstart] / yscale;
path.lineTo(x, y);
Log.d("y values", "y = " + String.valueOf(y)); // KING
writeToFile("y = " + String.valueOf(y), getContext());
// Draw points at max resolution
if (points) {
path.addRect(x - 2, y - 2, x + 2, y + 2, Path.Direction.CW);
path.moveTo(x, y);
Log.d("y values", "y = " + String.valueOf(y)); // KING
writeToFile("y = " + String.valueOf(y), getContext());
}
}
}
// Green trace
paint.setColor(Color.GREEN);
paint.setAntiAlias(true);
cb.drawPath(path, paint);
// Draw index
if (index > 0 && index < width) {
// Yellow index
paint.setColor(Color.YELLOW);
paint.setAntiAlias(false);
cb.drawLine(index, -height / 2, index, height / 2, paint);
paint.setAntiAlias(true);
paint.setTextSize(height / 48);
paint.setTextAlign(Paint.Align.LEFT);
// Get value
int i = Math.round(index / xscale);
if (i + xstart < audio.length) {
float y = -audio.data[i + xstart] / yscale;
// Draw value
String s = String.format(Locale.getDefault(), "%3.2f",
audio.data[i + xstart] / 32768.0);
cb.drawText(s, index, y, paint);
}
paint.setTextAlign(Paint.Align.CENTER);
// Draw time value
if (scale < 100.0) {
String s = String.format(Locale.getDefault(),
(scale < 1.0) ? "%3.3f" :
(scale < 10.0) ? "%3.2f" : "%3.1f",
(start + (index * scale)) /
MainActivity.SMALL_SCALE);
cb.drawText(s, index, height / 2, paint);
// Log.d("y values", "y = " + String.valueOf(y));
} else {
String s = String.format(Locale.getDefault(), "%3.3f",
(start + (index * scale)) /
MainActivity.LARGE_SCALE);
cb.drawText(s, index, height / 2, paint);
}
}
canvas.drawBitmap(bitmap, 0, 0, null);
}
private void writeToFile(String data, Context context) {
try {
OutputStreamWriter outputStreamWriter = new OutputStreamWriter(context.openFileOutput("Sinusoids.txt", Context.MODE_PRIVATE));
outputStreamWriter.write(data);
outputStreamWriter.close();
} catch (IOException e) {
Log.e("Exception", "File write failed: " + e.toString());
}
}
// On touch event
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
// Set the index from the touch dimension
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
index = x;
break;
case MotionEvent.ACTION_MOVE:
index = x;
break;
case MotionEvent.ACTION_UP:
index = x;
break;
}
return true;
}
}
Generate byte array from y-axis points. The array can then be converted to sound.

How to give interactions to a bar in a bar graph i.e. increase and decrease of height of each bar in android without using any library

I am able to plot bar graph using canvas and drawing rectangle in the view. But the onTouch interaction works for the whole view and hence I am not able to interact with each bar separately.I am not looking for using any library for plotting graphs. Any suggestions would be helpful. Thanks!
protected void onDraw(Canvas canvas) {
float border = 20;
float horstart = border * 2;
float height = getHeight();
float width = getWidth() - 1;
float max = getMax();
float min = getMin();
float diff = max - min;
float graphheight = height - (2 * border);
float graphwidth = width - (2 * border);
paint.setTextAlign(Align.LEFT);
int vers = verlabels.length - 1;
for (int i = 0; i < verlabels.length; i++) {
paint.setColor(Color.BLUE);
float y = ((graphheight / vers) * i) + border;
//canvas.drawLine(horstart, y, width, y, paint);
paint.setColor(Color.BLUE);
canvas.drawText(verlabels[i], 0, y, paint);
}
int hors = horlabels.length - 1;
for (int i = 0; i < horlabels.length; i++) {
paint.setColor(Color.BLUE);
float x = ((graphwidth / hors) * i) + horstart;
//canvas.drawLine(x, height - border, x, border, paint);
paint.setTextAlign(Align.CENTER);
if (i == horlabels.length - 1)
paint.setTextAlign(Align.RIGHT);
if (i == 0)
paint.setTextAlign(Align.LEFT);
paint.setColor(Color.BLUE);
canvas.drawText(horlabels[i], x, height - 4, paint);
}
paint.setTextAlign(Align.CENTER);
canvas.drawText(title, (graphwidth / 2) + horstart, border - 4, paint);
if (max != min) {
paint.setColor(Color.BLUE);
if (type == BAR) {
float datalength = values.length;
float colwidth = (graphwidth / hors);
for (int i = 0; i < values.length; i++) {
float val = values[i] - min;
float rat = val / diff;
float h = graphheight * rat;
canvas.drawRect((i * colwidth) + horstart, (border - h)
+ graphheight+curY, ((i * colwidth) + horstart)
+ (colwidth - 1), height - (border - 1), paint);
}
} else {
float datalength = values.length;
float colwidth = (width - (2 * border)) / datalength;
float halfcol = colwidth / 2;
float lasth = 0;
float h = 0;
for (int i = 0;i<values.length;i++)
canvas.drawLine(((i - 1) * colwidth) + (horstart + 1)
+ halfcol, (border - lasth) + graphheight+curY,
(i * colwidth) + (horstart + 1) + halfcol,
(border - h) + graphheight, paint);
lasth = h;
}
}
}
onTouch method for the view :
public boolean onTouch(View v, MotionEvent event)
{
boolean result=false;
switch (event.getAction())
{
case MotionEvent.ACTION_DOWN:
curX= (int)event.getX();
curY= (int)event.getY();
result=true;
break;
case MotionEvent.ACTION_MOVE:
curX= (int)event.getX();
curY= (int)event.getY();
result=true;
break;
case MotionEvent.ACTION_UP:
curX= (int)event.getX();
curY= (int)event.getY();
result=true;
break;
}
if (result) invalidate();
return result;
}

Whenever an user touches that view, it causes the onTouch method gets called. Once it's getting called, you're given two float numbers: x and y indicating where user's finger touches your view relative to the view coordination system.
As you might grasped the idea, you should get those numbers and internally in your custom view (i.e. bar chart) calculate which bar is affected. Then, you can for example apply a hover effect or do something else.
Note: For updating appearance of your view, you should store changes in data models of your chart view and then issue invalidate(). Subsequently, as a result, your onDraw is invoked and in which you can re-draw your chart. (i.e. You should each time, re-draw your whole chart again)

canvas.drawLine not visible

I am trying to draw the lines of a sudoku grid using drawLine() but each line gets progressively more faint, to the point they are not visible about half way down the screen. screenshot of emulator
canvas.drawLine(0, (i + 1) * tileHeight,getWidth(), (i + 1) * tileHeight, gridPaint ); //horizontal lines
I know they are there because for a brief second when the screen is rotated, the lines are displayed as expected but then they disappear again.
I've tried various things to fix this but i still have no idea whats causing this
private static final String TAG = "Soduku";
private final Game game; //game logic
private float tileWidth;
private float tileHeight;
private int selX; //x index of selection
private int selY; //y index of selection
private Rect selRect = new Rect();
private Paint gridPaint = new Paint();
public PuzzleView(Context context) {
super(context);
this.game = (Game)context;
setFocusable(true);
setFocusableInTouchMode(true);
gridPaint.setColor(getResources().getColor(R.color.black));
}
#Override
protected void onSizeChanged(int w, int h, int oldW, int oldH) {
tileWidth = w / 9f;
tileHeight = h / 9f;
getRect(selX, selY, selRect);
Log.d(TAG, "onSizeChaned: width " + tileWidth + ", height " + tileHeight);
super.onSizeChanged(w, h, oldW, oldH);
}
private void getRect(int x, int y, Rect rect) {
rect.set((int) (x * tileWidth), (int) (y * tileHeight), (int) (x * Math.pow((double) tileWidth, 2)),
(int) (y * Math.pow((double) tileHeight, 2)));
}
#Override
protected void onDraw(Canvas canvas) {
invalidate();
Log.d("onDraw", "tileHeight - " + ((Float) tileHeight).toString());
for(int i = 0; i < 9; i++) {
canvas.drawLine(0, (i + 1) * tileHeight,getWidth(), (i + 1) * tileHeight, gridPaint ); //horizontal lines
canvas.drawLine((i + 1) * tileWidth, 0, (i + 1) * tileWidth, getHeight(), gridPaint); //vertical lines
}
}
#Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
Log.d(TAG, "onKeyDown: keyCode " + keyCode + ", keyEvent " + event);
switch(keyCode) {
case KeyEvent.KEYCODE_DPAD_UP:
select(selX, selY - 1);
break;
case KeyEvent.KEYCODE_DPAD_DOWN:
select(selX, selY + 1);
break;
case KeyEvent.KEYCODE_DPAD_LEFT:
select(selX - 1, selY);
break;
case KeyEvent.KEYCODE_DPAD_RIGHT:
select(selX + 1, selY);
break;
case KeyEvent.KEYCODE_0:
case KeyEvent.KEYCODE_SPACE: setSelectedTile(0); break;
case KeyEvent.KEYCODE_1: setSelectedTile(1); break;
case KeyEvent.KEYCODE_2: setSelectedTile(2); break;
case KeyEvent.KEYCODE_3: setSelectedTile(3); break;
case KeyEvent.KEYCODE_4: setSelectedTile(4); break;
case KeyEvent.KEYCODE_5: setSelectedTile(5); break;
case KeyEvent.KEYCODE_6: setSelectedTile(6); break;
case KeyEvent.KEYCODE_7: setSelectedTile(7); break;
case KeyEvent.KEYCODE_8: setSelectedTile(8); break;
case KeyEvent.KEYCODE_9: setSelectedTile(9); break;
case KeyEvent.KEYCODE_ENTER:
case KeyEvent.KEYCODE_DPAD_CENTER:
game.showKeypadOrError(selX, selY);
break;
default:
return super.onKeyDown(keyCode, event);
}
return true;
}
//locate the selected square
private void select(int x, int y) {
invalidate(selRect);
selX = Math.min(Math.max(x,0), 8);
selY = Math.min(Math.max(y,0), 8);
getRect(selX, selY, selRect);
invalidate(selRect);
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if(event.getAction() != MotionEvent.ACTION_DOWN) {
return super.onTouchEvent(event);
}
select((int)(event.getX() / tileWidth), (int)(event.getY() / tileHeight));
game.showKeypadOrError(selX, selY);
Log.d(TAG, "onTouchEvent: x" + selX + ", y" + selY);
return true;
}
public void setSelectedTile(int tile) {
if(game.setTileIfValid(selX, selY, tile)) {
invalidate();
} else {
//number not valid for selected tile
Log.d(TAG, "setSelectedTile: invalid - " + tile);
startAnimation(AnimationUtils.loadAnimation(game, R.anim.shake));
}
}

How keep previous draw on same canvas?

I am able to draw a text on canvas on motion view now the problem is that when i draw text & go for the next draw on same canvas my draw text is getting disappear i mean screen is getting redraw because of invalidate i want keep my previous draw and make new draw on same canvas how am i going to do that ?
public class PuzzleView extends View {
private float width; // width of one tile
private float height; // height of one tile
private int selX; // X index of selection
private int selY; // Y index of selection
private final Rect selRect = new Rect();
private final Game game;
float positionX = 5;
float positionY = 15;
String strgettile = null;
float x, y;
Paint foreground = new Paint(Paint.ANTI_ALIAS_FLAG);
String getorientation;
public PuzzleView(Context context) {
super(context);
this.game = (Game) context;
setFocusable(true);
setFocusableInTouchMode(true);
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
width = w / 9f;
height = h / 9f;
// getRect(selX, selY, selRect);
Log.d(TAG, "onSizeChanged: width " + width + ", height " + height);
super.onSizeChanged(w, h, oldw, oldh);
}
#Override
protected void onDraw(Canvas canvas) {
//super.onDraw(canvas);
// canvas.save();
// Draw the background...
Paint background = new Paint();
background.setColor(getResources().getColor(R.color.puzzle_background));
canvas.drawRect(0, 0, getWidth(), getHeight(), background);
// Draw the board...
// Define colors for the grid lines
Paint dark = new Paint();
dark.setColor(getResources().getColor(R.color.puzzle_dark));
Paint hilite = new Paint();
hilite.setColor(getResources().getColor(R.color.puzzle_hilite));
Paint light = new Paint();
light.setColor(getResources().getColor(R.color.puzzle_light));
// Draw the minor grid lines
for (int i = 0; i < 9; i++) {
canvas.drawLine(0, i * height, getWidth(), i * height, light);
canvas.drawLine(0, i * height + 1, getWidth(), i * height + 1,
hilite);
canvas.drawLine(i * width, 0, i * width, getHeight(), light);
canvas.drawLine(i * width + 1, 0, i * width + 1, getHeight(),
hilite);
}
// Draw the major grid lines
for (int i = 0; i < 9; i++) {
if (i % 3 != 0)
continue;
canvas.drawLine(0, i * height, getWidth(), i * height, dark);
canvas.drawLine(0, i * height + 1, getWidth(), i * height + 1,
hilite);
canvas.drawLine(i * width, 0, i * width, getHeight(), dark);
canvas.drawLine(i * width + 1, 0, i * width + 1, getHeight(),
hilite);
}
// // Draw the numbers...
Paint hint = new Paint();
int m;
if (strgettile != null) {
for (m = 0; m < strgettile.length(); m++) {
System.out.println(strgettile.charAt(m));
char convertst = strgettile.charAt(m);
String characterToString = Character.toString(convertst);
if (getorientation.equalsIgnoreCase("Horizontal")) {
canvas.drawText(characterToString, m * width + positionX,
positionY, foreground); // for motion event
hint.setColor(Color.BLACK);
hint.setTextSize(45);
} else {
canvas.drawText(characterToString, positionX, m * height
+ positionY, foreground);
hint.setColor(Color.BLACK);
hint.setTextSize(45);
}
}
//invalidate();
}
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() != MotionEvent.ACTION_DOWN)
return super.onTouchEvent(event);
// select((int) (event.getX() / width), (int) (event.getY() /
// height));
game.showKeypadOrError(selX, selY);
foreground.setColor(getResources().getColor(R.color.puzzle_foreground));
foreground.setStyle(Style.FILL);
foreground.setTextSize(height * 0.75f);
foreground.setTextScaleX(width / height);
foreground.setTextAlign(Paint.Align.CENTER);
// // Draw the number in the center of the tile
FontMetrics fm = foreground.getFontMetrics();
// // Centering in X: use alignment (and X at midpoint)
// positionX = width / 2;
// // Centering in Y: measure ascent/descent first
// positionY = height / 2 - (fm.ascent + fm.descent) / 2;
positionX = (int) event.getX();
positionY = (int) event.getY() - (fm.ascent + fm.descent) / 2;
// Draw the numbers...
// Define color and style for numbers
// invalidate();
Log.d(TAG, "onTouchEvent: x " + selX + ", y " + selY);
return true;
}
public void setSelectedTile(String tile, String strorientations) {
// TODO Auto-generated method stub
Log.v("getting string in puzzle view ", tile);
strgettile = tile;
getorientation = strorientations;
invalidate();
}
}

Call invalidate() at the end of onDraw.
This function let the onDraw to get called again.

Image Edges Pixelated Depending on Position Android

I have a dial that I display wind direction in and the arrow displays well in some positions, but others its edges are pixelated. Here is the code to render the image:
public class DialView extends View {
private Context mContext;
private Bitmap mArrow;
private WeatherDataModel mWdm;
private float iters = 10.0f;
private static float previousAngle = 0.0f;
private int mHourIndex = 0;
private boolean isHourly = false;
private final int XLARGE = 0x4;
public DialView(Context context, AttributeSet attrs) {
super(context, attrs);
mContext = context;
int screenLayout = mContext.getApplicationContext().getResources().getConfiguration().screenLayout;
mArrow = Utilities.applyFilter(context, BitmapFactory.decodeResource(context.getResources(), R.drawable.wind_arrow));
}
#Override
public void onDraw(Canvas canvas) {
float degrees = 0.0f;
degrees = (!isHourly) ? cardinalToDegrees(mWdm) : cardinalToDegrees(mWdm.hourly.get(mHourIndex));
Bitmap bit;
int originY = getHeight() / 2;
int originX = getWidth() / 2;
int r = originY > originX ? getWidth() * 8 / 27 : getHeight() * 8 / 27;
int x, y;
Matrix matrix = new Matrix();
degrees = (previousAngle * (iters / 10.0f) + degrees * (10.0f - iters) / 10.0f);
//Log.d(DEBUG_TAG, "Previous angle = " + previousAngle + " degrees" + degrees);
matrix.postRotate(degrees - 90.f);
bit = Bitmap.createBitmap(mArrow, 0, 0, mArrow.getWidth(), mArrow.getHeight(), matrix, false);
x = (int)(Math.cos(Math.PI * degrees / 180.0f) * r) + originX - (bit.getWidth() / 2);
y = (int)(Math.sin(Math.PI * degrees / 180.0f) * r) + originY - (bit.getHeight() / 2);
//Log.d(DEBUG_TAG, "x: " + x + " y: " + y);
canvas.drawBitmap(bit, x, y, null);
if (iters > 0) {
invalidate();
iters--;
}
previousAngle = degrees;
}
Here is the arrow good:
Here it is pixelated:
Any ideas how to handle this?

try to define a paint object and enable AntiAlias
like this:
mPaint.setAntiAlias(true);
canvas.drawBitmap(bit, x, y, mPaint);