Canvas.drawLines que muestran segmentos inconexos

Question

Duplicar posibles:
Android How to draw a smooth line following your finger

Soy nuevo en Android y de programación Java y he estado jugando un poco con el desarrollo de aplicaciones móviles. Hace poco creé una vista que simplemente mantiene las líneas de trazo en el paso con los movimientos de los dedos del usuario. Sin embargo, he estado teniendo problemas con el método Canvas.drawLines.

En lugar de obtener un conjunto continuo de líneas entre todos los puntos que estoy recibiendo más de un patrón de puntos con pausas entre segmentos:

Aquí es un conjunto de muestras de datos y código simple para reproducir el emisión (datos de puntos fue tomada de una verdadera pasar el dedo):

public class SomeView extends android.view.View 
{ 
    private float[] _data = { 292.36545f, 104.37576f, 285.3567f, 112.39249f, 274.34293f, 113.39456f, 254.3179f, 115.39874f, 248.3104f, 116.40082f, 228.28535f, 118.405f, 214.26784f, 119.407104f, 211.26408f, 119.407104f, 204.25533f, 120.40918f, 202.25282f, 120.40918f, 201.25157f, 121.411255f, 199.24907f, 124.41754f, 197.24657f, 125.41962f, 196.24532f, 130.43005f, 195.24406f, 139.44885f, 197.24657f, 144.45929f }; 
    private Paint _paint; 

    public SomeView(Context c, AttributeSet attrs) 
    { 
     super(c, attrs); 
     _paint = new Paint(); 
     _paint.setColor(Color.BLUE); 
     _paint.setStrokeWidth(6); 
    } 

    @Override 
    public void onDraw(Canvas canvas) 
    {  
     canvas.drawLines(_data, _paint); 
    }   
} 

Después de graficar a cabo cada punto y la superposición de que encima de la línea I se dieron cuenta de que el problema es en realidad que no está siendo conectado cada punto , solo cada dos puntos En lugar de conectar el punto 1 al punto 2 al punto 3 y así sucesivamente, el método está conectando 1 a 2 y, a continuación 3 a 4 como se muestra a continuación:

I puede casi conseguir lo que quiero por dibujando llamando a drawLines de nuevo y proporcionando una compensación esta vez para que los otros pares se junten también, pero esto parece ineficaz y generalmente torpe para mí, y la línea aún no es completamente suave (se pone un poco picado en las esquinas).

Entonces, mi pregunta es; ¿Qué estoy haciendo mal y cómo puedo dibujar una línea simple y suave dada cierta cantidad de puntos? Diablos, olvídate de los puntos, si hay una mejor manera de rastrear el dedo del usuario con una línea, soy todo oídos. Gracias por adelantado.

Answer 1

Lo que obtienes es exactamente lo que se especifica en la documentación de drawLines.

Una forma de hacer lo que quiera sería construir un Path a partir de esos datos, y usar drawPath en lugar de drawLines. Algo así como:

Path _path = new Path(); 
_path.moveTo(_data[0], _data[1]); 
for (int i=2; i<_data.length; i+=2) { 
    _path.lineTo(_data[i], _data[i+1]); 
} 

Luego dibuja con:

_canvas.drawPath(_path, _paint) 

De los Path docs:

la ruta de clase encapsula compuesto (contorno múltiple) trayectorias geométricas que consisten en segmentos de línea recta, curvas cuadráticas y curvas cúbicas. Puede ser dibujado con canvas.drawPath (path, pintura), ya sea lleno o acarició (basado en el estilo de la pintura )

lo que podría tener que cambiar el estilo de usted No Eres pintura para obtener el derecho efecto.

Answer 2

Me encontré con este problema esta noche. Para cualquier otra persona que se enfrente a esto, el problema es que Android no dibuja del punto 1 al punto 2, luego del punto 2 al punto 3, del punto 3 al punto 4, etc. Dibujará el punto 1 a 2, luego el punto 3 a 4 , etc. Así que también puedes presionar el punto anterior dos veces en cualquier estructura de datos que uses (utilicé Vector). Por lo tanto:

private Vector<Float> mPoints = new Vector<Float>(); 
private float mLastX = Float.NaN; 
private float mLastY = Float.NaN; 

public void addPoint(float x, float y) { 
    if (mLastX == Float.NaN || mLastY == Float.NaN) { 
     mLastX = x; 
     mLastY = y; 
    } else { 
     mPoints.add(mLastX); 
     mPoints.add(mLastY); 
     mPoints.add(x); 
     mPoints.add(y); 

     mLastX = x; 
     mLastY = y; 
    } 
} 

A continuación, sólo asegúrese de convertir sus Mpuntos a un flotador [] y pasar a que canvas.drawLines().