Tabla dinámica con bordes

Gracias al proyecto de fin de carrera que estoy desarrollando (Cuando lo termine ya lo publicaré por aqui ;) ), me topé que en la SDK de Android no tiene implementado la posibilidad de mostrar los bordes de la tabla. Cosa muy utilizada desde luego, asi que me puse manos a la obra y recopilando información que saque  por medio del oráculo, implementé un método para que te devuelva un TableLayout pasándole como parámetros el groso del borde, el numero de fila y el de columnas, y el color del borde.

Tuve muchos problemas con el ancho de cada celda, y por ahora tiene un apaño muy raro... pero funciona, que es lo importante.

El truco está en que cada celda tiene dos contenedores, uno que tiene de fondo el color que pasamos por parámetro como color de borde, y tiene unos padding que es el parámetro del ancho del borde de la tabla. Dentro de este contenedor esta el contenedor del texto que tiene el truco de tener de fondo el mismo color que el fondo de la ventana principal, y el ancho de este contenedor es hasta los padding del  contenedor anterior, creando asi un efecto de bordes.

Es un truco que arregla los bordes, pero nos ayuda del paso mientras que Google implemente en la SDK algo para subsanarlo.

Aqui va la captura y el código (Descargar):




fichero main.xml






fichero .java

package com.olidroide;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.Gravity;
import android.view.Window;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TableLayout;
import android.widget.TableRow;
import android.widget.TextView;


public class TablasDinamicas extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //Eliminamos el titulo de la ventana
        requestWindowFeature(Window.FEATURE_NO_TITLE);
       
        setContentView(R.layout.main);
        
        
        LinearLayout ll = (LinearLayout) findViewById(R.id.linear);
        
        TextView titulo= new TextView(this);
        titulo.setText("Generador de tablas con borde");
        ll.addView(titulo);
        //Llamamos al metodo dibujarTabla (AnchoBorde, Filas, Columnas, colorBorde)
        TableLayout etiquetaTabla = dibujarTabla(1, 2, 2, "#0055AA");
        ll.addView(etiquetaTabla);
        
        
        
    }
    /*
     * Método dibujarTabla
     * Devuelve una TableLayout con borde
     * recibe:
     *  tamaño del borde - int
     *  numero de filas - int
     *  numero de columnas - int
     *  color en Hexadecimal #FFFFFF - String
     */
    public TableLayout dibujarTabla(int tamBorde, int numeroFilas, int numeroColumnas, String colorBorde){
     TableLayout tabla = new TableLayout(this);
     
     if(numeroFilas>0 && numeroColumnas>0){
      TableRow fila = new TableRow(this);
      
      
      int numeroCeldas = numeroFilas * numeroColumnas;
      
      /* Calculo el Ancho de la siguiente manera:
       * El ancho de la pantalla los divido entre el nº de columnas y le resto
       * el tamaño del borde que esta sumado al borde dividido entre el nº de columnas
       * (a causa del borde derecho de la ultima columna)
       */
      
      int ancho=(getWindowManager().getDefaultDisplay().getWidth()/numeroColumnas)-(tamBorde+(tamBorde/(numeroColumnas)));
      //No se porqué pero si le resto uno funciona...
      ancho--;
      
      System.out.println("Tamaño ventana: "+getWindowManager().getDefaultDisplay().getWidth()+
        " ancho:"+ancho);
      int contadorColumnas=0;
         int contadorFilas=0;
      
         for (int i = 0; i <= numeroCeldas; i++) {
          //Si Ya ha dibujado la cantidad de columnas
          if(contadorColumnas==numeroColumnas){
           tabla.addView(fila);
           fila = new TableRow(this);
           contadorColumnas=0;
           contadorFilas++;
           
          }
          
          //Definimos los bordes de la tabla
          RelativeLayout borde = new RelativeLayout(this);
          //Dibuja los de arriba y la izquierda siempre
          borde.setPadding(tamBorde,tamBorde,0,0);
          //Pero
          //Si ya es la ultima columna de la fila...
          if(contadorColumnas==numeroColumnas-1){
           //Dibuja los de arriba a la derecha e izquierda.
           borde.setPadding(tamBorde, tamBorde, tamBorde, 0);
          }
          //Si Es la ultima fila
          if(contadorFilas==numeroFilas-1){
           //Dibuja arriba, izquierda y abajo
           borde.setPadding(tamBorde,tamBorde,0,tamBorde);
           //Si ademas de ser la ultima fila es la ultima columna
           if(contadorColumnas==(numeroColumnas)-1){
            //Dibuja todos los lados
            borde.setPadding(tamBorde,tamBorde,tamBorde,tamBorde);
           }
          }
          //Color del borde.
          borde.setBackgroundColor(Color.parseColor(colorBorde));
          
          //Ahora el texto..
          TextView texto = new TextView(this);
                 
          texto.setText("Celda "+i+" Ejemplo Tabla con Bordes");

          texto.setWidth(ancho);
          texto.setGravity(Gravity.CLIP_HORIZONTAL);
          texto.setPadding(2, 2, 2, 2);
          //Importante el color, porque si no se verá de color del borde!!
          texto.setBackgroundColor(Color.BLACK);
          
          //Al borde le añadimos el texto
          borde.addView(texto);
          
          //Y a la fila el borde con el texto
          fila.addView(borde);
          contadorColumnas++;
    
   }
     }else{
            TextView error= new TextView(this);
            error.setText("Valores de columnas o filas deben ser mayor de 0");
            tabla.addView(error);
  }
     return tabla;
    }
}

