• Saltar al contenido principal
  • Skip to secondary menu
  • Saltar a la barra lateral principal
  • Saltar al pie de página
  • Inicio
  • Secciones
    • Ciencia de datos
    • Criptografía
    • Herramientas
    • Machine Learning
    • Noticias
    • Opinión
    • Productividad
    • Programación
      • JavaScript
      • Julia
      • Matlab
      • Python
      • R
  • Programación
    • JavaScript
    • Julia
    • Matlab
    • Python
    • R
  • Noticias
  • Boletín
  • Contacto
  • Tienda
    • Libros
    • Equipamiento de oficina
    • Equipamiento en movilidad
    • Tiendas afiliadas
      • AliExpress
      • Amazon
      • Banggood
      • GeekBuying
      • Lenovo

Analytics Lane

Ciencia e ingeniería de datos aplicada

  • Ciencia de datos
  • Machine Learning
  • Python
  • Pandas
  • NumPy
  • Matlab
  • Julia
  • Excel
  • IA Generativa

Creación de aplicaciones en Matlab con App Designer

diciembre 5, 2018 Por Daniel Rodríguez 1 comentario
Tiempo de lectura: 5 minutos

En Matlab existen dos entornos con los que es posible crear aplicaciones gráficas Guide y App Designer. El primero de ellos existe en la plataforma desde hace bastantes años y permite crear aplicaciones con facilidad. A partir del año 2016 las diferentes versiones de Matlab incluyen también el segundo de los entornos App Designer. La aparición de este ha supuesto un salto cualitativo en las aplicaciones que se pueden crear con Matlab. A pesar de que en las primeras versiones las aplicaciones creadas con App Designer pecaban de una excesiva lentitud desde su lanzamiento no ha hecho más que crecer en funcionalidad y potencia. Conocer este entorno es importante para los usuarios de Matlab, ya que así pueden crear aplicaciones para otros usuarios. A continuación, se va a explicar como crear aplicaciones en Matlab con App Designer.

Tabla de contenidos

  • 1 El entorno de App Designer
  • 2 Creación de una aplicación básica con App Designer
  • 3 Modificando las propiedades
  • 4 Introducción del código en App Designer
  • 5 Ejecutar código al iniciar la aplicación
  • 6 Lanzamiento de la aplicación
  • 7 Conclusiones

El entorno de App Designer

Antes de poder crear una aplicación con App Designer es necesario abrir el entorno en una sesión de Matlab. Una de las maneras es a través de la barra Home, en esta se ha de desplegar las opciones de New y seleccionar App. Otra opción es desde el terminal, escribiendo simplemente appdesigner. Ambas opciones permiten acceder a la aplicación que se muestra en la siguiente captura de pantalla.

App Designer
App Designer

En la captura de pantalla se puede ver la herramienta. A la izquierda se encuentra el listado de componentes que se pueden utilizar para la creación de una aplicación. En el centro el área de trabajo donde se ha de crear la aplicación. Esta área se puede ver seleccionar entre ver y editar el diseño de la aplicación o el código. La parte superior izquierda de la ventana contiene el navegador de componentes, donde se pueden ver todos los componentes utilizados en la aplicación. Finalmente, en la parte inferior izquierda se pueden ver las propiedades de la componente seleccionada actualmente.

Tutorial de Mypy para Principiantes
En Analytics Lane
Tutorial de Mypy para Principiantes

Publicidad


Creación de una aplicación básica con App Designer

A modo de ejemplo se va a crear una aplicación que permita simular una distribución normal con los parámetros indicados por el usuario. Para ello es necesario arrastrar primero los siguientes componentes al área de trabajo:

  • un Axes para representar el histograma de la distribución,
  • dos Edit Field (Numeric) para obtener los parámetros de la distribución
  • un Slider para indicar el número de datos a simular.

Los datos se pueden ordenar como se muestran en la siguiente captura de pantalla.

Creación de aplicaciones en Matlab con App Designer

En esta se han cambiado los nombres por defecto de las componentes para que sean más indicativos. Para ello solamente es necesario seleccionar el texto con doble click y editar el valor.

