Como hacer un splash screen en android studio

Hola a todos hoy veremos un tutorial de como hacer un SPLASH SCREEN en android personalmente a mi me gusta este tipo de artículos, porque de alguna forma te enseñan a mejorar la estética de tu producto final, hay un dicho entre programadores,  “los que programan diseñan mal” y eso no es cierto si bien es verdad que en países avanzados existe un sujeto para cada trabajo, en Latinoamerica una sola persona es analista,diseñadora,programador, marketero etc de cosas y si bien es cierto esto genera muchas veces que las cosas se hagan a medias un programador que desarrolle mas de una actitud siempre hará bien su trabajo, con esto te digo que no debes hacer 20 cosas tu mismo porque nunca seras bueno en todo pero al menos puedes programar y hacer interfaces amigables para tus usuario.
 

Como hacer un splash screen en android studio

como crear un Splash Screen

 
 
Que es un Splash Screen?
No vamos hacer técnicos en la definición, Te has dado cuenta que cuando descargas alguna aplicación  y le das en ejecutar y carga hermosas entradas antes de ejecutarse “eso es un Splash Screen” te dejo algunos ejemplos en las siguientes imágenes:
Bien sin mas rodeos empezamos, hay muchas formas de hacerla pero en este tuto amantes delas frutas y los fragment, lo haremos con fragment 🙂
utilizaremos 3 layouts y 3 clases y para hacer los efectos del Splash Screen 2 layout en la carpeta animator.
 

activity_main.xml

 

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/contenedor"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

</FrameLayout>

MainActivity.java

public class MainActivity extends FragmentActivity {

    private static final long SPLASH_SCREEN_DELAY = 3000;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


        if (savedInstanceState == null) {
            getFragmentManager().beginTransaction()
                    .add(R.id.contenedor, new SplashScreenFragment()).commit();
        }

        TimerTask task = new TimerTask() {
            @Override
            public void run() {
                getFragmentManager()
                        .beginTransaction()
                        .setCustomAnimations(R.animator.voltear_izquierda,
                         R.animator.salir_a_la_izquierda)
                        .replace(R.id.contenedor, new MainFragment()).commit();
            }
        };
        // Simulate a long loading process on application startup.
        Timer timer = new Timer();
        timer.schedule(task, SPLASH_SCREEN_DELAY);
    }

}

fragment_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Bienvenidos!!"
        android:textSize="60sp" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@drawable/logo1"
        android:layout_marginTop="110dp"
        android:id="@+id/imageView3"
        android:layout_below="@+id/textView"
        android:layout_centerHorizontal="true" />

</RelativeLayout>
MainFragment.java
public class MainFragment extends Fragment {

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
               Bundle savedInstanceState) {
    return inflater.inflate(R.layout.fragment_main, container, false);
  }

}

fragment_splash_screen

<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=".SplashScreenFragment" >

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@string/app_name"
        android:scaleType="fitXY"
        android:src="@drawable/cereza1" />

</RelativeLayout>

 

SplashScreenFragment.java

public class SplashScreenFragment extends Fragment {

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
							 Bundle savedInstanceState) {
		return inflater.inflate(R.layout.fragment_splash_screen, container,
				false);
	}

}

 

Bien ahora debemos crear la carpeta animator dentro de la carpeta res no puede ser otro nombre o no lo reconocerá android studio.
Dentro de nuestra carpeta animator crearemos dos layout y serán los siguientes:

salir_a_la_izquierda_xml

<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <!-- Rotate. -->
    <objectAnimator
        android:duration="10"
        android:interpolator="@android:interpolator/accelerate_decelerate"
        android:propertyName="rotationY"
        android:valueFrom="0"
        android:valueTo="180" />

    <!-- Half-way through the rotation (see startOffset), set the alpha to 0. -->
    <objectAnimator
        android:duration="1"
        android:propertyName="alpha"
        android:startOffset="10"
        android:valueFrom="1.0"
        android:valueTo="0.0" />

</set>

 

voltear_a_la_izquierda.xml

<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <!-- Before rotating, immediately set the alpha to 0. -->
    <objectAnimator
        android:duration="0"
        android:propertyName="alpha"
        android:valueFrom="1.0"
        android:valueTo="0.0" />

    <!-- Rotate. -->
    <objectAnimator
        android:duration="100"
        android:propertyName="rotationY"
        android:valueFrom="-180"
        android:valueTo="0" />

    <!-- Half-way through the rotation (see startOffset), set the alpha to 1. -->
    <objectAnimator
        android:duration="1"
        android:propertyName="alpha"
        android:startOffset="10"
        android:valueFrom="0.0"
        android:valueTo="1.0" />

</set>

 

en la carpeta drawable debe ir la imagen de nuestro Splash Screen, les dejo la del ejemplo
Dentro de la carpeta values debemos agregar un archivo llamado color.xml y tendrá lo siguiente:

color.xml 

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
</resources>
También modificaremos nuestro archivo styles y debe quedar de la siguiente forma:

style.xml

 

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

</resources>
Y con eso hemos terminado este tutorial, espero les sirva y no se olviden de comentar cualquier duda.

Igual si piensas que hablo escribo en chino te dejo el ejercicio:

     
ENLACES DE INTERÉS:
0

Hola soy Alex Céspedes  fundador de ANDROFAST, programo algunas cosas por diversión, me gusta aprender cosas nuevas y estoy pendiente de todo lo que tenga que ver con tecnología. Este blog lo cree para todas las personas que tengan dificultades en la programación, para ser sincero nunca fui bueno y reprobé algunos cursos de programación, pero mis ganas de aprender pudieron más. SI YO PUEDO TU PUEDES ANIMO!

3 pensamientos sobre “Como hacer un splash screen en android studio

  1. Mario Hernández

    El splash_screen_fragment.xml y el SplashScreenFragment.java tienen el mismo contenido, por lo tanto no hay un ejemplo de lo que debería contener el archivo .java

    0
  2. Pingback: convertir coordenadas en un link luego mostrarlo en un webview - ANDROFAST

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

WhatsApp chat