Combinación de colores RGB (en java)

RGB es un formato para originar colores usando la combinación de tres colores basicos: rojo, verde y azul o RGB (Red, Green, Blue) por sus siglas en inglés. Cuando estudiaba html y css por primera vez, hace muchas lunas, me estudie la teoría de esto por que me la pasaba haciendo pruebas de diseño basado unicamente en usar diferentes colores.

Y de todo eso me hice un sencillo applet para poder ver al momento el resultado de diferentes combinaciones RGB.



Simplemente entendí que la base de RGB es usar cada color con un valor de entre 0 y 255 y de la combinación de los tres se obtiene algún color, en html se usa la notación hexadecimal donde también se parte de tres colores primarios (los mismos RGB) pero los valores van de 00 a FF, donde para fines practicos 00=0 y FF=255, comprendiendo lo anterior se puede facilmente convertir de una a otro notación y el color generado debe ser el mismo.

Por ejemplo el color amarillo se forma de la combinación entre rojo y verde, entonces para formarlo en rgb se denota: rgb(255,255,0) o en hexadecimal #FFFF00 y así se puede usar, en html se utilizaba mucho el hexadecimal antes de css, ahora lo correcto es usar la definición en css, para definir un color css es: rgb(R,G,B) donde para cada letra pones el valor del color entre 0 y 255 o puede ser por porcentaje (entre 0 y 100) por ejemplo para el amarillo será rgb(100%,100%,0%).

Y la idea del applet fue poder generar colores usando rgb y obtener sus valores tanto directo y porcentual o su equivalente hexadecimal. Luego hice una actualización del applet para poder usarlo directamente como aplicación y no depender de abrir una pagina y cargarlo, ademas de que el elemento applet ha sido descontinuado de las actualizaciones html.

En alguna ocasión publique el código y compilado de generador de colores, lo puedes descargar de [app colores rgb] pero es la versión previa, la ultima versión, tal como se ve la imagen de esta entrada, es la correspondiente al código que anexo en seguida, la versión previa funciona igual pero los controles se ven diferentes y un poco menos accesibles.

// Nombre del programa: colores.java
// Propósito: Visualizar colores de acuerdo a su valor RGB y su valor Hexadecimal
//  Fecha: octubre - 2006
// Actualizacion Abril 2007 se le agrego metodo main para que pueda ser ejecutado como aplicacion
// Actualizacion Julio 2007 se le agrego etiquetas indicadoras de porcentaje de color
// Actualizacion Marzo 2012 se cambiaron los layouts para mejorar la presentacion
// Compilador: jdk1.6.0_18

import java.applet.*;
import java.awt.*;
import java.awt.event.*;
import java.util.Timer;
import java.util.TimerTask;
import java.awt.event.AdjustmentListener;
import java.awt.event.AdjustmentEvent;
import java.text.DecimalFormat;

//<applet code="colores.class" height=340 width=340> </applet>

public class colores extends Applet implements AdjustmentListener, ItemListener, WindowListener{

  private Label[] etiqC = new Label[3];
  private Label[] etiqP = new Label[3];
  private Scrollbar[] barraC = new Scrollbar[3];
  private TextField numero;
  private Timer timer;
  private int[] incC = new int[3];
  private int[] cf = new int[3];
  private Checkbox alea;
  private Panel controles;

  public void init(){
    Panel controles=new Panel();
    Panel[] lctrl=new Panel[3];
    controles.setLayout(new GridLayout(5,0));
    setLayout(new BorderLayout());
    controles.setBackground(Color.white);
    add(controles,BorderLayout.NORTH);
    for(int i=0;i<3;i++){
      lctrl[i]=new Panel(new BorderLayout());
      controles.add(lctrl[i]);
      etiqC[i] = new Label(" "+(i==0?"Rojo":(i==1?"Verde":"Azul"))+" 0 ");
      lctrl[i].add(etiqC[i],BorderLayout.WEST);
      barraC[i] = new Scrollbar(0,0,0,0,256);
      lctrl[i].add(barraC[i],BorderLayout.CENTER);
      barraC[i].addAdjustmentListener(this);
      etiqP[i] = new Label(" "+(i==0?"Rojo":(i==1?"Verde":"Azul"))+" 0% ");
      lctrl[i].add(etiqP[i],BorderLayout.EAST);
      incC[i]=5;
      cf[i]=0;
    }
    etiqC[0].setBackground(Color.red);
    etiqC[0].setForeground(Color.yellow);
    etiqC[1].setBackground(Color.green);
    etiqC[1].setForeground(Color.black);
    etiqC[2].setBackground(Color.blue);
    etiqC[2].setForeground(Color.white);
    etiqP[0].setBackground(Color.red);
    etiqP[0].setForeground(Color.yellow);
    etiqP[1].setBackground(Color.green);
    etiqP[1].setForeground(Color.black);
    etiqP[2].setBackground(Color.blue);
    etiqP[2].setForeground(Color.white);
    numero = new TextField(" Hexadecimal: #000000");
    controles.add(numero);
    numero.setEditable(false);
    alea = new Checkbox("Generar colores aleatorios",false);
    controles.add(alea);
    alea.addItemListener(this);
    alea.setBackground(Color.white);
    setBackground(Color.white);
    timer = new Timer();
    timer.scheduleAtFixedRate(timerTask, 0, 50);
    validate();
  }