Modificando las propiedades

Para mejorar el funcionamiento de la aplicación se pueden configurar las propiedades de las componentes. Como sabemos el parámetro sigma de una distribución normal ha de ser necesariamente positivo. Para evitar que un usuario introduzca un valor negativo se puede seleccionar esta componente. En la parte inferior izquierda de la ventana aparecerá sus propiedades. En esta parte zona de la aplicación se puede ver el valor del campo, por defecto es 0 y se puede indicar 1. Otra propiedad es los valores límite, por defecto son se menos infinito a infinito, pero en nuestro caso solo puede se positivos. Esto se puede arreglar cambiando los límites para que solo admita valores entre 0 e infinito.

Propiedades del campo de edición sigma.

Posteriormente se puede modificar la barra de desplazamiento. En esta nos interesa que el valor por defecto no sea 0 sino que algo como 100, para lo que se ha de cambiar el valor. Al igual que el campo numérico se puede cambiar el rango de valores, en este caso de 0 a 100 puede ser poco, por lo que se puede cambiar de 0 a 1000.

Publicidad


Introducción del código en App Designer

La aplicación está diseñada, pero le falta lo más importante el código que le da funcionalidad. En este caso se quiere que cada vez que el usuario cambie un valor en los campos de edición o en la barra de desplazamiento se simula una distribución con los valores y se muestran en los ejes. Para ello se puede seleccionar el campo de edición mu, ir a las propiedades y seleccionar Callbacks. En esta aparecerá un combo el que ha de seleccionarse <add ValueChangedFcn callback>. De este modo se crear una función en la que se podrá introducir el síguete código.

mu = app.muEditField.Value;
sigma = app.sigmaEditField.Value;
simulations = round(app.SimulacionesSlider.Value);

data = normrnd(mu, sigma, simulations, 1);
            
histogram(app.UIAxes, data);

Este recupera los valores de mu, sigma y el número de simulaciones para hacer una simulación y generar el histograma. Nótese que es necesario redondear el valor de la barra de desplazamiento ya que este es real y no entero.

Ahora se puede utilizar la misma función de callback en el resto de los componentes. Para ello se han de seleccionar y en lugar de crear una función nueva seleccionar la ya existente.

Ejecutar código al iniciar la aplicación

Solamente falta una cosa, al lanzar la aplicación no aparece el histograma. Esto es porque no se ejecuta el ningún código al iniciar la aplicación. Para conseguir que se ejecute se ha de crear una nueva función de callback para la ventana. Esto se puede conseguir seleccionando la ventana y creando un callback para el evento startupFcn. En este se puede llamar a la función definida anteriormente.

app.muEditFieldValueChanged()

Publicidad


Lanzamiento de la aplicación

La aplicación se puede lanzar mediante el comando Run o escribiendo el nombre del archivo en la línea de comando. Si se ha hecho todo bien aparecerá una aplicación como la de la ventana.

Resultado final de la aplicación

Conclusiones

En esta entrada se ha visto el proceso para crear aplicaciones en Matlab con App Designer. Esta es una herramienta que ofrece la posibilidad de presentar el trabajo realizado en Matlab a otros usuarios de una manera más simple y visual. Permitiendo así que usuarios sin conocimiento técnico pueden usar los desarrollos.

El único problema en este momento es que los usuarios han de tener una licencia de Matlab para ejecutar el código. Pero esto se puede solucionar creando aplicaciones independientes en Matlab, para lo que es necesario la toolbox MATLAB Compiler.

Imágenes: Pixabay (rawpixel)

¿Te ha parecido de utilidad el contenido?

¡Puntúalo entre una y cinco estrellas!

Puntuación promedio 5 / 5. Votos emitidos: 3

Ya que has encontrado útil este contenido...

¡Síguenos en redes sociales!

¡Siento que este contenido no te haya sido útil!

¡Déjame mejorar este contenido!

Dime, ¿cómo puedo mejorar este contenido?

Publicidad


