DefaultTableModel extendido

DefaultTableModel extendido

A veces cuando programamos en varios lenguajes, no podemos impedir comparar el modo de hacer entre unos y otros y uno de ellos es el uso de un control JTable y su relleno con DefaultTableModel. Comparado con un DataGrid en WPF al que le pasamos la colección de objetos y si así lo deseamos, las columnas pueden generarse solas, nuestro JTable está un poco lejos ya que hay que crear las columnas y pasarle un array de objetos por fila, pero por ejemplo al seleccionar una fila, como el objeto no está incluido en ella,sino un array, hay que recomponer de nuevo el objeto, en fin, demasiados inconvenientes.

Para solucionar esto, vamos a crear un objeto DefaultTableModel al que le pasaremos como argumentos la lista de objetos, los nombres de las columnas, el valor de la key para localizar objetos y un texto para filtros y con todo esto añadiremos algunas funciones adicionales como filtrar u obtener un objeto.

Para generalizar, he creado una interface ObjectTableable para el objeto en sí, que implementa tres métodos:

  • Object[] toArray(). Obtiene un array del objeto con el fin de añadirlo a cada fila
  • int GetIndex(). Nos informa de la columna que contiene el key del objeto y con el cual podemos luego capturar.
  • Boolean Contains(String text). Comprueba en sus propiedades si contiene un texto
public interface ObjectTableable{
    public Object[] toArray();
    public Object getIndex();
    public Boolean contains(String text);
}

La siguiente interface la implementará nuestra clase extendida DefaultTableModel a la cual le pasamos un objeto genérico que implementa la interface ObjectTableable, con esto nos aseguramos que todos los objetos de nuestra clase extendida funciona por igual. Esta interface se llama Tableable y contiene los siguientes métodos:

  • int getKeyIndex(). Devuelve el número de columna que contiene el key del objeto en la lista
  • void setKeyIndex(int index). Asigna el valor de la columna key
  • T getRowObject(). Devuelve un objeto que implementa la interfaz ObjectTableable
  • ArrayList getColumns(). Obtiene una lista de las columnas
  • void setColumns(String [] columns). Asigna el valor de las columnas
  • void clearColumns(). Borra las columnas. Esto solo se puede hacer desde el objeto jTable.ColumnTableModel.
  • void filter(String text). Filtra el contenido de la colección mediante un texto.
public interface Tableable{
    int getKeyIndex();
    void setKeyIndex(int index);
    ArrayList getColumns();
    void setColumns(String [] columns);
    void clearColumns();
    T getRowObject(int _row);
    void filter(String text);
}

Un ejemplo de un un objeto que implementa la interfaz ObjectTableable sería este:

public class Cliente implements ObjectTableable {
// campos y métodos
//...
@Override
    public Object[] toArray() {
        return new Object[]{
            getCustomerNumber(),
            getCustomerName(),
            getContactFirstName(),
            getContactLastName(),
            getPhone(),
            getAddressLine1(),
            getAddressLine2(),
            getCity(),
            getState(),
            getPostalCode(),
            getCountry(),
            getSalesRepEmployeeNumber(),
            getCreditLimit()
        };
    }

    @Override
    public Object getIndex() {
        return 0;
    }

    @Override
    public Boolean contains(String text) {
        String lowerText=text.toLowerCase();
        return this.getCustomerName().toLowerCase().contains(lowerText) ||
                String.valueOf(getCustomerNumber()).contains(lowerText) ||
                this.getContactFirstName().toLowerCase().contains(lowerText) ||
                this.getContactLastName().toLowerCase().contains(lowerText);
    }
}

El método toArray(), devuelve un array de los objetos que pretendemos visualizar y contains le indicamos si en alguno de sus campos contiene el elemento que buscamos.

Y ahora la extensión de TableDefaultModel, la cual debe tratar objetos genéricos para que nos sirva para cualquier objeto que implemente nuestra initerfaz.

public class ExtendedTableModel<T extends ObjectTableable> extends DefaultTableModel implements Tableable{
     
    ArrayList<T> objectList;
    ArrayList<String> columns;
    int keyIndex=0;
    
    public ExtendedTableModel(ArrayList<T> _list, String[] _columns){ 
        this(_list,_columns,0, "");  
    }
    
    public ExtendedTableModel(ArrayList<T> _list, String[] _columns, int _key){ 
        this(_list,_columns,_key,"");         
    }
    
        public ExtendedTableModel(ArrayList<T> _list, String[] _columns, int _key, String text){ 
        objectList=new ArrayList<>();
        columns=new ArrayList<>();
        keyIndex=_key;
                
        objectList.addAll(_list);
        setColumns(_columns);
        if (!text.isEmpty()) {
            filter(text);
        }
        setModel();           
    }
        
    void setModel(){ 
        setColumns();
        objectList.stream().forEach((object) -> {
            this.addRow(object.toArray());
        });
    }
    
    void setColumns(){
        getColumns().stream().forEach((column) -> {
            this.addColumn(column);
        });
    }
    
    @Override
    public T getRowObject(int row){     
        Object keyRow=getValueAt(row, keyIndex);
        for (T object : objectList) {
            Object a= object.getIndex();
            if (object.getIndex().equals(keyRow)) {
                return object;
            }
        }
        return null;
    }

    @Override
    public int getKeyIndex() {
        return keyIndex;
    }

    @Override
    public void setKeyIndex(int index) {
        keyIndex=index;
    }

    @Override
    public ArrayList<String> getColumns() {
        return columns;
    }

    @Override
    public void setColumns(String[] _columns) {
        columns.addAll(Arrays.asList(_columns));
    }

    @Override
    public void clearColumns() {
        setColumns(new String[0]);
    }    
    
    @Override
    public void filter(String text){
        Object[] temp=objectList.stream().filter(k->k.contains(text)).toArray();
        objectList.clear();
        for (Object object : temp) {
            objectList.add((T)object);
        } 
    }       

al instanciar el objeto, ya se crea el modelo con las columnas y filas idenpendientemente del tipo de objeto siempre implemente nuestra interfaz, pero si hacemos dobleclick sobre el jTable, podemos llamar al método getRowObject que devolverá el objeto completo o si le passamos como parámetro un texto, iniciará un filtrado sobre los objetos mostrando solo los que cumplan el criterio.Con esto, simulamos un itemsource a un control jTable de Java, primero obtenemos los datos, segundo las columnas, el texto de filtrado y la columna del indice.

ArrayList empleados=negocio.getEmpleados();
String [] _columnsE=new String[] { "Cargo", "Código empleado", "Nombre", "Apellidos","Extensión", "Email", "Oficina"};
                etm=new ExtendedTableModel(empleados,_columnsE,1, jTextField1.getText());

Y el resultado.

Video13.gif

Validar email con PHP

Validar email con PHP
A continuación dos modos de validar una dirección de email con php.
La primera mediante una expresión regular y la segunda mediante filter_var que se encarga de filtrar variables mediante filtros (valga la redundancia).
Como ejemplo, un pequeño formulario con un inputtype tipo texto y un botón de envío.

<HTML>
<HEAD></HEAD>

