Ejemplo simple de Listbox en GUIDE de MATLAB 7.0

En el siguiente ejemplo se muestra como agregar un Listbox, introducir nuevos elementos a la lista y desplegar un valor seleccionado de la lista. El código se puede descargar aquí. La explicación paso a paso va como sigue:

Iniciamos tecleando “guide” desde la línea de comandos de MATLAB como se muestra en la siguiente figura:

Y nos mostrará el cuadro de dialogo de GUIDE como se muestra en la imagen siguiente:

Elegimos “Blank GUI (Default)” y presionamos “OK”, dependiendo de la velocidad de la máquina con que estemos trabajando nos mostrará el siguiente cuadro de dialogo… hay que esperar a que se inicialice todo.

Enseguida nos muestra la pantalla principal de GUIDE, que es donde vamos a empezar a agregar controles para hacer nuestra aplicación.

En este punto es bueno grabarlo con un nombre, por si las dudas para si algo, para poderlo estar grabando continuamente. En este caso yo lo nombré: “Ejemplo_ListBox.fig”, automáticamente genera el código “Ejemplo_ListBox.m” en el que vamos a estar trabajando.

A continuación seleccionamos la herramienta “Listbox” y dibujamos la lista en el área de trabajo como se puede observar en la imagen siguiente:

Una vez con el control “Listbox” en el área de trabajo lo siguiente es personalizarlo, para darle un nombre e inicializarlo de requerirse así. Tenemos que dar click izquierdo sobre el control y seleccionar “Property inspector” como se muestra en la imagen siguiente:

Una vez seleccionado “Property Inspector” nos debe aparecer una ventana como se muestra a continuación:

En la imagen anterior se muestran todas las propiedades de nuestro control, para este ejemplo solamente modificaremos los campos de:

1. String: Que es básicamente el texto que aparece en nuestra GUI

2. Tag: Que es el nombre que tiene en nuestra aplicación este objeto

Si lo ejecutamos (Ctrl + T) en este momento, debemos tener una ventana como se muestra a continuación:

Ahora vamos a agregarle un botón para mostrar en un mensaje el texto que tenemos seleccionado en el “Listbox”, yo lo llame “miBoton” y le puse “Mostrar Selección”

Ahora tenemos que agregarle código al botón para que muestre lo que tenemos seleccionado, para eso tenemos que dar click derecho sobre el botón y seleccionar “View Callbacks –> Callback” como se muestra en la imagen siguiente:

La pantalla siguiente nos lleva a nuestro editor y se muestra seleccionado el inicio del callback, notese que el callback es donde agregamos el código de la acción que va a realizar nuestro objeto, en este caso el botón.

Ahora agregamos el siguiente código en el miBoton_Callback:

