Uso de controles – TextView
Sirve para mostrar un fragmento de texto en la interfaz.
<TextView
android:id="@+id/text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tercera actividad" />Lenguaje del código: HTML, XML (xml)android:id Identificador único del control actual
android:layout_width Ancho
android:layout_height Alto
Todos los controles de Android tienen estos dos atributos, admite tres valores: match_parent、fill_parent、wrap_content
android:text Texto
Uno significa que depende del contenedor padre
Otro significa que depende del contenido
Por supuesto, además de estos tres, puedes establecer un tamaño fijo. Pero esto causará problemas de adaptación en pantallas distintas.
android:gravity=»center»
Alineación del texto: top bottom left right center
android:textSize=»24sp»
Tamaño de fuente
android:textColor=»#00ff00″
En Android se usa la unidad sp para definir el color de fuente.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Aquí solo se muestra texto"
android:gravity="center_vertical"
android:textSize="28sp"
android:textColor="#57d038"
/>
</LinearLayout>Lenguaje del código: HTML, XML (xml)
Uso de controles – Button
Control para interactuar con el usuario.
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Salir de la aplicación" />Lenguaje del código: HTML, XML (xml)Desactivar mayúsculas automáticas
android:textAllCaps = «false»
Agregar evento de escucha
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.textview_layout);
Button bt = (Button) findViewById(R.id.button);
bt.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View v){
//
}
});
}
}Lenguaje del código: JavaScript (javascript)Agregar escuchador de eventos implementando la interfaz
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.textview_layout);
Button bt = (Button)findViewById(R.id.button);
bt.setOnClickListener(this);// Registra el escuchador de eventos en el contexto actual
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
//Manejar evento de clic del botón
Toast.makeText(MainActivity.this,"foxdevelop.com",Toast.LENGTH_LONG).show();
break;
}
}
}Lenguaje del código: PHP (php)
Uso de controles – EditText
EditText permite al usuario introducir y editar texto, y podemos procesar ese contenido en el programa.
Muy utilizado
Se usa en apps como WeChat, mensajes de texto, QQ chat y muchas más.
<EditText
android:id="@+id/edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content" />Lenguaje del código: HTML, XML (xml)Texto de ayuda en el campo de edición
Agregar el atributo
android:hint=»Escribe tu nombre»
Cuando el texto es muy largo
Podemos configurar
El número máximo de líneas
android:maxLines=»2″
<EditText
android:id="@+id/edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Escribe tu nombre"
android:maxLines="2"
/>Lenguaje del código: HTML, XML (xml)Prueba: pulsa el botón para mostrar el contenido del cuadro de texto
//Obtener el contenido del cuadro de texto
EditText et = (EditText)findViewById(R.id.edit_text);
String input = et.getText().toString();
Toast.makeText(NormalActivity.this,input,Toast.LENGTH_LONG).show();Lenguaje del código: JavaScript (javascript)
Uso de controles – ImageView
Control para mostrar imágenes en la interfaz.
Tenemos que preparar imágenes
Normalmente se guardan en carpetas que empiezan por drawable
Creamos la carpeta drawable-xhdpi dentro de res y añadimos dos imágenes img1.png img2.png
Agregamos ImageView y asignamos la imagen
<ImageView
android:id="@+id/imageview1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/img1"
/>Lenguaje del código: HTML, XML (xml)Cambiar imagen al pulsar el botón
//Cambiar imagen al pulsar botón
ImageView iv = (ImageView) findViewById(R.id.imageview1);
iv.setImageResource(R.drawable.img2);Lenguaje del código: JavaScript (javascript)Uso de controles – ProgressBar
Muestra una barra de progreso en pantalla
Indica que la app está cargando datos
Su uso es muy sencillo
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />Lenguaje del código: HTML, XML (xml)Todos los controles tienen este atributo
Atributo visibility con tres valores:
visible Visible, valor por defecto
invisible No visible, pero mantiene su tamaño y posición (como si fuera transparente)
gone No visible y no ocupa espacio en pantalla
Lo modificamos con setVisibility
View.VISIBLE
View.INVISIBLE
View.GONE
Mostrar y ocultar barra de progreso pulsando el botón
//Alternar visibilidad de la barra de progreso al pulsar
ProgressBar pb = (ProgressBar) findViewById(R.id.progress_bar);
if (pb.getVisibility()==View.GONE){
pb.setVisibility(View.VISIBLE);
}
else {
pb.setVisibility(View.GONE);
}Lenguaje del código: JavaScript (javascript)Cambiar el estilo de la barra de progreso
style=»?android:attr/progressBarStyleHorizontal»
android:max=»100″ Establece el valor máximo de la barra
Modificarla dinámicamente
//Modificar dinámicamente la barra de progreso
ProgressBar pb = (ProgressBar) findViewById(R.id.progress_bar);
pb.setProgress(pb.getProgress()+10);Lenguaje del código: JavaScript (javascript)
Uso de controles – AlertDialog
AlertDialog abre un cuadro de diálogo encima de la interfaz actual.
Este cuadro se muestra por encima de todos los elementos de pantalla.
Por eso se usa para mensajes importantes o advertencias.
Por ejemplo, advertencia antes de borrar contenido importante para evitar errores del usuario.
Al pulsar el botón
No necesitamos añadir este control en el archivo de layout.
Se crea completamente desde código Java
//Crear un cuadro de diálogo
AlertDialog.Builder ad = new AlertDialog.Builder(NormalActivity.this);
ad.setTitle("Título del diálogo");
ad.setMessage("Texto del aviso");
ad.setCancelable(false);
ad.setPositiveButton("Aceptar", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
//Acción al pulsar aceptar
Toast.makeText(NormalActivity.this,"Has pulsado aceptar", Toast.LENGTH_LONG).show();
}
});
ad.setNegativeButton("Cancelar", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
//Acción al pulsar cancelar
Toast.makeText(NormalActivity.this,"Has pulsado cancelar", Toast.LENGTH_LONG).show();
}
});
ad.show();Lenguaje del código: JavaScript (javascript)Uso de controles – ProgressDialog
ProgressDialog es parecido a AlertDialog, muestra un cuadro de diálogo sobre la interfaz.
La diferencia es que ProgressDialog incluye una barra de progreso.
Se usa normalmente para operaciones lentas, para que el usuario espere.
//Uso de ProgressDialog
ProgressDialog pd = new ProgressDialog(NormalActivity.this);
pd.setTitle("Título");
pd.setMessage("Contenido");
pd.setCancelable(true);
pd.show();Lenguaje del código: JavaScript (javascript)
Controles