    <BODY>
        <p>Validando email</p>
        <form action="" method="post">
            <input type="text" value="" name="email"/>
            <input type="submit" value="validar" />
        </form>
    </BODY>
    <?php
    $email=isset($_POST['email']) ? $_POST['email'] :null;    
    if(validarEmail_ExpresionRegular($email)){          
            echo "Expresion Regular. La dirección de email $email es correcta.</br>";
    }
    else echo "Expresion Regular. La dirección de email $email es incorrecta.</br>";    
    
    if (is_valid_email_FilterVar($email)){
          
            print "Filter_var. La dirección de email $email es correcta.</br>";  
    }
    else print "Filter_var. La dirección de email $email es incorrecta.</br>"; 
    
    /* **********************************
    *  FUNCIONES DE VALIDACIÓN DE EMAIL *
    *************************************/
    
    // Función para validar email usando un expresión regular
    function validarEmail_ExpresionRegular($emailAValidar){
        $matches = null;
            return (1 === preg_match('/^[A-z0-9\\._-]+@[A-z0-9][A-z0-9-]*(\\.[A-z0-9_-]+)*\\.([A-z]{2,6})$/', $emailAValidar, $matches));
    }
    
    // Función para validar email usando un filter_var 
    // en la que se filtran variables mediante filtros (valga la redundancia)
    function is_valid_email_FilterVar($str)
    {
        return (false !== filter_var($str, FILTER_VALIDATE_EMAIL));
    }
?>
</HTML>

Descomposición factorial con hilos II

Descomposición factorial con hilos II
Y ahora vamos a emular un lugar donde se descomponen los números y cada vez que se encuentra uno, se obtiene y se muestra su descomposición.

Para realizar esto, usaremos los monitores de Java, los métodos wait() y notify(). Estos métodos tienen que ir siempre incluidos sobre métodos marcados como syncronized o usar el método syncronized(metodo sincronizado). wait() y notify() (hay alguno más) heredan del Object, por lo que todos los objetos que hereden de esta clase, lo tienen disponible.

¿Que hace wait()? suspende indefinidamente el hilo hasta que se reanude con notify().

Así que crearé una clase que solicitará la descomposición del número, el cual es enviado al supuesto servidor compartido de descomposiciones factoriales, este se encarga de descomponerlo (tarea dura) y una vez que termine, habrá un receptor de datos esperando a su finalización para mostrar su descomposición.

DESC

La clase SolicitudDescomposicionVisualizadorDescomposicion heredan de Thread, los iniciamos desde la clase principal y a trabajar por parte del servidor. He aquí el código:

public static void main(String[] args) {
        // TODO code application logic here
        
        ServidorDescomposicion r=new ServidorDescomposicion();
        for (int i = 0; i < 10; i++) {
            SolicitudDescomposicion productor=new SolicitudDescomposicion(i, r);
            VisualizadorDescomposicion consumidor=new VisualizadorDescomposicion(i, r);
            
            productor.start();
            consumidor.start();
        }
        
    }
public class SolicitudDescomposicion extends Thread {
    
    ServidorDescomposicion r;
    
    public SolicitudDescomposicion(int n, ServidorDescomposicion _r){
        this.setName("Productor " + n);
        r=_r;
    }
    
    @Override
    public void run(){
        int n=Math.abs(new Random().nextInt());
        System.out.println("Enviando número descomposición desde el productor:\t" + n);
        r.descomponerNumero(n);
    }
}

public class VisualizadorDescomposicion extends Thread{
    
    ServidorDescomposicion r;
    
    public VisualizadorDescomposicion(int n, ServidorDescomposicion _r){
        this.setName("Consumidor " + n);
        r=_r;
    }
    
    @Override
    public void run(){        
        String desc="";
        try {
            desc = r.getDescomposicion();
        } catch (InterruptedException ex) {
            Logger.getLogger(VisualizadorDescomposicion.class.getName()).log(Level.SEVERE, null, ex);
        }
        System.out.println("Datos obtenidos desde el consumidor.Resultado:\t\t" + desc);        
    }
}
public class ServidorDescomposicion {

    ArrayList buffer;
    boolean existData;


    //&& estado.equals(estadoEnum.DESCOMPONIENDO
    //&& estado.equals(estadoEnum.LIBRE)
    public ServidorDescomposicion() {
        buffer = new ArrayList();
    }

    public synchronized void descomponerNumero(int numero) {
        descomponer(numero);
    }

    void retardo(int ms) {
        try {
            Thread.sleep(ms);
        } catch (InterruptedException ex) {
            Logger.getLogger(ServidorDescomposicion.class.getName()).log(Level.SEVERE, null, ex);
        }
    }

    public synchronized String getDescomposicion() throws InterruptedException {
        
        while(!existData){
            try {
                wait();
            } catch (InterruptedException ex) {
                Logger.getLogger(ServidorDescomposicion.class.getName()).log(Level.SEVERE, null, ex);
            }
        }
        
        String descomposicion = "";
        descomposicion = buffer.remove(0);
        if (buffer.size()==0) {
            existData=false;
        }
        notify();
        
        return descomposicion;
    }

