Android Multilanguage Example
Hola amigos en esta ocasión les mostrare como crear una aplicación multilanguage en Android
ya que Android cuenta con soporte para muchos lenguajes del mundo.
 |
| Como crear una aplicación Multilanguage en Android |
Como crear un proyecto en Android (Aquí)
Vamos a crear un proyecto en Android para poder desarrollar nuestra aplicación.
Y aprender como podemos hacer que nuestra aplicación sea multilanguage.
 |
| Como crear un proyecto en Android |
Diseño de nuestra aplicación Multilanguage
Comenzaremos creando el diseño de nuestra aplicación la cual añadiremos varios controles
para tener una idea de como se podran cambiar el idioma de nuestra aplicación segun lo seleccionemos.
Vamos agregar en la carpeta Menu en el archivo main.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/eng"
android:title="@string/languaje_1"
app:showAsAction="never" />
<item
android:id="@+id/es"
android:title="@string/languaje_2"
app:showAsAction="never" />
</menu>
 |
| Diseño de nuestro layout de cambio de idioma |
Ahora en la carpeta Layout agregaremos un archivo al que llamaremos toolbarlanguage.xml y tendra los siguientes elementos
<merge xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#024C5A" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/app_name"
android:gravity="center"
android:layout_centerInParent="true"
android:textStyle="bold"
android:textSize="20dp"
android:layout_alignParentLeft="true"
android:textColor="#FFF"
android:id="@+id/toolbar_title" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</merge>
 |
| Diseño de nuestro toolbar de nuestra aplicación Multilanguage |
Y por ultimo en nuestro archivo activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
layout="@layout/toolbarlanguaje"
android:id="@+id/toolbartop"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/textView1"
android:layout_below="@id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:padding="10dp"
android:gravity="center"
android:text="@string/translate_1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/txtModulo"
android:layout_margin="10dp"
android:padding="10dp"
android:gravity="center"
android:layout_below="@+id/textView1"
android:text="@string/translate_3"/>
<Spinner
android:id="@+id/spnModulo"
android:layout_margin="10dp"
android:padding="20dp"
android:gravity="center"
android:entries="@array/translate_spinner"
android:spinnerMode="dialog"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/txtModulo" />
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:padding="20dp"
android:gravity="center"
android:layout_alignParentBottom="true"
android:text="@string/translate_2" />
</RelativeLayout>
</android.support.constraint.ConstraintLayout>
 |
| Diseño de nuestro actividad principal |
Agregaremos el archivo multilenguage en nuestra carpeta de values en el archivo strings.xml le daremos click derecho
y nos mostrara Open Translation Editor en el siguiente boton buscaremos English in United States
En el archivo por defecto le pondremos lo siguiente.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">Multi-lenguaje Android</string>
<string name="translate_1">Hola mundo!</string>
<string name="translate_2">Aceptar</string>
<string name="translate_3">Seleccione</string>
<string name="languaje_1">Español</string>
<string name="languaje_2">English</string>
<array name="translate_spinner">
<item>Agregar</item>
<item>Editar</item>
<item>Eliminar</item>
</array>
</resources>
En el archivo de English agregaremos la traducción de nuestros string.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">Multi-language Android</string>
<string name="languaje_2">English</string>
<string name="languaje_1">Spanish</string>
<string name="translate_3">Select</string>
<string name="translate_2">Accept</string>
<string name="translate_1">Hello World!</string>
<array name="translate_spinner">
<item>Add</item>
<item>Edit</item>
<item>Delete</item>
</array>
</resources>
Ahora en el archivo styles.xml nos tendria que quedar lo siguiente forma.
<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>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
</resources>
Código de Multilanguage en Android
Ahora vamos a añadir el código para nuestra aplicación brevemente explicado.
import android.content.res.Configuration;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.AdapterView;
import android.widget.Button;
import android.widget.Spinner;
import android.widget.Toast;
import java.util.Locale;
public class MainActivity extends AppCompatActivity implements AdapterView.OnItemSelectedListener {
// Declaración de variables
Spinner spnModulo;
String[] strMessages;
Button btn;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initialize();
}
// Inicializar controles en la Actividad
public void initialize(){
Toolbar mTopToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mTopToolbar);
spnModulo = (Spinner) findViewById(R.id.nModulo);
spnModulo.setOnItemSelectedListener(this);
strMessages = getResources().getStringArray(R.array.translate_spinner);
btn = (Button)findViewById(R.id.button);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main, menu);
return super.onCreateOptionsMenu(menu);
}
// Elemento seleccionado en el Spinner
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
Toast.makeText(getApplicationContext(),strMessages[position] , Toast.LENGTH_LONG).show();
}
@Override
public void onNothingSelected(AdapterView<?> parent) {
}
// Funcion de Lenguaje
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Verificar si el idioma es Ingles o Español
Configuration config = new Configuration(getResources().getConfiguration());
switch (item.getItemId()){
case R.id.eng:
// Cambiar idioma Ingles
config.locale = Locale.ENGLISH;
getBaseContext().getResources().updateConfiguration(config,
getBaseContext().getResources().getDisplayMetrics());
// Reinicializar los controles
this.setContentView(R.layout.activity_main);
initialize();
break;
case R.id.es:
// Cambiar idioma Español
config.locale = Locale.getDefault();
getBaseContext().getResources().updateConfiguration(config,
getBaseContext().getResources().getDisplayMetrics());
// Reinicializar los controles
this.setContentView(R.layout.activity_main);
initialize();
break;
default:
break;
}
return super.onOptionsItemSelected(item);
}
}
Como crear un emulador AVD en Android (Aquí)
Vamos a crear un emulador AVD para ver nuestra aplicación en ejecución y hacer las pruebas del cambio de idioma.
 |
| Aplicación ejecuta en nuestro emulador AVD |
 |
| Cambio de idioma en nuestra aplicación Multilanguage |
No hay comentarios:
Publicar un comentario