Controles básicos de Eclipse

Creo que ya hay bastante información en Internet; sobre todo en forma de Tutoriales.Resultado de imagen para eclipse android logo

Hemos recopilado aquí las mejores paginas que encontramos, así como los libros y videos que nos han ayudado mucho en nuestro estudio basado en el entorno de desarrollo Eclipse.

Introducción a eclipse

Componentes de una aplicación Android

Botones En Android

Controles básicos (I)

Textos en Android

Controles básicos de texto

Resultado de imagen para eclipse android logo

Pero lo que màs nos ha sido de ayuda son dos libros:

Android: Programación de dispositivos móviles a través de ejemplos

El gran libro de Android




 




En este capítulo veremos los Controles Básicos de Android más sencillos y la manera de crearlos por medio de su fichero XML.

Botones

En Android hay Tres tipos de botones:

    • – Clásico (Button).
    • – De tipo on/off (ToggleButton).
    • – Botón tipo imagen (ImageButton).

BUTTON

<Button android:id="@+id/okButton"   
    android:layout_width="wrap_content"   
android:layout_height="wrap_content"
android:text="@string/ok"
android:textColor=”#00ff00”
android:textSize=”18sp”
android:background=”#ffffff”
/>

Comentar que al atributo “Android:background” le podemos asignar una imagen en lugar de un color:

Android:background=”@drawable/ok”

Button Reference

TOGGLEBUTTON

Tendremos dos posibles estados: ON y OFF.
El texto de estos estados lo podremos definir con las propiedades android:textOn y android:textOff .

<ToggleButton android:id="@+id/toggleButton1"   
android:layout_width="wrap_content"   
android:layout_height="wrap_content"
android:textOn="Estoy ON"   
android:textOff="Estoy OFF"   
/>

ToggleButton Reference

IMAGEBUTTON

Análogo al control Button pero en este caso obligatoriamente tendremos que indicar una imagen con el atributo Android:src.
Por otra parte, deberemos indicar también la descripción textual con el atributo Android:contentDescription. Esta descripción no se mostrará visualmente, pero la leerán los lectores de pantalla que usan las personas ciegas.

<ImageButton android:id="@+id/okImageButton"   
android:layout_width="wrap_content"   
android:layout_height="wrap_content"   
   android:src="@drawable/ok"
android:contentDescription="OK"
/>

ImageButton Reference

Imágenes

En Android utilizaremos el elemento ImageView para mostrar imágenes.

IMAGEVIEW

Aunque también se pueden aplicar a otros controles, en un control ImageView son especialmente interesantes las siguientes propiedades:

      • android:src: indica la imagen que se va a utilizar. Android:src=”@drawable/imagen”
      • android:maxWidth: indica la anchura máxima que puede tener la imagen. android:maxWith=”200dp”
      • android:maxHeight: indica la altura máxima que puede tener la imagen. Android:maxHeight=”100dp”
      • android:scaleType: indica cómo debe adapttarse la imagen al tamaño del control. android:scaleType=”fitCenter”
      • android:contentDescription: solamente si tiene sentido describir la imagen. Si es puramente decorativa no es recomendable utilizar este atributo. Al uso innecesario del atributo Android:contentDescription, Android lo llama “meter ruido en la aplicación”.

Nota: Android:maxWidth y Android:maxHeight se podrán utilizar siempre y cuando los valores de los atributos obligatorios Android:layout_width y Android:layout_height no sean “match_parent”. Es recomendable usarlos cuando estos dos últimos atributos tienen el valor “wrap_content”

<ImageView android:id="@+id/photoImageView"   
android:layout_width="wrap_content"   
android:layout_height="wrap_content"   
android:src="@drawable/icon"   
android:maxWidth=”200dp”
android:maxHeight=”200dp”
android:contentDescription="foto de ejemplo"
/>

ImageView Reference

Texto

A parte de imágenes, algo que querremos meter en nuestra aplicación será texto. Para ello en Android emplearemos el elemento TextView

TEXTVIEW

El control TextView es otro de los clásicos en la programación de GUIs, las etiquetas de texto, y se utiliza para mostrar un determinado texto al usuario..

Las propiedades que más sentido tienen para este control son las referentes al formato del texto y que vimos en la explicación del control Button.

      • android:textColor .
      • android:textSize.
      • android:typeface.
      • android:textStyle
<TextView android:id="@+id/titleTextView"   
android:layout_width="match_parent"   
android:layout_height="wrap_content"   
android:text=”Título”
android:textSize=”20sp”
android:textColor=”#ffffff”
android:typeface="monospace"
android:background=”#000000”
/>

TextView Reference

Eventos de Botones, Textos e Imágenes

El evento más común a los controles básicos anteriores y que nos interesará capturar casi siempre es el evento onClick, que se producirá cuando el usuario pulse con su dedo encima de uno de los controles.

Este evento y cualquier otro lo tendremos que capturar dentro de la clase java en la que estemos implementando la lógica de la interfaz de usuario de nuestra aplicación.

Podríamos rehacer el ejemplo aplicando el evento onClick a cualquier control básico ImageView, sobre el propio TextView, etc…

Public class MyActivity extends Activity
{
Private Button okButton;
Private TextView titleTextView;
 
@Override
    public void onCreate(savedInstanceState)
    {       
super.onCreate(savedInstanceState);
// Indicamos el fichero xml donde hemos definido la interfaz de estActivity //(eventos_controles_basicos.xml)
        setContentView(R.layout.eventos_controles_basicos);
//Creamos los objetos que deberán estar definidos en eventos_controles_basicos.xml
//utilizando su id
// Necesitamos hacer un casting al tipo de objeto que queremos recuperar porque el método
// findViewById devuelve un objeto genérico View.
 okButton = (Button) findViewById(R.id.okButton);
titleTextView = (TextView) findViewById(R.id.titleTextView);
// Aplicamos el evento onclick al objeto Button.
okButton.setOnClickListener(new View.OnClickListener()
{
public void onClick(View v)
        {
// Modificamos el texto de titleTextView cuando se pulsa sobre el botón OK.
titleTextView.setText("Botón OK Pulsado!");
}// end onClick.
});
}// end onCreate.
}// end class.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s