    void descomponer(int numero) {
        // Cálculos y resultados
        int iniNum = numero;
        int numeroAux = numero;
        int n = 0;
        int nn = 0;

        String text = "";
        String puntos = ".";

        for (long i = 2; i < numero; i++) { 
            while (numeroAux % i == 0) {
                numeroAux /= i;
                text += i + ".";
                if (numeroAux == 1) {
                    numero = numeroAux;
                }
            }
        }
        if (text.isEmpty()) {
            System.out.printf("El número %s es primo!\n", iniNum);
            text = String.valueOf(iniNum);
        }
        buffer.add(String.format("%s=%s", iniNum, text));
        existData=true;

    }

}

y el resultado para 10 números enteros


Enviando número descomposición desde el productor:	1007666687
Enviando número descomposición desde el productor:	233955388
Enviando número descomposición desde el productor:	403028651
Enviando número descomposición desde el productor:	1405658987
Enviando número descomposición desde el productor:	809322159
Enviando número descomposición desde el productor:	263332588
Enviando número descomposición desde el productor:	1552584352
Enviando número descomposición desde el productor:	1342709543
Datos obtenidos desde el consumidor.Resultado:		1007666687=17.31.43.53.839.
Datos obtenidos desde el consumidor.Resultado:		1342709543=7.191815649.
Datos obtenidos desde el consumidor.Resultado:		1552584352=2.2.2.2.2.11.89.49559.
Datos obtenidos desde el consumidor.Resultado:		263332588=2.2.487.135181.
Datos obtenidos desde el consumidor.Resultado:		809322159=3.113.733.3257.
Datos obtenidos desde el consumidor.Resultado:		403028651=67.6015353.
Datos obtenidos desde el consumidor.Resultado:		233955388=2.2.31.443.4259.
Datos obtenidos desde el consumidor.Resultado:		1405658987=127.199.55619.

Saludos

Descomposición factorial con hilos I

Descomposición factorial con hilos I

Un ejemplo de aprovechamiento de recursos sobre procesos penosos en los que ponemos el pc a prueba, puede ser la descomposición de números grandes en factores primos. En este ejemplo sobre la plataforma Java, se descomponen números del tipo Long con un método estándar (no muy eficiente) con una clase que implementa la Interfaz Runnable. A la clase le pasamos un número como parámetro y otro de identificador.Si creamos varios hilos, cada uno descomponiendo un número grande, aprovechará los distintos núcleos para el cálculo. Este es el resultado para números enteros pequeños mostrando el número de hilos vivos.

INICIO Hilo nº0-> Descomposición de 1763458
INICIO Hilo nº2-> Descomposición de 882375341
INICIO Hilo nº3-> Descomposición de 396209470
INICIO Hilo nº1-> Descomposición de 1633289887
Hilo nº 0-> Descomponiendo 1763458. Nº iteraciones: 1
Hilo nº 2-> Descomponiendo 882375341. Nº iteraciones: 96
Hilo nº 3-> Descomponiendo 396209470. Nº iteraciones: 1
Hilo nº 3-> Descomponiendo 198104735. Nº iteraciones: 4
Hilo nº 3-> Descomponiendo 39620947. Nº iteraciones: 18
Hilo nº 3-> Descomponiendo 2085313. Nº iteraciones: 210
Hilo nº 1-> Descomponiendo 1633289887. Nº iteraciones: 66
Hilo nº 1-> Descomponiendo 24377461. Nº iteraciones: 100
Hilo nº 3-> Descomponiendo 9883. Nº iteraciones: 9882
FIN Hilo nº 3-> 396209470 = 2*5*19*211*9883*. Nº iteraciones: 9882
Quedan 3 hilos vivos
Hilo nº 2-> Descomponiendo 9096653. Nº iteraciones: 1810
Hilo nº 2-> Descomponiendo 5023. Nº iteraciones: 5022
FIN Hilo nº 2-> 882375341 = 97*1811*5023*. Nº iteraciones: 5022
Quedan 2 hilos vivos
Hilo nº 1-> Descomponiendo 241361. Nº iteraciones: 241360
FIN Hilo nº 1-> 1633289887 = 67*101*241361*. Nº iteraciones: 241360
Quedan 1 hilos vivos
Hilo nº 0-> Descomponiendo 881729. Nº iteraciones: 881728
FIN Hilo nº 0-> 1763458 = 2*881729*. Nº iteraciones: 881728
Quedan 0 hilos vivos

Y el código de las clases…

Clase Main

package Descompositor;

import java.util.Random;

// <editor-fold defaultstate="collapsed" desc="Cabecera de clase">
/******************************************************
 *  @author:    Joaquín Martínez Rus (c) 2017
 *  @version:   1.0
 *  File:       Main.java
 *  Created:    29/11/2017
 *  Project:    PSP. Ejemplo de descomposición multihilo.
 *  Comments:
 *******************************************************/
// </editor-fold>
public class Main {

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        // TODO code application logic here
        for (int i = 0; i < 5; i++) {
            Descomposicion d=new Descomposicion(Math.abs(new Random().nextLong()),i);
            Thread hilo=new Thread(d);
            hilo.start();
        }
    }
}

y la clase encargada de la descomposición

package Descompositor;
import java.util.Date;
// <editor-fold defaultstate="collapsed" desc="Cabecera de clase">
/******************************************************
 *  @author:    Joaquín Martínez Rus (c) 2017
 *  @version:   1.0
 *  File:       Descomposicion.java
 *  Created:    29/11/2017
 *  Project:    PSP. Ejemplo de descomposición multihilo.
 *  Comments:
 *******************************************************/
// </editor-fold>
public class Descomposicion implements Runnable{

    public Descomposicion(long n, int j){
        this.name=j;
        this.number=n;
        Descomposicion.instanciasVivas++;
    }

    public static int instanciasVivas;
    int name;
    long number;

    @Override
    public void run() {
        descomponer(number, name);
    }

    void descomponer(long numero, int j){
        // Cálculos y resultados

        long iniNum=numero;
        long numeroAux = numero;
        long n=0;
        int nn=0;

        System.out.printf("INICIO Hilo nº%s-> Descomposición de %s\n" , j, numeroAux);
        String text="";
        String puntos=".";

        for (long i = 2; i 1000000000) {
                nn++;
                String cadena="Hilo Nº %s-> Seguimos calculando para %s...\n";
                if (nn>2) {
                    if (text.isEmpty()) {
                        cadena = "Hilo Nº %s-> parece que el número %s es primo...\n";
                    }
                    else{
                        cadena ="Hilo Nº %s-> No es primo y seguimos calculando para %s...\n";
                        nn=0;
                    }
                }
                System.out.printf(cadena, j, numeroAux);
                n=0;

            }
            // DESCOMPOSICIÓN
            while (numeroAux % i == 0) {
                System.out.printf("Hilo nº %s-> Descomponiendo %s. Nº iteraciones: %s\n",j, numeroAux, n);
                numeroAux /= i;
                text += i + "*";
                if (numeroAux == 1) {
                    numero=numeroAux;
                }
            }
        }
        if (text.isEmpty()){
            System.out.printf("El número %s es primo!\n",iniNum);
            text = String.valueOf(iniNum);
        }
        System.out.printf("FIN Hilo nº %s-> %s = %s. Nº iteraciones: %s\n",j, iniNum, text, n);

        Descomposicion.instanciasVivas--;
        System.out.printf("Quedan %s hilos vivos\n",Descomposicion.instanciasVivas);

    }
}

Os adjunto el proyecto de NetBeans.

Saludos

 

Atajos en Android Studio

Atajos en Android Studio

Como no iba a ser menos, Android Studio también tiene algunos atajos o métodos abreviados para simplificar la escritura de código y he aquí algunos ejemplos útiles.

¿Cuáles son estas abreviaturas? Pues si pulsamos CTRL + J nos muestra en una lista todos ellas.
Pulsando por ejemplo it y CTRL + J, mostraría lo siguiente
abrev01
y escribiendo st + TAB escribe String
Si declaramos por ejemplo un array y luego itar + TAB se genera el siguiente código

String [] array=new String[3];
for (int i = 0; i < array.length; i++) {
       String s = array[i];                    
}

Hay muchas abreviaturas, pero por otra parte, existen combinaciones de teclas y a mi personalmente, me gustan las siguientes:

Cuando vamos a hacer un cast, escribimos el paréntesis y CTRL + MAYUSC + SPC y se completa automáticamente

