2012-02-14 15 views
6

Estoy dibujando líneas de acuerdo con el método touchesMoved: y normalmente funciona bien. Pero cuando hago un acercamiento a la imagen y dibujo, las líneas dibujadas anteriormente se desplazan y se vuelven cada vez más borrosas, hasta desaparecer. He intentado usar UIPinchGestureRecognizer y simplemente aumentar el frame de myImageView (solo para eventos multitáctiles), pero el problema se produce en ambos sentidos. Aquí está el código para el dibujo:CGContextStrokePath no funciona al hacer zoom y dibujar imágenes

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event { 
NSArray *allTouches = [touches allObjects]; 
int count = [allTouches count]; 
if(count==1){//single touch case for drawing line 
    UITouch *touch = [touches anyObject]; 
    CGPoint currentPoint = [touch locationInView:myImageView]; 
    UIGraphicsBeginImageContext(myImageView.frame.size); 
    [drawImage.image drawInRect:CGRectMake(0, 0, myImageView.frame.size.width, myImageView.frame.size.height)]; 
    CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound); 
    CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 2.0); 
    CGContextBeginPath(UIGraphicsGetCurrentContext()); 
    CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y); 
    CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), currentPoint.x, currentPoint.y); 
    CGContextStrokePath(UIGraphicsGetCurrentContext()); 
    drawImage.image = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 
    lastPoint = currentPoint; 
} 
else{//multi touch case 
    // handle pinch/zoom 
    } 
} 

aquí es la imagen dibujada encima sin zoom:

enter image description here

Y esta es la imagen que representa el problema después de hacer zoom-in con la flecha roja que muestra el segmento de eso ya se dibujó antes de acercar (como se muestra en la imagen anterior). La imagen es borrosa y desplazado tanto:

enter image description here

También se puede notar que una parte de la línea trazada hacia el final no se ve afectado y el fenómeno se produce por las líneas trazadas en el tiempo. Creo que la razón para esto es que los atributos de tamaño de imagen se pierden cuando hago zoom in/out, lo que probablemente causa el desenfoque y el cambio, ¡pero no estoy seguro de eso!

EDIT - He cargado a short video para mostrar lo que está sucediendo. Es algo entretenido ...

EDITAR 2- Aquí está a sample single-view app centrándose en el problema.

+0

Creo que esto podría tener algo que ver con el contentMode de la vista que está dibujando. Pruebe UIViewContentModeRedraw? – kevboh

+0

Intenté configurarlo para 'myImageView' y' drawImage' (ambos son 'UIImageView's) pero no funcionó :(... – tipycalFlow

+0

@kevboh He subido un video (y lo agregué en la respuesta) que podría darte una mejor idea del problema ... – tipycalFlow

Respuesta

4

He descargado su proyecto y he encontrado que el problema es el reajuste automático. Los siguientes pasos resolverlo:

Paso 1. comentario a la línea 70:

drawImage.frame = CGRectMake(0, 0, labOrderImgView.frame.size.width, labOrderImgView.frame.size.height); 

en su método touchesMoved.

Paso 2. añadir una línea de código después drawImage es alloc ed (línea 90) en viewDidLoad método:

drawImage.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight; 

Entonces, el error se corrige.

+0

Absolutamente brillante ... gracias hombre! ¡Mereces más votos a favor! – tipycalFlow

1

que implementa el comportamiento de este tipo en forma próxima:

  1. usted debe recordar todas las coordenadas de la trayectoria (MODEL).
  2. Dibuje su camino en la subvista temporal de imageView.
  3. Cuando el usuario comienza a pellizcar/acercar su imagen, no haga nada, es decir, la ruta se escalará con iOS
  4. En el momento en que el usuario finalizó el acercamiento: vuelva a dibujar su ruta de forma correcta utilizando su modelo.

Si guarda la ruta como imagen, obtiene como resultado escalas de aspecto desagradable. Además - no dibuje el camino directo a la imagen - dibuje algunos vista transparente y divídalos juntos al final de la edición.

+0

Por cierto, consideré tu ejemplo de código, y le recomendaría que implemente la captura/guardado de la ruta por separado del dibujo. Esto puede ayudarlo a evitar muchos problemas. Patrón Model-View-Controller. – SVGreg

+0

En realidad, los malos resultados no se producen al hacer zoom. Dibujo ** después de hacer zoom para ver si ocurre esta rareza. Vea el video corto en la pregunta para obtener una mejor idea. – tipycalFlow

+0

Sí Vi video - es un efecto borroso - no dibuje el camino directo a la imagen - dibuje sobre algunos transparente vie w y dividirlos juntos al final de la edición. – SVGreg

1

Siempre está dibujando un contexto de imagen del tamaño de su vista de imagen; esto, por supuesto, se vuelve borroso, ya que no se adapta a una resolución mayor cuando se acercó. Sería más sensato crear una vez UIBezierPath y simplemente agregue una línea a él (con addLineToPoint:) en el método touchesMoved, luego dibuje en un método personalizado drawRect a través del [bezierPath stroke]. También podría simplemente agregar un CAShapeLayer como una subvista de la vista de imagen y establecer su propiedad path en la propiedad CGPath del bezierPath que creó anteriormente.

Vea Drawing bezier curves with my finger in iOS? para ver un ejemplo.

Cuestiones relacionadas