% --- Executes on button press in miBoton.
function miBoton_Callback(hObject, eventdata, handles)
% hObject    handle to miBoton (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

miTexto = get(handles.miCajaDeLista,'string')  %Obtiene todos los valores de la lista

indice_seleccionado = get(handles.miCajaDeLista,'Value'); %Nos dice que posición esta seleccionada

h = msgbox(miTexto,'¿Qué tenemos?','help')    %Muestra la selección en una caja de texto

El código anterior simplemente muestra la selección en una caja de texto, para mostrar como agregar items en tiempo real a la lista acomodamos el tamaño de la lista y agregamos otro botón para introducir lo que nosotros necesitemos en el “Listbox”, como se muestra en la imagen siguiente:

 

A continuación se muestra el código de Agregar_Listbox_Callback, con este código se agrega un nuevo Item en la lista.

% --- Executes on button press in Agregar_Listbox.
function Agregar_Listbox_Callback(hObject, eventdata, handles)
% hObject    handle to Agregar_Listbox (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)

% Muestra un cuadro de dialogo para introducir un nuevo item en la lista
prompt = {'Nombre'};
dlg_title = 'Agrega un Item a la Lista';
respuesta  = inputdlg(prompt,dlg_title);

% Obtiene todos el contenido de la lista
t = get(handles.miCajaDeLista, 'String');
if ischar(t); t = cellstr(t); end

% Agrega el nuevo Item en la lista
t = [t; respuesta];
% Muestra el nuevo Item en la lista
set(handles.miCajaDeLista, 'String', t);

A continuación se muestra como se ve cuando ejecutamos el GUI y le agregamos un nuevo Item.

Y como se despliega el Item seleccionado en el “Listbox”

Ejemplo simple de una interfaz gráfica usando GUIDE en MATLAB para procesamiento digital de imágenes

Hace poco que aprendí lo básico de crear interfaces gráficas en Matlab. En realidad es hasta cierto punto simple, pero también creo que no es del todo amigable para crear GUIs. Si, estoy de acuerdo que tiene un estilo de editor para hacernos más fácil la existencia. Pero no es del todo intuitivo, o al menos es lo que pienso en el par de programitas que he tenido oportunidad de hacer. Bueno dejando las quejas a un lado, voy a empezar con el ejemplo. Voy a crear una ventana en la que se cargue una imagen por medio de un botón y desplegarla en la ventana, y hacer un procesamiento sencillo y también mostrarlo en pantalla, se que es un ejemplo muy básico, pero creo que es perfecto para empezar. (o al menos es lo que andaba buscando yo cuando quise hacer esto)

Lo primero que tenemos que hacer es iniciar el editor GUIDE que se puede hacer de dos maneras, la primera es desde el menú de inicio: File –> New –> GUI como se muestra en la siguiente imagen.

También se puede iniciar desde la línea de comandos o “command window” de Matlab poniendo “guide”.  Aparece una ventana de inicio del GUIDE.

La ventana anterior es (como su nombre lo indica) el lanzador rápido para el GUIDE con varias opciones, la que vamos a seleccionar es la que viene por default y presionamos “OK” y nos aparece el editor de interfaces gráficas en blanco, como se muestra a continuación:

Como primer paso vamos a insertar el objeto que nos va a servir para desplegar la imagen en la ventana. En este caso Matlab lo maneja con “axes”, así que presionamos el botón que esta en la barra de herramientas de la izquierda y ponemos dos “axes” que es donde vamos a cargar la imagen original y la procesada, como se muestra en la siguiente imagen.

Luego presionando el botón “Push Button” (1) ponemos dos botones (2) que el primero nos va a servir para seleccionar el archivo de la imagen y el segundo para procesarla, también vamos a mostrar donde se seleccionan y se cambian las propiedades del objeto (3).

En la figura siguiente se muestra el inspector de propiedades “property inspector” en donde podemos modificar las propiedades del botón. En el (1)  se modifica el texto del botón, y en (2), se modifica el nombre del botón.

Modificamos (1) y (2) para cada botón de manera que nos quede como en la imagen siguiente.

 

En donde dice String simple y sencillamente cambiamos el texto que tiene el botón y en donde dice tag se define el nombre del botón, esto es importante, porque aquí es donde definimos el nombre que va a tener la función “Callback” que es la que se manda llamar cuando se presiona el botón. En la imagen siguiente se muestra como queda la GUI con los cambios hechos. Tambien se muestra como tener acceso a la función donde vamos a poner el código que nos cargue la imagen en pantalla.

A continuación se abre la ventana del editor de códigos de MATLAB y nos selecciona el inicio de la función en la que debemos agregarle nuestro código que en este ejemplo nos va a seleccionar un archivo para ponerlo en axes1. 

Una vez que tenemos el editor de MATLAB abierto, buscamos el siguiente código y le agregamos la línea de código que se muestra a continuación, lo que se esta haciendo es agregar una variable para almacenar en memoria la imagen que vamos a cargar .

% --- Executes just before GuiBasica is made visible.
function GuiBasica_OpeningFcn(hObject, eventdata, handles, varargin)
% This function has no output args, see OutputFcn.
% hObject    handle to figure
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)
% varargin   command line arguments to GuiBasica (see VARARGIN)

% Choose default command line output for GuiBasica
handles.output = hObject;

%Add variable to hold images (Agregar variable para almacenar imágenes)
handles.myImage = [];

% Update handles structure
guidata(hObject, handles);

La línea que agregué en el código anterior es donde dice handles.myImage = []; que nos va a servir para almacenar la imagen temporalmente para procesarla cuando tengamos que hacerlo en el botón que definimos para procesar la imagen.

El código siguiente se agrega en el callback del botón CargarImagen.

% --- Executes on button press in CargarImagen.
function CargarImagen_Callback(hObject, eventdata, handles)
% hObject    handle to CargarImagen (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)
try
    [filename,pathname] = uigetfile('*.pgm','Selecciona imagen para abrir');

    if isequal(filename,0)
        %Do nothing yet
    else
        handles.myImage = imread(fullfile(pathname, filename));

        [X, myMap] = gray2ind(handles.myImage);
        mImagen2 = ind2rgb(X,myMap);

        image(mImagen2, 'Parent', handles.axes1);
        colormap(gray);
    end
    guidata(hObject, handles);
catch
    msgbox('Error')
end

Y agregando el código siguiente al callback del botón ProcesarImagen como se muestra a continuación hacemos nuestro ejemplo de procesamiento, aquí solamente voy a hacer el negativo de la imagen para ilustrar el ejemplo con algo simple, en este caso se pretende mostrar como hacer un GUI en MATLAB, no dar una clase de procesamiento de imágenes.

% --- Executes on button press in ProcesarImagen.
function ProcesarImagen_Callback(hObject, eventdata, handles)
% hObject    handle to ProcesarImagen (see GCBO)
% eventdata  reserved - to be defined in a future version of MATLAB
% handles    structure with handles and user data (see GUIDATA)
    guidata(hObject, handles);
    mImage = handles.myImage;   
    mImage2 = 255-mImage;
    [X, myMap] = gray2ind(mImage2);
    mImagen2 = ind2rgb(X,myMap);

    image(mImagen2, 'Parent', handles.axes2);

Y a continuación se muestra como queda el resultado final de nuestra GUI.

Si todo se ha hecho como se indica, debería de funcionar. jeje. En caso de que me falte un paso o que algo no se entienda solo manden un correo y trataré de corregirlo. gustavo.ramirez.v@gmail.com