String a=( CTRL + MAYUSC + SPC → String a=(String)
CTRL + SPC nos muestra las sugerencias en el contexto actual. Si escribimos nu…abrev02

CTRL + P entre los paréntesis donde se albergan los parámetros de un método, nos muestra una ayuda de los parámetros

abrev03

CTRL + / o CTRL + MAYUSC + / comenta mediante // o /**/ respectivamente las líneas

ALT + CTRL + L formatea el código

CTRL + click sobre un objeto o método, navega hasta la declaración de este

CTRL + MAYUSC + RETROCESO, navega hasta el último lugar donde realizamos la última edición.

…  y muchos más.

 

Documentar el código

Documentar el código

El código además de ser limpio, legible, entendible o estructurado entre otras características, debe estar muy bien documentado con el fin de efectuar un mantenimiento, modificación o ampliación de nuestra fuente. Además, es posible generar documentación en base a estos comentarios como es el caso de JavaDoc.

Existen muchas formas de comentar el código, por ejemplo:

C#, Java, PHP, etc.

  • Solo C#. Podemos hacerlo con tres barras /// en la que al crear una nueva línea, la siguiente línea queda también comentada con ///. Si las escribimos antes de una clase o un método, genera etiquetas de comentario que expondré a continuación.
  • Dos barras, crea una línea de código comentado
  • Comentario multilínea. Una barra y un asterisco /* provoca que el código esté comentado hasta que se cierre el comentario con asterisco barra */

Visual basic.NET

  • Comillas simples para comentar línea. ‘Esto es un comentario en VB.NET
  • Usar la etiqueta REM. REM Esto es un comentario en VB.NET
  • Si queremos crear varias líneas, debemos usar el concatenador guión bajo
    REM Esto es un comentario_ 
    en VB.NET

HTML

  • para cerrar el comentario

Comentarios de clases y métodos

Cuando estamos escribiendo código e instanciamos una clase o seleccionamos un método de una clase, los IDE,s nos muestran una ayuda que nos muestra que hace el método, que parámetros tiene o que sobrecargas y esto se consigue del siguiente modo:

C#

    • Escribimos /// precediendo a una clase o un método y se generan automáticamente una serie de etiquetas xml. La documentación de las etiquetas la pueden encontrar en el siguiente enlace.
      /// <summary>
      /// Obtiene el nombre completo del objeto Persona
      /// </summary>
      /// <param name="dni">DNI del objeto persona</param>
      /// <returns>Cadena de texto con el nombre completo</returns>
      public string GetFullName(string dni)
      {
      	return "Joaquín Martínez;
      }
      
      /// <summary>
      /// Obtiene el nombre completo del objeto Persona
      /// </summary>
      /// <param name="id">Identificador del objeto persona</param>
      /// <returns>Cadena de texto con el nombre completo</returns>
      public string GetFullName(int id)
      {
      	return "Joaquín Martínez;
      }
      

Java

    • Escribimos encima de un método /** e INTRO y se genera las etiquetas para documentar el código
      /**
      * Obtiene el nombre completo del objeto Persona
      * @param dni DNI del objeto persona
      * @return Cadena de texto con el nombre completo
      */
      public String getFullName(String dni){
      	return "Joaquín Martínez";
      }
      
      /**
      * Obtiene el nombre completo del objeto Persona
      * @param id Identificador del objeto persona
      * @return Cadena de texto con el nombre completo
      */
      public String getFullName(int id){
      	return "Joaquín Martínez";
      }
      

      coment04coment05

Regiones

Otra forma de mantener el código ordenado es mediante regiones, esto nos va a permitir por ejemplo mantener en una clase de negocio los métodos de actualización, adición y eliminación separados de los de selección, mantener propiedades en una región, campos en otra, métodos públicos en otra, privados en otra y así cuantas regiones queramos tener con el fin de mantener el código ordenado. Yo personalmente en una clase, generalizando, siempre tengo una región para constructores y destructores, una para enumeraciones, una para campos, una para métodos públicos y protected, otra para privados y si la clase es un form o window, añado una para controles y dentro de esta, por tipo de control, añado métodos de evento de cada uno, por ejemplo, Buttons, DataGrid, etc.

C#

#region Métodos públicos
        // aquí podemos poner todos los
        // miembros de clase que queramos
#endregion

VB.NET

#Region "Métodos Públicos"
' aquí podemos poner todos los
' miembros de clase que queramos
#End Region

def45-7-2-1
Java

// <editor-fold desc="Métodos públicos" defaultstate="collapsed">
        // aquí podemos poner todos los
        // miembros de clase que queramos
// </editor-fold>

coment06.png

Tareas

Visual Studio tiene comentarios de tareas, es decir si incluimos una serie de comentarios específicos (TOKEN) en alguna parte del código con un comentario adicional, en la lista de tareas, podemos acceder a esta localización de código para continuar con la tarea pendiente. Estos Token pueden personalizarse en el Menú Herramientas, Opciones, Lista de tareas. En este ejemplo, he colocado un TOKEN para revisar el contenido del método y en la lista de tareas, al hacer doble click, nos dirigiremos al código en cuestión.

coment07.png

Hay que añadir y es una buena costumbre, documentar las clases con autoría, fechas de creación y modificación, que hace la clase, que función tiene, las modificaciones que se han realizado, etc.

Hacedme caso, un poco tiempo perdido en documentar, nos hará ganar muchísimo tiempo en un futuro.

coment08.png

 

Atajos Netbeans

Atajos Netbeans

Todos los IDE,s tienen una serie de mejoras que nos ayudan a escribir código de manera fácil y evitando errores, en este caso Netbeans no podía ser menos.

¿Que son los atajos de Netbeans? Son palabras que nos permiten escribir bloques de código de una manera rápida evitando repetir estructuras continuamente. Lo primero de todo que son muy prácticos y lo segundo que evitan muchos errores, (causan otros), pero creo que las ventajas son muy superiores a los pocos inconvenientes que pudiera tener. Para el que no esté familiarizado con el código, lo mejor sería teclear todas las instrucciones letra por letra y olvidarse de los atajos por una temporada hasta que controléis la mayoría de las instrucciones. Hay dos tipos, uno mediante combinación de teclas y otros escribiendo palabras + TAB.

Las combinaciones de teclas, pueden visualizarse en los menús y menús contextuales. Alguno de los ejemplos de combinación de teclas:

  • CTRL + SPACE→ o completa la palabra que estamos intentando escribir o nos muestra una lista con las sugerencias.
  • ALT + ENTER→ Si nuestro código se encuentra subrayado en rojo, nos muestra que podemos hacer. Si instanciamos Scanner y no tenemos importado java.util.Scanner, al combinar sobre este nos mostrará lo mismo que si pulsamos sobre la bombilla de sugerencias.
  • CTRL + R→Imaginad que tenemos una variable en 20 sitios distintos, pues si nos situamos sobre ella y usamos este atajo, nos resalta todas las variables en el código pudiendo detectarlas con más facilidad.
  • ALT + SHIFT+ F →Da formato al código
  • CTRL + E → Borra líneas de código CTRL+ SHIFT+ Flecha Arriba o Abajo →Copia líneas de código
  • ALT + SHIFT+ Flecha Arriba o Abajo →Sube o baja líneas de código
  • CTRL + SHIFT + B. Navega hasta la fuente del código.
  • CTRL + B. Navega hasta la declaración
  • ALT + F7. Busca todas las referencias usadas en los proyectos abiertos
  • F6. Ejecuta el proyecto
  • CTRL + F5. Ejecuta en modo depuración

Ejemplos de palabras + TAB.

atajos01También es posible usar CTRL + SPACE cuando estemos escribiendo alguna de estas palabras y nos mostrará las sugerencias. Todos estos atajos están al principio de la lista marcados con un icono cuando pusalmos CTRL + SPACE

  • sout + TAB → System.out.println(“”)
  • soutv + TAB → System.out.println(“this = ” + this);
  • serr + TAB → System.err.println(“”);
  • for +TAB → for (int i = 0; i < 10; i++) { }
  • forc + TAB → for (Iterator iterator = col.iterator(); iterator.hasNext();) {Object next = iterator.next();}
  • fore + TAB → for (String arg : args) { }
  • whilexp +TAB → while (true) { }
  • do +TAB → do { } while (true);
  • if +TAB → if (true) { }
  • ifelse +TAB → if (true) { } else { }
  • sw +TAB → switch (var) { case val: break; default: throw new AssertionError(); }
  • trycatch → try { } catch (Exception e) { }
  • fcom →región de código
    // <editor-fold defaultstate="collapsed" desc="Generated Code">
    ...
    // </editor-fold>

una vez que los escribimos, hay que tener en cuenta que algunos de ellos debemos completarlos (de ahí los posibles errores). Por ejemplo, sw que genera el bloque de código switch hay que escribir el valor de la variable y los valores de cada caso, si no el código nos daría error. El bloque de código fore, se debe indicar la colección o forc hay que indicar el iterator.

Espero que os sirva de ayuda aunque reitero que si no estáis familiarizados con el código hay que escribirlo mil veces hasta que nos suene antes de usar atajos.

Distancia de Levenshtein

Distancia de Levenshtein

La distancia de Levenshtein es el número mínimo que necesitamos para convertir una palabra en otra, un ejemplo pelo y perro tienen una distancia de 2 porque tendríamos que sustituir la l por una r y añadir una r, dos movimientos, distancia 2. Otro ejemplo, murcielago y muerdago que tienen una distancia de 5, ya que a murciélago le tenemos que quitar c,i,e,l y a muerdago le quitamos la d, por tanto necesitamos 5 movimientos para convertir una palabra en otra. Resumiendo, cuanto más pequeña sea la distancia, más parecidas son las dos palabras.

¿Esto para que sirve?, pues muy fácil, para obtener palabras similares en los buscadores o mostrar palabras alternativas por ejemplo. Vamos a ver el algoritmo y como funciona.

Este algoritmo es una matriz de n filas por m columnas donde n y m son el número de caracteres + 1 de cada palabra. El primer paso que se realiza es rellenar la primera fila y la primera columna con números secuenciales de 0 hasta n+1 y desde 0 hasta m+1 , quedando del siguiente modo para el caso del ejemplo inicial la matriz de 11×9:

levensthein0Una vez tenemos la matriz inicial, empezaremos a realizar comparaciones por filas de cada caracter con el caracter de cada columna. En cada operación, obtenemos primero el peso y tres valores de los cuales deduciremos el menor de ellos como valor final y con un ejemplo lo veremos mejor.

Comenzamos comparando los caracteres, la letra “m” de murcielago (en la columna), lo comparamos con la “m” de muerdago (filas), si es el mismo caracter se le asigna un peso de 0 y si es diferente, le asignamos 1, en este caso como son iguales, le asignamos un 0. A continuación obtenemos los tres valores, el primero con la casilla superior sumándole al valor de esta un 1, en este caso 1+1=2, el siguiente con la casilla que está situada a su izquierda haciéndolo de igual modo, 1+1=2 y por último a la casilla superior izquierda, la que está situada en la diagonal a la que le sumaremos el valor del peso, 0+0=0; de estos tres valores, cogeremos el menor que en este caso es el 0. levensthein1

Vamos a por el siguiente, peso igual a 0, porque u es igual a u, por la izquierda, 0+1=1, la diagonal 1+0=1 y la superior 1+2=2, el mínimo de los tres es 1

levensthein2

continuando con las comparaciones y obtención del mínimo, quedaría nuestra matriz completa del siguiente modo:

levensthein3

El último valor, es la distancia de Levenshtein, en este caso es 5, si quisieramos ver la proporción de acierto, deberíamos obtener la la diferencia con la unidad de la relación entre la distancia y el número de caracteres del mayor en este caso, 1 – (5/10)=0,5 o 50%. La distancia de “murcielago” y “cerro muriano” es de 10, por tanto 1-(10/13)=0.2308 o del 23,08%.

El algoritmo implementado con lenguajes de programación no tiene ningún misterio para el que esté acostumbrado a las matrices, además en Wikipedia, podéis encontrar su implementación en diferentes lenguajes, por ejemplo en php ya tiene una función como tal.

vladimir-levenshtein¿Que utilidades podemos darle? por ejemplo palabras sugerentes en base a un diccionario o aproximaciones, corrección de ortografía, etc. y además, existen variantes del algoritmo como la de Damerau-Levenshtein, otros más complejos, algoritmos fonéticos.

Este algoritmo se lo debemos a Vladimir Levenshtein, un matemático ruso que lo desarrolló en 1965.

He hecho en C# una app de consola como muestra para obtener la matriz y en base a un diccionario, nos muestre sugerencia de palabra.  levensthein4

levensthein5

Semáforo II

Semáforo II
En esta entrega vamos a crear el semáforo. Aunque no lo parezca, pero un semáforo a pesar de su simplicidad visual, tiene aspectos bastante complejos y sobre todo cuando tienen que estar sincronizados o comunicados con otros, existen muchas matemáticas detrás de los modelos de tráfico de las grandes ciudades.

Sin darle más complejidad que la que necesitamos para nuestro proyecto final, que es un sistema de control de semáforos en una avenida para poder cruzarla de una sola vez sin pararnos, le asignaremos las siguientes características:

  • Tiempo en verde
  • Tiempo en amarillo
  • Tiempos en rojo
  • Tiempo de retardo para sincronziación de semáforos
  • Estado en el que se encuentra
  • Función de funcionamiento en manual o automático
  • Función de inicio automático
  • Función de parpadeo

En el diseño XAML, creamos unos objetos rectangle y le incluimos los controles de usuario creados en el post Semáforo I. El cambio de color lo podiamos haber hecho con converter, con propiedades, pero esta vez he optado por hacerlo con estilos y DataTrigger. A cada objeto LEDLight (luz del semáforo) le asigno un estilo genérico con algún efecto de fundido para que parezca más real; luego este estilo es heredado por otros tres estilos, uno por cada color donde los DataTrigger hacen su trabajo comprobando el estado del semáforo y activando la propiedad LightIsEnabled a Truesi cumple con la condición del DataTrigger. (Código al final del post)

Luego en el código de clase, le añado un DispatcherTime que nos hará las funciones de temporizador, creamos unas cuantas propiedades de dependencia para cumplir con nuestras características.
Tiene un método privado que será llamado desde el temporizador y este asignará el estado al semáforo y como consecuencia activando el color correspondiente.

        void changingState()
        {
            // Retardo inicial
            if (DelayTime > 0)
            {
                timer.Interval = new TimeSpan(0, 0, (int)DelayTime);
                DelayTime = 0;
                return;
            }

            // Parpadeando
            if (IsFlashingAmberLight)
            {
                if (State.Equals(LEDTrafficLightState.Yellow))
                {
                    State = LEDTrafficLightState.None;
                    timer.Interval = new TimeSpan(0, 0, 0, 0, 500);
                }
                else
                {
                    State = LEDTrafficLightState.Yellow;
                    timer.Interval = new TimeSpan(0, 0, 0, 1);
                }

                return;
            }

            // Cambio de color
            switch (State)
            {
                case LEDTrafficLightState.Red:
                    // SEMÁFORO EN VERDE
                    State = LEDTrafficLightState.Green;
                    
                    timer.Interval = new TimeSpan(0, 0, GreenTime);
                    break;
                case LEDTrafficLightState.Yellow:
                    // SEMÁFORO EN VERDE
                    State = LEDTrafficLightState.Red;
                    timer.Interval = new TimeSpan(0, 0, RedTime);
                    break;
                case LEDTrafficLightState.Green:
                    // SEMÁFORO EN AMBAR
                    State = LEDTrafficLightState.Yellow;
                    timer.Interval = new TimeSpan(0, 0, YellowTime);
                    break;
                default:
                    break;
            }
        }

y este el resultado instanciando varios semáforos en una ventana

            <controls:LEDTrafficLight x:Name="LEDTL1" Width="100" Height="300" GreenTime="4" RedTime="4" DelayTime="1" Margin="10"/>
            <controls:LEDTrafficLight x:Name="LEDTL2" Width="100" Height="300" GreenTime="5" RedTime="4" DelayTime="2" Margin="10"/>
            <controls:LEDTrafficLight x:Name="LEDTL3" Width="100" Height="300" GreenTime="5" RedTime="5" DelayTime="3" Margin="10"/>
            <controls:LEDTrafficLight x:Name="LEDTL4" Width="100" Height="300" GreenTime="5" RedTime="5" IsFlashingAmberLight="True" Margin="10"/>  

Video7
La próxima entrega, el sistema de control de semáforos

<UserControl x:Class="Controls.LEDTrafficLight"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:controls="clr-namespace:Controls"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="100">
    <Grid x:Name="grid">
        <Grid.Resources>
            <Style x:Key="LightStyle" TargetType="controls:LEDLight">
                <Setter Property="Margin" Value="5"/>
                <Style.Triggers>
                    <Trigger Property="LightIsEnabled" Value="True">
                        <Trigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation
                  Storyboard.TargetProperty="Opacity"
                  From="0" To="1" Duration="0:0:0.2" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.ExitActions>
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation
                  Storyboard.TargetProperty="Opacity"
                  From="0" To="1" Duration="0:0:0.1" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                    </Trigger>
                </Style.Triggers>
            </Style>
            <Style x:Key="RedLightStyle" TargetType="controls:LEDLight" BasedOn="{StaticResource LightStyle}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=controls:LEDTrafficLight},Path=State }" Value="{x:Static controls:LEDTrafficLight+LEDTrafficLightState.Red}">
                        <Setter Property="LightIsEnabled" Value="True"/>
                    </DataTrigger>

                </Style.Triggers>
            </Style>
            <Style x:Key="YellowLightStyle" TargetType="controls:LEDLight" BasedOn="{StaticResource LightStyle}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=controls:LEDTrafficLight},Path=State }" Value="{x:Static controls:LEDTrafficLight+LEDTrafficLightState.Yellow}">
                        <Setter Property="LightIsEnabled" Value="True"/>
                    </DataTrigger>

                </Style.Triggers>
            </Style>
            <Style x:Key="GreenLightStyle" TargetType="controls:LEDLight" BasedOn="{StaticResource LightStyle}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=controls:LEDTrafficLight},Path=State }" Value="{x:Static controls:LEDTrafficLight+LEDTrafficLightState.Green}">
                        <Setter Property="LightIsEnabled" Value="True"/>
                    </DataTrigger>

                </Style.Triggers>
            </Style>
            <Style x:Key="rectangleTraficLight" TargetType="Border">
                <Setter Property="Width" Value="{Binding ElementName=redEllipse, Path=ActualWidth}"/>
                <Setter Property="Height" Value="5"/>
                <Setter Property="Background" Value="Gray"/>
                <Setter Property="Margin" Value="1"/>
                <Setter Property="VerticalAlignment" Value="Top"/>
                <Setter Property="CornerRadius" Value="3"/>
            </Style>
            <Style x:Key="borderColor" TargetType="Border">
                <Setter Property="BorderBrush" Value="Gray"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="Margin" Value="2,0,2,2"/>
                <Setter Property="CornerRadius" Value="3"/>
            </Style>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="100*"/>
            <RowDefinition Height="100*"/>
            <RowDefinition Height="100*"/>
        </Grid.RowDefinitions>
        <Border Grid.RowSpan="3" BorderBrush="DarkGreen" BorderThickness="5" Background="DarkGreen" Opacity=".5" CornerRadius="5"/>
        <Border Style="{StaticResource borderColor}" Grid.Row="0">
            <controls:LEDLight x:Name="RedLight" LEDLightBackgroundON="Red" Style="{StaticResource RedLightStyle}"/>
        </Border>
        <Border Style="{StaticResource borderColor}" Grid.Row="1">
            <controls:LEDLight x:Name="YellowLight"  LEDLightBackgroundON="Gold" Style="{StaticResource YellowLightStyle}"/>
        </Border>
        <Border Style="{StaticResource borderColor}" Grid.Row="2">
            <controls:LEDLight x:Name="GreenLight" Style="{StaticResource GreenLightStyle}"/>
        </Border>
    </Grid>
</UserControl>
namespace Controls
{
    /// <summary>
    /// Lógica de interacción para LEDTrafficLight.xaml
    /// </summary>
    public partial class LEDTrafficLight : UserControl
    {
        #region Constructor

        public LEDTrafficLight()
        {
            InitializeComponent();
            this.DataContext = this;
            timer.Tick += Timer_Tick;
            timer.IsEnabled = StartAuto;
        }

        #endregion

        #region Enum

        public enum LEDTrafficLightState
        {
            Red,
            Yellow,
            Green,
            None
        }

        #endregion

        #region DependencyProperties

        public int GreenTime
        {
            get { return (int)GetValue(GreenTimeProperty); }
            set
            {
                value = value > YellowTime ? value - YellowTime : YellowTime + 1;
                SetValue(GreenTimeProperty, value);
            }
        }

        public int RedTime
        {
            get { return (int)GetValue(RedTimeProperty); }
            set
            {
                if (value <= 0) value = 1;
                SetValue(RedTimeProperty, value);
            }
        }

        public int YellowTime
        {
            get { return (int)GetValue(YellowTimeProperty); }
            set { SetValue(YellowTimeProperty, value); }
        }

        public int DelayTime
        {
            get { return (int)GetValue(TimeProperty); }
            set { SetValue(TimeProperty, value); }
        }

        public bool IsFlashingAmberLight
        {
            get { return (bool)GetValue(IsFlickingProperty); }
            set
            {
                SetValue(IsFlickingProperty, value);
                State = LEDTrafficLightState.Yellow;
                // en 100 ms cambia a Parpadeo
                timer.Interval = new TimeSpan(0, 0, 0, 0, 100);
            }
        }

        public bool IsManual
        {
            get { return (bool)GetValue(IsManualProperty); }
            set
            {
                SetValue(IsManualProperty, value);
                timer.IsEnabled = !value;
            }
        }

        public bool StartAuto
        {
            get { return (bool)GetValue(StarAutoProperty); }
            set
            {
                SetValue(StarAutoProperty, value);
                timer.IsEnabled = value;
            }
        }

        public LEDTrafficLightState State
        {
            get { return (LEDTrafficLightState)GetValue(StateProperty); }
            set { SetValue(StateProperty, value); }
        }

        #region DependecyProperties Register

        // Using a DependencyProperty as the backing store for StarAuto.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty StarAutoProperty =
            DependencyProperty.Register("StartAuto", typeof(bool), typeof(LEDTrafficLight), new PropertyMetadata(true));

        // Using a DependencyProperty as the backing store for IsManual.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty IsManualProperty =
            DependencyProperty.Register("IsManual", typeof(bool), typeof(LEDTrafficLight), new PropertyMetadata(false));

        // Using a DependencyProperty as the backing store for IsFlicking.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty IsFlickingProperty =
            DependencyProperty.Register("IsFlashingAmberLight", typeof(bool), typeof(LEDTrafficLight), new PropertyMetadata(false));

        // Using a DependencyProperty as the backing store for State.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty StateProperty =
            DependencyProperty.Register("State", typeof(LEDTrafficLightState), typeof(LEDTrafficLight), new PropertyMetadata(LEDTrafficLightState.Red));

        // Using a DependencyProperty as the backing store for Time.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty TimeProperty =
            DependencyProperty.Register("DelayTime", typeof(int), typeof(LEDTrafficLight), new PropertyMetadata(0));

        // Using a DependencyProperty as the backing store for TimeYellow.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty YellowTimeProperty =
            DependencyProperty.Register("YellowTime", typeof(int), typeof(LEDTrafficLight), new PropertyMetadata(2));

        // Using a DependencyProperty as the backing store for TimeRed.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty RedTimeProperty =
            DependencyProperty.Register("RedTime", typeof(int), typeof(LEDTrafficLight), new PropertyMetadata(7));

        // Using a DependencyProperty as the backing store for TimeGreen.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty GreenTimeProperty =
            DependencyProperty.Register("GreenTime", typeof(int), typeof(LEDTrafficLight), new PropertyMetadata(7));

        #endregion

        #endregion

        #region Fields & Const & Event

        DispatcherTimer timer = new DispatcherTimer();

        #endregion


        #region Publics Method

        /// <summary>
        /// Inicia el semáforo cuando se encuentra en modo automático
        /// </summary>
        public void Start()
        {
            if (IsManual) return;
            timer.Start();
        }

        /// <summary>
        /// Detiene el semáforo
        /// </summary>
        public void Stop()
        {
            timer.Stop();
        }

        /// <summary>
        /// Cambia el semáforo a rojo
        /// </summary>
        public void OnRed()
        {
            State = LEDTrafficLightState.Red;
        }

        /// <summary>
        /// Cambia el semáforo a verde
        /// </summary>
        public void OnGreen()
        {
            State = LEDTrafficLightState.Green;
        }

        /// <summary>
        /// Cambia el semáforo a amarillo
        /// </summary>
        public void OnYellow()
        {
            State = LEDTrafficLightState.Yellow;
        }

        public void Test()
        {
            throw new NotImplementedException();
        }

        #endregion

        #region Privates methods

        /// <summary>
        /// Cambia el estado del semáforo según el estado anterior
        /// </summary>
        void changingState()
        {
            // Retardo inicial
            if (DelayTime > 0)
            {
                timer.Interval = new TimeSpan(0, 0, (int)DelayTime);
                DelayTime = 0;
                return;
            }

            // Parpadeando
            if (IsFlashingAmberLight)
            {
                if (State.Equals(LEDTrafficLightState.Yellow))
                {
                    State = LEDTrafficLightState.None;
                    timer.Interval = new TimeSpan(0, 0, 0, 0, 500);
                }
                else
                {
                    State = LEDTrafficLightState.Yellow;
                    timer.Interval = new TimeSpan(0, 0, 0, 1);
                }

                return;
            }

            // Cambio de color
            switch (State)
            {
                case LEDTrafficLightState.Red:
                    // SEMÁFORO EN VERDE
                    State = LEDTrafficLightState.Green;
                    
                    timer.Interval = new TimeSpan(0, 0, GreenTime);
                    break;
                case LEDTrafficLightState.Yellow:
                    // SEMÁFORO EN VERDE
                    State = LEDTrafficLightState.Red;
                    timer.Interval = new TimeSpan(0, 0, RedTime);
                    break;
                case LEDTrafficLightState.Green:
                    // SEMÁFORO EN AMBAR
                    State = LEDTrafficLightState.Yellow;
                    timer.Interval = new TimeSpan(0, 0, YellowTime);
                    break;
                default:
                    break;
            }

        }

        private void Timer_Tick(object sender, EventArgs e)
        {
            changingState();
        }

        #endregion
    }
}

Semáforo I

Semáforo I

Vamos a crear un sistema de control de semáforos. Un sistema de control de tráfico, debe coordinar semáforos conforme a la situación geográfica, prioridad de paso, alta circulación y sinfín de factores, en este caso vamos a crear uno sencillo que nos permita cruzar una avenida de una sola vez. Para ello debemos tener un sistema de control y semáforos lógicamente. La mayoría de los semáforos, como de todos es bien sabido, tienen 3 luces, una roja, otra ámbar y otra verde, algunos además tienen control de peatones e indicaciones auxiliares, pero nosotros vamos a crear uno sencillo, con sus tres luces y más adelante ya veremos si ampliamos sus funcionalidades.

Su funcionamiento básico es verde, pasa a amarillo esperando durante unos segundos pasando a rojo finalizando el bucle, vuelve al verde y comienza de nuevo. También puede estar parpadeando.

Pues empezando por lo básico, vamos a crear las luces y como estamos en 2017, vamos a crearlos de LED,s, ya que cambiar el color y añadir un degradado radial no es muy complicado, lo vamos a hacer un poco más difícil o más fácil según se vea.

He usado WPF para crear un control de usuario y dentro de este, he añadido un grid donde voy a distribuir los LED,s dándole un aspecto como el siguiente (el código lo adjunto al final del post)
semaforo01

Además, le he agregado algunas propiedades de dependencia en las que podamos cambiar el color de los LED cuando está encendida la luz, (en este caso yo las he puesto blancas), el color del LED cuando está apagada y el color de fondo cuando están de igual modo apagadas o encendidas. A continuación el código

        #region DependecyProperties

        public bool LightIsEnabled
        {
            get { return (bool)GetValue(LightIsEnabledProperty); }
            set { SetValue(LightIsEnabledProperty, value); }
        }

        public Brush LEDColorON
        {
            get { return (Brush)GetValue(LEDColorONProperty); }
            set { SetValue(LEDColorONProperty, value); }
        }

        public Brush LEDColorOFF
        {
            get { return (Brush)GetValue(LEDColorOFFProperty); }
            set { SetValue(LEDColorOFFProperty, value); }
        }

        public Brush LEDLightBackgroundOFF
        {
            get { return (Brush)GetValue(LEDLightBackgroundProperty); }
            set { SetValue(LEDLightBackgroundProperty, value); }
        }

        public Brush LEDLightBackgroundON
        {
            get { return (Brush)GetValue(LEDLightBackgroundONProperty); }
            set { SetValue(LEDLightBackgroundONProperty, value); }
        }

        // Using a DependencyProperty as the backing store for MyProperty.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty LEDLightBackgroundONProperty =
            DependencyProperty.Register("LEDLightBackgroundON", typeof(Brush), typeof(LEDLight), new PropertyMetadata(Brushes.Lime));

        // Using a DependencyProperty as the backing store for LEDLightBackground.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty LEDLightBackgroundProperty =
            DependencyProperty.Register("LEDLightBackgroundOFF", typeof(Brush), typeof(LEDLight), new PropertyMetadata(Brushes.Silver));

        // Using a DependencyProperty as the backing store for LEDColorOFF.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty LEDColorOFFProperty =
            DependencyProperty.Register("LEDColorOFF", typeof(Brush), typeof(LEDLight), new PropertyMetadata(Brushes.LightGray));

        // Using a DependencyProperty as the backing store for MyProperty.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty LEDColorONProperty =
            DependencyProperty.Register("LEDColorON", typeof(Brush), typeof(LEDLight), new PropertyMetadata(Brushes.White));

        // Using a DependencyProperty as the backing store for ON.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty LightIsEnabledProperty =
            DependencyProperty.Register("LightIsEnabled", typeof(bool), typeof(LEDLight), new PropertyMetadata(false));

        #endregion

Y ¿como se enciende y se apaga? He incluido un par de DataTrigger que comprueban si el valor de la propiedad LightIsEnabled es verdadero y si es así asigna el valor de la propiedad LEDColorON a cada LED y el valor de la propiedad LEDLightBackgroundON al relleno de la ellipse interna. Si al crear una instancia de este, cambiamos esta propiedad, la luz se encenderá o se apagará.
Ahora solo nos queda crear una instancia desde un formulario y ver si funciona

Video5.gif
Fondo de color y LED,s blancos

Video6.gif

Fondo y LED,s de color

y las instancias desde XAML, quedarían así:


y el código del control de usuario. En la próxima entrega el semáforo.

<UserControl x:Class="Controls.LEDLight"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:controls="clr-namespace:Controls"
             mc:Ignorable="d" 
             d:DesignHeight="200" d:DesignWidth="200">
    <Grid x:Name="grid">
        <Grid.Resources>
            <!--ESTILO DE LED-->
            <Style x:Key="ellipseLED" TargetType="Ellipse">
                <Setter Property="Margin" Value="1"/>
                <Setter Property="HorizontalAlignment" Value="Stretch"/>
                <Setter Property="VerticalAlignment" Value="Stretch"/>
                <Setter Property="Fill" Value="{Binding LEDColorOFF}"/>
                <Setter Property="Grid.RowSpan" Value="2"/>
                <Setter Property="Grid.ColumnSpan" Value="2"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding LightIsEnabled}" Value="True">
                        <Setter Property="Fill" Value="{Binding LEDColorON}"/>
                    </DataTrigger>
                    <MultiDataTrigger>
                        <MultiDataTrigger.Conditions>
                            <Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=controls:LEDLight},Path=LEDLightInsideShape}" Value="{x:Static controls:LEDLight+LEDLightInsideShapeEnum.LeftArrow}"/>
                            <Condition Binding="{Binding LightIsEnabled}" Value="True"/>
                        </MultiDataTrigger.Conditions>
                        <Setter Property="Fill" Value="{Binding LEDColorON}"/>
                    </MultiDataTrigger>
                </Style.Triggers>
            </Style>
            <!--ESTILO DEL CIRCULO CENTRAL EXTERIOR-->
            <Style x:Key="centralEllipse" TargetType="Ellipse">
                <Setter Property="Fill" Value="Transparent"/>
                <Setter Property="Stroke" Value="DarkGray"/>
                <Setter Property="StrokeThickness" Value="5"/>
            </Style>
            <!--ESTILO DEL FONDO DEL CIRCULO INTERIOR-->
            <Style x:Key="centralEllipse2" TargetType="Ellipse">
                <Setter Property="Fill" Value="{Binding LEDLightBackgroundOFF}"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding LightIsEnabled}" Value="True">
                        <Setter Property="Fill" Value="{Binding LEDLightBackgroundON}"/>
                    </DataTrigger>
                </Style.Triggers>

            </Style>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="10*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="10*"/>
        </Grid.ColumnDefinitions>
        <!--Ellipse central. INTERIOR-->
        <Ellipse Grid.Row="0" Grid.ColumnSpan="27" Grid.RowSpan="28" Style="{StaticResource  centralEllipse2}"/>

        <!--Linea 0-->
        <Ellipse Grid.Row="1" Grid.Column="8" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="1" Grid.Column="10" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="1" Grid.Column="12" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="1" Grid.Column="14" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="1" Grid.Column="16" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 1-->
        <Ellipse Grid.Row="3" Grid.Column="5" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="3" Grid.Column="7" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="3" Grid.Column="9" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="3" Grid.Column="11" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="3" Grid.Column="13" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="3" Grid.Column="15" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="3" Grid.Column="17" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="3" Grid.Column="19" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 2-->
        <Ellipse Grid.Row="5" Grid.Column="4" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="6" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="8" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="10" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="12" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="14" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="16" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="18" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="5" Grid.Column="20" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 3-->
        <Ellipse Grid.Row="7" Grid.Column="3" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="5" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="7" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="9" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="11" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="13" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="15" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="17" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="19" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="7" Grid.Column="21" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 4-->
        <Ellipse Grid.Row="9" Grid.Column="2" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="4" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="6" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="8" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="10" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="12" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="14" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="16" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="18" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="20" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="9" Grid.Column="22" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 5-->
        <Ellipse Grid.Row="11" Grid.Column="1" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="3" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="5" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="7" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="9" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="11" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="13" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="15" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="17" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="19" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="21" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="11" Grid.Column="23" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 6-->
        <Ellipse Grid.Row="13" Grid.Column="2" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="4" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="6" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="8" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="10" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="12" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="14" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="16" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="18" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="20" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="13" Grid.Column="22" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 7-->
        <Ellipse Grid.Row="15" Grid.Column="1" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="3" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="5" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="7" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="9" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="11" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="13" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="15" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="17" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="19" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="21" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="15" Grid.Column="23" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 8-->
        <Ellipse Grid.Row="17" Grid.Column="2" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="4" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="6" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="8" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="10" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="12" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="14" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="16" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="18" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="20" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="17" Grid.Column="22" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 9-->
        <Ellipse Grid.Row="19" Grid.Column="3" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="5" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="7" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="9" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="11" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="13" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="15" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="17" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="19" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="19" Grid.Column="21" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 10-->
        <Ellipse Grid.Row="21" Grid.Column="4" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="6" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="8" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="10" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="12" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="14" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="16" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="18" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="21" Grid.Column="20" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 11-->
        <Ellipse Grid.Row="23" Grid.Column="5" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="23" Grid.Column="7" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="23" Grid.Column="9" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="23" Grid.Column="11" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="23" Grid.Column="13" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="23" Grid.Column="15" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="23" Grid.Column="17" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="23" Grid.Column="19" Style="{StaticResource ellipseLED}"/>
        
        <!--Linea 12-->
        <Ellipse Grid.Row="25" Grid.Column="8" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="25" Grid.Column="10" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="25" Grid.Column="12" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="25" Grid.Column="14" Style="{StaticResource ellipseLED}"/>
        <Ellipse Grid.Row="25" Grid.Column="16" Style="{StaticResource ellipseLED}"/>
        
        <!--Ellipse central. EXTERIOR-->
        <Ellipse Grid.Row="0" Grid.ColumnSpan="27" Grid.RowSpan="28" Style="{StaticResource centralEllipse}"/>
    </Grid>
</UserControl>