Publicaciones relacionadas

  • Tutorial de Mypy para Principiantes
  • Semana sin nuevas publicaciones
  • Combinar gráficos con FacetGrid: Cómo analizar tendencias complejas en múltiples paneles con Seaborn
  • Introducción a igraph en R (Parte 6): Centralidad de Katz en grafos
  • Cómo modificar los mensajes de commit en Git
  • Optimización de memoria en Pandas: Usar tipos de datos personalizados para manejar grandes conjuntos de datos
  • Introducción a igraph en R (Parte 7): Centralidad de Bonacich
  • ¡Analytics Lane cumple siete años!
  • Sincronizar múltiples ejes con twinx(): Comparación de datos con diferentes escalas en un solo gráfico con Matplotlib

Publicado en: Matlab Etiquetado como: App Designer, GUI

Interacciones con los lectores

Comentarios

  1. Jose dice

    mayo 22, 2020 a las 8:29 pm

    Buen articulo!

    Responder

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

I accept the Terms and Conditions and the Privacy Policy

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Barra lateral principal

Suscríbete a nuestro boletín

Suscríbete al boletín semanal para estar al día de todas las publicaciones.

Política de Privacidad

Analytics Lane en redes sociales

  • Amazon
  • Bluesky
  • Facebook
  • GitHub
  • Instagram
  • Mastodon
  • Pinterest
  • RSS
  • Telegram
  • Tumblr
  • Twitter
  • YouTube

Publicidad

Entradas recientes

Variables globales en Python: Problemas y cómo evitarlos

mayo 12, 2025 Por Daniel Rodríguez

Los valores numéricos en los ordenadores: Entendiendo enteros, flotantes y más

mayo 9, 2025 Por Daniel Rodríguez

Introducción a igraph en R (Parte 8): PageRank

mayo 7, 2025 Por Daniel Rodríguez

Publicidad

Es tendencia

  • Cómo funciona k-modes e implementación en Python publicado el octubre 14, 2022 | en Ciencia de datos, Python
  • Ventana principal de NSSM Cómo configurar un servicio en Windows publicado el mayo 11, 2022 | en Herramientas
  • pandas Pandas: Obtener el nombre de las columnas y filas en Pandas publicado el diciembre 7, 2020 | en Python
  • Gráficos de barras en Matplotlib publicado el julio 5, 2022 | en Python
  • Método de Brent e implementación en Python publicado el abril 28, 2023 | en Ciencia de datos

Publicidad

Lo mejor valorado

4.9 (24)

Seleccionar filas y columnas en Pandas con iloc y loc

4.6 (16)

Archivos JSON con Python: lectura y escritura

4.4 (14)

Ordenación de diccionarios en Python mediante clave o valor

4.7 (13)

Operaciones de filtrado de DataFrame con Pandas en base a los valores de las columnas

4.5 (10)

Diferencias entre var y let en JavaScript

Publicidad

Comentarios recientes

  • Daniel Rodríguez en Tutorial de Mypy para Principiantes
  • Javier en Tutorial de Mypy para Principiantes
  • javier en Problemas con listas mutables en Python: Cómo evitar efectos inesperados
  • soldado en Numpy básico: encontrar la posición de un elemento en un Array de Numpy
  • plataformas AéReas en Numpy básico: encontrar la posición de un elemento en un Array de Numpy

Publicidad


Footer

Analytics Lane

  • Acerca de Analytics Lane
  • Boletín de noticias
  • Contacto
  • Libros
  • Lo más popular
  • Noticias
  • Tienda
  • Tiendas afiliadas

Secciones

  • Ciencia de datos
  • Criptografía
  • Herramientas
  • Machine Learning
  • Opinión
  • Productividad
  • Programación
  • Reseñas

Sobre de Analytics Lane

En Analytics Lane tratamos de explicar los principales conceptos de la ciencia e ingeniería de datos con un enfoque práctico. Los principales temas tratados son ciencia de datos, ingeniería de datos, inteligencia artificial, machine learning, deep learning y criptografía. Además, también se habla de los principales lenguajes de programación y herramientas utilizadas por los científicos e ingenieros de datos.

Copyright © 2018-2025 Analytics Lane ·Términos y condiciones ·Política de Cookies ·Política de Privacidad ·Herramientas de privacidad ·Contacto