TextView Dinámicos con Scroll

Mi primera entrada "real" trata sobre un problema que tuve a la hora de mostrar varios textos, varios TextView por pantalla, ya que cada uno aparecía seguido tras el anterior, y mi idea es que cada texto pudiera ponerlo en donde yo quisiera. En este caso, un texto que ocupe todo el ancho de la pantalla y cuando venga otro texto, aparezca debajo. Os dejo con el código:

Fichero xml:


  
    
 


fichero .java :

package com.olidroide;



import android.app.Activity;

import android.os.Bundle;

import android.view.ViewGroup.LayoutParams;

import android.widget.LinearLayout;

import android.widget.RelativeLayout;

import android.widget.TextView;



public class textoDinamico extends Activity {

    /** Called when the activity is first created. */

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        this.setContentView(R.layout.main);

        

        //Obtenemos el LinearLayout definido en la vista

        LinearLayout ll = (LinearLayout) findViewById(R.id.ll);

        

        //Realizamos 30 repeticiones   

    for (int i = 0; i < 30; i++) {

     //Creamos un nuevo TextView

        TextView tv = new TextView(this);

        //Como texto el número de iteración

        tv.setText("Nº"+i);

        

        /*Creamos una RelativeLayout:

         * Porque las posiciones de los hijos de RelativeLayout están relacionadas

         * con otros hijos o su padre.

         */

        RelativeLayout rl = new RelativeLayout(this);

            

        //Creamos un LayoutParams con los parámetros

        //Información para el hijo (TextView) del RelativeLayout

        RelativeLayout.LayoutParams parametros = new RelativeLayout.LayoutParams(

          //El Ancho, ajustado al contenido

          LayoutParams.WRAP_CONTENT,

          //El Alto, ajustado al contenido

          LayoutParams.WRAP_CONTENT);

        

        //Añadimos el parámetro de que la alinición sea hacia la izquierda

        //parametros.addRule(RelativeLayout.ALIGN_LEFT);

        //No es necesario para el ejemplo

        

        //Y se lo aplicamos a la TextView creada antes

        tv.setLayoutParams(parametros);

        

            

        //También podemos declararlo de la siguiente manera

        rl.setLayoutParams(new LayoutParams(

             //El ancho, ajustado al padre

             LayoutParams.FILL_PARENT,

             //El Alto, ajustado al contenido

             LayoutParams.WRAP_CONTENT)

             );

      

         

        //Añadimos el TextView a la RelativeLayout

        rl.addView(tv);

        

        //Y la RelativeLayout a la LinearLayout

        ll.addView(rl);

}

        

    }

}







Espero que os sirva de ayuda ;)

Un blog para qué?

Eso mismo digo yo! ¿Para qué?

No solamente es importante para qué hago un blog, si no el porqué. Llevo mucho tiempo leyendo blogs, descubriéndolos, borrándolos... pero todos ellos me sirvieron en algún momento de mi vida, para mi trabajo o para mi tiempo de ocio. Aprovechando todo lo que aprendí sobre como realizar un blog, me lanzo a escribir uno propio, del que me gustaría escribir mi día a día en lo que más entusiasmo e ilusión estoy poniendo hoy en día, programar en (o para) Android. No solamente hablaré de programación, ya que cualquier evento importante, curiosidad también será publicada desde mi punto de vista y no recociendo noticias que sucede en muchos blogs.

También el hecho de que me estoy preparando mi proyecto de fin de carrera para Android, influye en la decisión de dar soporte a la cada día mas numerosa comunidad de Android. No se me olvida que debo el favor a Google, por regalar un Nexus One a todos los asistentes de la Android Developer Lab, siendo promotor de ésta plataforma libre para móviles.

Basaré las entradas de este blog en Software libre, por lo que también quiero dar soporte a otra gran comunidad que me ayudó para introducirme en el mundo del código abierto, Ubuntu. Por lo que también los problemas que he ido solventando las propondré al público, tal como otros blogeros lo hicieron por mi.

Tengo la esperanza que lo que publique por aquí, pueda ser de ayuda algún día para alguien al igual que para mi fue de ayuda en algún otro momento.