  TimerTask timerTask = new TimerTask(){
    public void run(){
          if(alea.getState()){
            for(int i=0;i<3;i++){
              cf[i]=barraC[i].getValue()+incC[i];
              cf[i]=(cf[i]>255?255:(cf[i]<0?0:cf[i]));
              if(cf[i]==255||cf[i]==0){
                do{
                  incC[i]=(int)(7*Math.random()+1);
                }while(incC[i]<0||incC[i]>255);
                incC[i]*=(cf[i]==255?-1:1);
              }
              barraC[i].setValue(cf[i]);
            }
            repaint();
          }
    }
  };

  public void adjustmentValueChanged(AdjustmentEvent e){
    repaint();
  }

  public void itemStateChanged(ItemEvent e){}

  public void paint(Graphics g){
    DecimalFormat f = new DecimalFormat("#");
    etiqC[0].setText(" Rojo "+barraC[0].getValue()+" ");
    etiqC[1].setText(" Verde "+barraC[1].getValue()+" ");
    etiqC[2].setText(" Azul "+barraC[2].getValue()+" ");
    etiqP[0].setText(" Rojo "+f.format(((double)barraC[0].getValue())/255*100)+"% ");
    etiqP[1].setText(" Verde "+f.format(((double)barraC[1].getValue())/255*100)+"% ");
    etiqP[2].setText(" Azul "+f.format(((double)barraC[2].getValue())/255*100)+"% ");
    numero.setText(" Hexadecimal: #"+hex(barraC[0].getValue())+hex(barraC[1].getValue())+hex(barraC[2].getValue()));
    setBackground(new Color(barraC[0].getValue(),barraC[1].getValue(),barraC[2].getValue()));
  }

  private String hex(int n){
    int aux=(int)(Math.floor(n/16));
    int aux2=n%16;
    return ""+(aux==10?"a":((aux==11?"b":(aux==12?"c":(aux==13?"d":(aux==14?"e":(aux==15?"f":""+aux))))))) +
    (aux2==10?"a":((aux2==11?"b":(aux2==12?"c":(aux2==13?"d":(aux2==14?"e":(aux2==15?"f":""+aux2)))))));
  }

  /* Todo lo siguiente Actualizacion Abril 2007 haciendo que esta cosa se pueda ejecutar como
    aplicacion ademas de como applet (sin modificar el codigo anterior) */
  public static void main(String[] args){
    colores cl = new colores();
    cl.coloresComoAplicacion();
  }

  public void coloresComoAplicacion(){
    Frame ventApli = new Frame("Colores RGB");
    ventApli.add(this,BorderLayout.CENTER);
    ventApli.setSize(340,340);
    init();
    start();
    ventApli.addWindowListener(this);
    ventApli.setResizable(false);
    ventApli.setVisible(true);
    ventApli.setLocationRelativeTo(null);
  }

  public void windowClosing(WindowEvent e){
    stop();
    destroy();
    System.exit(0);
  }
  public void windowIconified(WindowEvent e){}
  public void windowDeiconified(WindowEvent e){}
  public void windowListener(WindowEvent e){}
  public void windowOpened(WindowEvent e){}
  public void windowClosed(WindowEvent e){}
  public void windowActivated(WindowEvent e){}
  public void windowDeactivated(WindowEvent e){}
}


Comentarios

Entradas populares