Muchas personas no saben como personalizar un Spinner. bueno aqui tienen su respuesta
Primero creamos el proyecto el cual pueden llamar como ustedes quieran yo lo llamare SpinnerPersonalizado
Ahora nos dirigimos a la sección de res -> layout y creamos un archivo xml que será la base grafica del nuevo spinner en este caso lo llamaremos “eslabón”
Le das en finalizar y listo ahora tendrán algo así.
En la parte derecha de la pantalla se encontraran con la orientación del layout cámbiela de vertical a horizontal para mayor organización, aunque cada uno es libre de crear su propio eslabón del spinner personalizado.
Ahora le agregamos un textview al cual llamare mensajetxt y un ImageView al cual llamaremos logoIM.
Nota: al seleccionar y arrastrar el ImageView le pedirá un icono por defecto si no han subido uno al proyecto escojan por defecto el logo de su aplicación como se utilizó en este ejemplo.
Le damos el tamaño al Linearlayout donde se encuentran insertados los componentes y listo terminamos la parte visual ahora vamos a la parte de código.
Primero generamos una clase a la cual llamaremos adaptadorSpinner y la extenderemos como base adapter además opcionalmente métanla en un paquete aparte el cual se va a nombrar adaptadores.
Implementamos los métodos no implementados como se ve en la pantalla.
Todos estos métodos son necesarios al momento en que Dalvik actualice o arme el Spinner.
Listo ahora tenemos el adaptador. Para mayor sencillez crearemos una clase la cual llamaremos fila esta clase tendrá internamente 1 numero entro al cual llamaremos opciónIcono y 1 String al cual llamaremos mensaje.
Para nuestras aplicaciones utilizaremos una clase personalizada y elementos personalizados así que continuemos.
Aquí les muestro el código del adaptador junto con una explicación abajo del código
Codigo
package adaptadores;
import java.util.ArrayList;
import com.example.spinnerpersonalizado.R;
import android.annotation.SuppressLint;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
public class AdaptadorSpinner extends BaseAdapter {
private LayoutInflater inflater = null;
private ArrayList<Fila> Filas;
public AdaptadorSpinner(Context c) {
super();
Filas=new ArrayList<Fila>();
inflater = LayoutInflater.from(c);
}
public void addFilas(Fila objeto)
{
Filas.add(objeto);
notifyDataSetChanged();
}
public void removeFilas(int index)
{
Filas.remove(index);
notifyDataSetChanged();
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return Filas.size();
}
@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return Filas.get(position);
}
@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return 0;
}
@SuppressLint(“InflateParams”)
@Override
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
Componentes componentesAdaptador;
//si no existe el index lo crea y si existe lo carga
if(convertView==null)
{
//le asigna la interfax xml de al codigo
convertView = inflater.inflate(R.layout.eslabon, null);
componentesAdaptador=new Componentes();
//asigna los componenetes del xml
componentesAdaptador.LogoIM=(ImageView) convertView.findViewById(R.id.logoIM);
componentesAdaptador.Mensajetxt=(TextView) convertView.findViewById(R.id.mensajetxt);
convertView.setTag(componentesAdaptador);
}
else
{
componentesAdaptador = (Componentes) convertView.getTag();
}
//seccion de carga del contenido aqui es donde ustedes personalizan el Spinner
// si es par coloca un logo si es impar coloca el otro logo
if((Filas.get(position).getOpciónIcono())==0)
{
componentesAdaptador.LogoIM.setImageResource( R.drawable.ic_launcher);
}
else
{
componentesAdaptador.LogoIM.setImageResource( R.drawable.android_logo);
}
componentesAdaptador.Mensajetxt.setText(Filas.get(position).getMensaje());
return convertView;
}
public ArrayList<Fila> getFilas() {
return Filas;
}
public void setFilas(ArrayList<Fila> filas) {
Filas = filas;
}
static class Componentes{
ImageView LogoIM;
TextView Mensajetxt;
}
}
Dentro de la clase AdaptadorSpinner creamos un ArrayList de la clase Fila los cuales tendrán la información del Spinner.
En la sección de carga de contenido simplemente es pasar los valores del objeto fila al adaptador teniendo encuentra que la función brinda la posición del mismo al momento de armar el spinner.
notifyDataSetChanged(); es una función que actualiza el spinner en este caso lo actualiza cada vez que ingresas un valor el spinner.
La clase componentes se hace con la intensión de organizar todos los componentes y no tener que crear más componentes o tenerlos desorganizados.
Ahora solo agregamos s el código de la actividad principal que es simple además de agregarle 4 valores al Spinner.
Código
package com.example.spinnerpersonalizado;
import adaptadores.AdaptadorSpinner;
import adaptadores.Fila;
import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Spinner;
public class MainActivity extends Activity {
private AdaptadorSpinner adaptadorPersonalizado;
private Spinner SpinnerPersonalizado;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//inicializar el Spinner
SpinnerPersonalizado=(Spinner) findViewById(R.id.spinnerpersonalizado);
//codigo de inicio del spinner
adaptadorPersonalizado=new AdaptadorSpinner(this);
//incluir el adaptador al spinner
SpinnerPersonalizado.setAdapter(adaptadorPersonalizado);
//agregandole informacion al spinner
adaptadorPersonalizado.addFilas(new Fila(0, “opccion 1”));
adaptadorPersonalizado.addFilas(new Fila(1, “opccion 2”));
adaptadorPersonalizado.addFilas(new Fila(1, “opccion 3”));
adaptadorPersonalizado.addFilas(new Fila(1, “opccion 4”));
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
Aquí está el resultado.
Aqui esta el codigo servidor Mega
Hasta aqui los dejo cuidence.
No hay comentarios:
Publicar un comentario