2012-07-07 14 views
9

Busco a replicar lo siguiente dentro de mi solicitud:una vista de texto en Android

enter image description here

Como se puede ver, es básicamente un botón que aumenta/disminuye el valor de la vista de texto contenida dentro de ella. Este botón tendrá tres estados visuales -> sin presionar, disminuir y aumentar (como se ve en la imagen de arriba, el usuario toca las flechas de aumento y el botón aparece presionado en ese lado)

Aquí están mis 3 estados de botón actualmente:

enter image description here enter image description here enter image description here

Como se puede ver, el problema que tengo es ser capaz de inclinar correctamente/girar la vista de texto para que se vea visualmente correcta y aparezca inclinado junto con el botón cuando un posible incremento o disminuido

He intentado dos enfoques diferentes hasta ahora:

  • crear una clase de vista de texto costumbre que reemplaza el método onDraw() para sesgar el lienzo:

    @Override 
    public void onDraw(Canvas canvas) { 
        canvas.save(); 
    
        canvas.skew(0.2f, 0f); 
    
        super.onDraw(canvas); 
        canvas.restore(); 
    } 
    
  • integrar el Rotate3dAnimation clase (fuente here) y usó muchas variaciones diferentes para obtener el resultado deseado, tales como:

    Rotate3dAnimation skew = new Rotate3dAnimation(
          30, 0, centerX, centerY, 0, false); 
        txtAmount.startAnimation(skew); 
    

Por desgracia, no estoy bastante conseguir el resultado exacto que refleje la primera imagen de arriba. Me estoy confundiendo con la configuración de valores con el eje Z, sesgar, rotar, etc.

Agradecería cualquier ayuda de cualquier persona que tenga experiencia con estas cosas. Gracias de antemano

Respuesta

7

Bueno, yo incluso trató y me encontré con algo como esto:

public class DemoActivity extends TextView { 
    Context context; 
    String firstText = "$120.00"; 

public DemoActivity(Context context) 
    { 
    super(context); 
    this.context = context; 

    } 


    @Override 
    protected void onDraw(Canvas canvas) { 
    super.onDraw(canvas); 
    setText(firstText); 
    setTextSize(30); 
    canvas.skew(1.0f, 0.3f); //you need to change values over here 
    Rotate3dAnimation skew = new Rotate3dAnimation(
       -20, 30,200, 200, 0, false); //here too 
    startAnimation(skew); 

     } 
    } 

Tengo una salida como:

enter image description here

supongo que cambiar los valores por ensayo y error puede resolver su problema. Espero que ayude.

+0

Hola Parth, gracias por su respuesta. Al combinar los dos enfoques y, como dijiste, cambiando ligeramente los valores, estoy contento con el resultado final. Supongo que eventualmente llegaría allí, pero tu respuesta se aceleró :) – elgoog

+2

¿Por qué una Actividad extiende un TextView? Seguramente eso es confuso ... –

+1

es solo una mala elección de nombre @JamesGoodwin pero funciona genial! – Mars

0

Gracias a Parth Doshi respuesta. Su respuesta necesita un pequeño ajuste para ejecutar, que estoy compartiendo aquí para salvarle el tiempo a alguien más.

Primero cree una clase en la carpeta src y escriba los tres constructores.

public class TextViewDemo extends TextView { 

Context context; 
String text = "TESTING 3DX TOOLS"; 

public TextViewDemo(Context context) { 
    super(context); 
    this.context = context; 
} 

public TextViewDemo(Context context, AttributeSet attrs) { 
    super(context, attrs); 
    this.context = context; 
} 

public TextViewDemo(Context context, AttributeSet attrs, int defStyle) { 
    super(context, attrs, defStyle); 
    this.context = context; 
} 

@Override 
protected void onDraw(Canvas canvas) { 
    // TODO Auto-generated method stub 
    super.onDraw(canvas); 
    setText(text); 
    setTextSize(30); 
    canvas.skew(0.5f, 1.0f); // you need to change values over here 
    Rotate3dAnimation skew = new Rotate3dAnimation(-50, 30, 0, 0, 0, 
      false); // here too 
    startAnimation(skew); 

} 

}

En que res/layout/my_layout.xml archivo que puede agregar una etiqueta de su encargo TextView.

<com.yourpackage.name.TextViewDemo 
    android:id="@+id/name" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerHorizontal="true" 
    android:text="Hello World" 
<!-- All parameters and value shall remain same --> 
/> 

Al igual que cualquier otro punto de vista, se puede crear una instancia de TextViewDemo en su método onCreate()

TextViewDemo txtDemo = (TextViewDemo) findViewById(R.id.name); 

Saludos

Cuestiones relacionadas