2010-12-11 8 views
10

He estado aprendiendo Android durante aproximadamente dos semanas (experto en as2/3).Android - Girando un ImageView con el dedo mueve otras vistas alrededor de

He creado un simple LinearLayout1, which contains an ImageView`, que contiene un png de un disco de vinilo (sólo un disco circular básicamente)

He creado este ImageView a girar cuando el usuario arrastra un dedo en ella, al igual rascando un registro.

Mi código parece estar funcionando (no estoy seguro si es la mejor manera, pero funciona). El problema es cuando se gira el ImageView, empuja otras vistas. He determinado que esto se debe a que mi imagen redonda es realmente un cuadrado con esquinas transparentes. Son estas esquinas las que empujan a otras vistas y hacen que el registro se aleje del lado izquierdo de la pantalla si tengo justificado el ImageView.

Hay algunos intentos para resolver esto en línea, pero ninguno de ellos parece ser todo lo que necesito y algunos están envueltos en ejemplos tan robustos que no puedo discernir qué sacar de él en mi nivel inicial.

Si alguien puede arrojar algo de luz sobre lo que puedo hacer, resuelva esto que sería genial. Me doy cuenta de que una respuesta simple puede no existir, pero tenga en cuenta que soy un novato de Java y lo mantengo lo más simple posible. Muchas gracias de antemano por cualquier ayuda!

también si alguien puede decirme por qué tengo que restar 50 de la rotación para hacer que el registro se mueva en el lugar exacto que toca el usuario, ¡eso sería útil también! mira esto en el método updateRotation().

Aquí es mi xml marcado:

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/baseView" 
    android:background="#FFFFFFFF" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 

    <ImageView 
     android:id="@+id/turntable" 
     android:src="@drawable/turntable" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_weight="1"/> 

</LinearLayout> 

y aquí está mi código java:

package com.codingfiend.android.turntable; 

import android.app.Activity; 
import android.graphics.Bitmap; 
import android.graphics.BitmapFactory; 
import android.graphics.Canvas; 
import android.graphics.Matrix; 
import android.os.Bundle; 
import android.view.MotionEvent; 
import android.view.View; 
import android.view.Window; 
import android.widget.ImageView; 
import android.widget.TextView; 

public class Turntable extends Activity 
{ 
    View baseView; 
    ImageView turntable; 
    TextView bottomText; 

    @Override 
    public void onCreate(Bundle savedInstanceState) 
    { 
     super.onCreate(savedInstanceState); 
     requestWindowFeature(Window.FEATURE_NO_TITLE); 
     setContentView(R.layout.main); 

     baseView = (View)findViewById(R.id.baseView); 
     turntable = (ImageView)findViewById(R.id.turntable); 

     turntable.setOnTouchListener(onTableTouched); 
    } 

    public android.view.View.OnTouchListener onTableTouched = new android.view.View.OnTouchListener() 
    { 
     public boolean onTouch(View v, MotionEvent evt) 
     { 
      double r = Math.atan2(evt.getX() - turntable.getWidth()/2, turntable.getHeight()/2 - evt.getY()); 
      int rotation = (int) Math.toDegrees(r); 


      if (evt.getAction() == MotionEvent.ACTION_DOWN) 
      { 
       // 
      } 

      if (evt.getAction() == MotionEvent.ACTION_MOVE) 
      { 
       updateRotation(rotation); 
      } 

      if (evt.getAction() == MotionEvent.ACTION_UP) 
      { 
       // 
      } 

      return true; 
     } 
    }; 

    private void updateRotation(double rot) 
    { 
     float newRot = new Float(rot); 

     Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.turntable); 

     Matrix matrix = new Matrix(); 
     matrix.postRotate(newRot - 50); 

     Bitmap redrawnBitmap = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(), bitmap.getHeight(), matrix, true); 
     turntable.setImageBitmap(redrawnBitmap); 
    } 
} 

EDITAR

Esto está resultando ser un problema irritante. Tiene que haber una manera de rotar una imagen que sea tan grande o más grande que la pantalla sin que se escale para que toda la imagen permanezca en la pantalla. ¿Por qué una parte de la imagen giratoria no puede salir de la pantalla? Muy frustrante. Traté de envolver el ImageView en un FrameView, lo que ayudó parcialmente. Ahora puedo agregar otras vistas que no se verán afectadas, pero todavía no puedo tener mi disco lo suficientemente grande porque no está permitido pasar los bordes de la pantalla cuando gira. No entiendo por qué. No he revisado extendiendo ImageView todavía. Cualquier otro pensamiento aún sería apreciado!

+1

+1 Pregunta bien hecha. Bienvenido a SO. – wheaties

Respuesta

3

En realidad eso se debe a que intenta rotar una vista en un diseño lineal. Y esto causará que su espacio dedicado se expanda o reduzca.

Idea 1: intente utilizar un diseño de marco y su vista gire dentro Idea 2: pruebe una subclase de vista personalizada y dibuje su plato en el onDraw. En Internet, busque un ejemplo de dibujo de brújula para comenzar.

+0

Gracias, voy a intentar su sugerencia ahora. Vuelve pronto con los resultados. – Ribs

+1

El uso de un diseño de fotograma ha solucionado parte del problema, ya que ahora puedo agregar otras vistas que no se verán afectadas por la rotación de ImageView, pero si tengo el ImageView giratorio en el borde de la pantalla o es tan ancho como la pantalla , la imagen sigue siendo empujada por sus esquinas al girar. – Ribs

+0

Utiliza una combinación de diseño de marco y una clase de vista personalizada con onDraw() anulado. Todavía hay algunos comportamientos inesperados, pero creo que ahora no está relacionado con la pregunta. – Ribs

0

arreglar su imageview por

imageview.setScaleType(ScaleType.CENTER);

0

simple y clara, simplemente dibujar un círculo lienzo y añadir su imagen para la imagen de lona canvas.The no tendrá esquinas. Además, use FrameLayout para colocar una imagen encima de la otra, esto resolverá su problema

Cuestiones relacionadas