Para hacer que la aplicación de Android sea más atractiva, agregamos muchas cosas y la animación es una de las mejores cosas que hace que la aplicación sea más atractiva e involucra al usuario con la aplicación. Entonces, en este artículo, agregaremos una animación de rebote al Botón . Se puede usar este tutorial para agregar animación de rebote a cualquier vista en el estudio de Android, como ImageView , TextView , EditText , etc. qué
Pasos para crear una animación de rebote
Paso 1: Creación de un nuevo proyecto
Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . Tenga en cuenta que elija Java como lenguaje aunque vamos a implementar este proyecto en lenguaje Java.
Paso 2: Diseño de la interfaz de usuario
- Vaya a la aplicación -> res , haga clic con el botón derecho en la carpeta res y luego en Nuevo -> Directorio de recursos de Android y cree un directorio anim .
- Luego haga clic con el botón derecho en la carpeta anim , luego vaya a Nuevo -> Archivo de recursos de animación y cree un archivo bounce.xml .
- El archivo bounce.xml contiene la animación que se usa para animar el botón en el siguiente paso. El código completo para bounce.xml se proporciona a continuación.
bounce.xml
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" android:fillAfter="true" android:interpolator="@android:anim/bounce_interpolator"> <scale android:pivotX="50%" android:pivotY="50%" android:fromXScale="0.5" android:toXScale="1.0" android:fromYScale="0.5" android:toYScale="1.0" android:duration="500"/> </set>
- Ahora vaya a la aplicación -> res -> diseño -> archivo activity_main.xml y agregue un botón simple , que queremos animar. Aquí está el código para el archivo activity_main.xml .
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <!-- Button with Bounce Animation --> <Button android:id="@+id/button" android:layout_centerInParent="true" android:background="@color/colorPrimary" android:textColor="#ffffff" android:text="Let's Bounce" android:layout_width="200dp" android:layout_height="80dp"/> </RelativeLayout>
Paso 3: trabajar con el archivo MainActivity.java
- Abra la llamada MainActivity.java y dentro del método onCreate() obtenga la animación de la carpeta anim .
// cargando Animación desde
Animación final animation = AnimationUtils.loadAnimation(this,R.anim.bounce);
- Obtenga la referencia del botón que creamos en el archivo activity_main.xml
// obtener el botón del archivo activity_main.xml
Botón final button= findViewById(R.id.button);
- Crea un OnClickListener para el botón y startAnimation dentro de onClick() .
// clickListener para el botón
button.setOnClickListener(nueva Vista.OnClickListener() {
@Anular
public void onClick (Ver vista) {
// inicia la animacion
button.startAnimation(animación);
}
});
- El código completo para el archivo MainActivity.java se proporciona a continuación.
MainActivity.java
import android.os.Bundle; import android.view.View; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.Button; import androidx.appcompat.app.AppCompatActivity; public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // loading Animation from final Animation animation = AnimationUtils.loadAnimation(this, R.anim.bounce); // getting the Button from activity_main.xml file final Button button = findViewById(R.id.button); button.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { // start the animation button.startAnimation(animation); } }); } }
Salida: ejecutar en el emulador
Recursos:
- Descargar proyecto completo desde Github
- Descarga el archivo Apk
Publicación traducida automáticamente
Artículo escrito por onlyklohan y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA