¿Mejor entorno para desarrollo de la interface gráfica?

[ariznaf]

Soy nuevo en python, aunque no en programación en general.

No estoy seguro de si este tema debería ir en desarrollo web, pero como no me cierro a la posibilidad de desarrollarlo únicamente como aplicación de escritorio, por eso lo he puesto aquí.

Pero el tema del desarrollo de la parte gráfica siempre se me ha atrangantado bastante.
No tanto la parte de la lógica de la interface, si no el conseguir que la apariencia sea la abuscada, los widgets se ajusten y comporten en la ventana como deseo...

Estoy empezando a desarrollar un programa para el diseño de sostenimiento en túneles (que pondré en github en cuanto la tenga un poco pulida, en una versión alfa o prealfa).
Llevará una interface gráfica sencilla con unos paneles para la entrada de datos, una parte central para las gráficas que querría organizar en tabs al estilo del excel para seleccionar las gráficas con las que se trabaja en cada momento.

Tengo que decidir la librería de widgets a utilizar.
En principio estaba pensando en tinker que parecía más o menos sencilla.

Pero me interesaría también que el programa pudiera correr en un navegador.

Ultilizar python en servidor no me convencía porque me exigiría mantener un servidor para únicamente poner el programa a disposicón, y pelearme con javascript para la parte cliente: demasiado complejo.
Además me gustaría poder albergarla en un servidor estático como github.

Leí entonces sobre pyscript, que parece ser justo lo que necesitaría: una librería que permite que la máquina virtual de python se ejecute en el navegador del cliente y todo el código python también pudiendo acceder a los recursos locales.

Eso es justo lo que buscaba, pues la aplicación no tendría una parte servidor, en realidad sería más bien para que el usuario pudiera ejecutarlo en el navegador sin tener que descargar ni instalar nada, pero si necesidad de almacenar nada en el servidor.


Hasta ahí todo maravilloso, una vez configuradas las cuatro cosas iniciales, tienes la aplicación corriendo en el navegador y de forma similar a una aplicación python de escritorio.

Primera cuestión ¿Está pyscript lo suficientemente desarrollado y maduro como para poder usarlo en una aplicación con interface en html no muy compleja?

Pero llega la segunda parte: la interface gráfica.

Sin tener un frameword adicional toda la interface habría que hacerla completamente en html5 y CSS puros, y eso no son mi fuerte.

Puedo pelearme con los tipos de elementos de html, y con los métodos para eventos y demás, pero desarrollar las hojas de estilo y demás para que la interface se comporte adecuadamente no estaría a mi alcance.

Por ello necesitaría un framework adecuado que se encargue de todos los detalles y yo simplemente ajustar lo que pueda ir necesitando.

Y ahora la segunda ¿Qué framework sería adecuado y de manejo sencillo para pyscript? ¿Bootstrap o material framwork?

Y por último, para el diseño de la interface y creación de las páginas html estaría bien poder disponer de un diseñador gráfico donde puedas hacer el prototipado y establecer las propiedades, a dónde ha de anclarse cada elemento, etc.

¿Qué herramienta de prototipado html5 hay disponible (gratuita u opensource)?

[Francisco]

Hola, Fernando.

Supongo que si la aplicación no es demasiado compleja, vas a poder realizar todo con pyscript + HTML y desplegarlo como un sitio estático. En ese caso, Bootstrap es una buena opción ya que tiene mucha documentación y una gran adopción. Si la interfaz fuera demasiado compleja, tal vez te convendría considerar algún framework más establecido como React, Angular, Vue, etc.

Si la opción de escritorio no está descartada, Tkinter te va a venir muy bien. O si querés tener todo tipo de opciones de personalización de la interfaz y herramientas más avanzadas, también podes usar PyQt o PySide.

Saludos

[ariznaf]

Muchas gracias.
No, la aplicación no es muy compleja ni tiene una interface sofisticada en exceso.

Se trata de una aplicación para el cálculo de convergencia del sostenimiento de túneles, que genera una serie de gráficas en matplotlib.

Pretendo hacer una aplicación para que los alumnos puedan investigar con ella de forma rápida la influencia de los parámetros.
Luego ya pretendo usarla también para ayudarme en investigar sobre la optimización del sostenimiento y poder generar los resultados gráficos para representar visualmente las diferentes opciones de sostenimiento.

El que sea de navegador no es imprescindible, pero sí ayudaría bastante a darle más visibilidad y poder usarla en el aula fácilmente (si la tengo puesta en github por ejemplo).
Por eso el requisito sería que en el servidor no tuviera que ejecutar nada, no me puedo permitir mantener un servidor online, porque no tendré ni ayuda económica ni ayuda en su mantenimiento técnico, aquí todo el mundo se llena la boca con la transformación digital y la enseñanza 2.0 pero a la hora de la verdad lo que quieras hacer tendrá que ser por tu cuenta.

El pyscript tiene buena pinta y creo que podría ser más que suficiente por el tema de velocidad y demás (si es mínimamente estable) pero el problema es que parece que se basa aún en un desarrollo completamente en html, donde lo tienes que hacer tú todo y yo no tengo sulficiente conocimiento de html como para eso.
No me veo peleándome con las hojas de estilo, el código html y diseñando las planltillas de colores, fuentes y demás-
Por eso buscaba algo un poco más cocinado.

Me prodría ser más que suficiente un programa que me ayude a hacer del prototipado de forma interactiva y me generara plantillas html que ya pudiera yo luego adaptar para introducir los hooks de pyscript.

He visto algo como el remi (no me encantan los widgets pero podrían servir) pero no sé si sirve porque los widgets están pensados para correr en el servidor y generar el html interactivo en el cliente, aunque sea un cliente local, sería más para desarrollar una aplicación de cliente en html (que imagino que luego se puede empaquetar con un navegador para distribuirla). No sé si se puede integrar con pyscript que descarga la máquina virtual y corre en el propio navegador.

También he visto los jupyter widgets, que sí utilizan algo al estilo pyscript, pero parece que están muy ligados a jupyterlabs y no sé si funcionan sólo con el pyscript.

Los widgets bootstrap se podrían usar únicamente del lado cliente, sin necesitar un servidor que interaccione con ellos, para ejecutar un programa sólo del lado cliente?

Como ves ando bastante perdido, son muchas cosas y muchas novedades para alguien que se quedó en el diseño de interface en C# y que nunca se llevó demasiado bien con esto de las interfaces gráficas (no soy programador).

He estado intentando un poco hacer el prototipo con wxwidgets. Tengo algo que funciona, pero no consigo que se adapte bien a los cambios de tamaño ni ajustar bien los tamaños, y es codigo C++ en su base (lo que complica las cosas) y algo antiguo. Puestos a aprender igual mejor algo moderno que no sea muy complejo.

Lo que me gusta de wxwidgets es que tiene un IDE para el diseño de la interface y te genera el código, lo que viene muy bien cuando empiezas, al menos.

Esta es la forma que tendría un poco la interface, que como ves no es muy compleja, tres zonas izda de entrada de datos, centro visualización de gráficas con algunos tabs, derecha para seleccionar lo que se ve en las gráficas.
En La izda tres paneles de entrada de datos colapsables para cada uno de los tres apartados, el de arriba con dos tabs para meter los datos de dos formas diferentes.

[ariznaf]

He encontrado información acerca de shiny y shinywidgets. (https://shiny.posit.co/py/index.html)

Funciona también con R, parece una colección de widgets sencilla de utilizar para crear aplicaciones web, en principio siguiendo modelo cliente servidor.
Lo puedes correr localmente con un servidor web local y un navegador o utilizar un servidor web en internet.


Pero tiene también un módulo llamado shinylive que permite ejecutar todo el código en el navegador web, utilizando un servidor web que sirva únicamente páginas.

Utiliza para ello pydiode y webassembly. Creo que es justo lo que buscaba y algo análogo a pyscript pero con la ventaja de incluir una serie de widgets que facilitan mucho el desarrollo de la aplicación sin tener que pelearse con crear a bajo nivel componentes web html.

Combinado con quarto que aún simplifica más el desarrollo de la aplicación utilizando un fichero markdwon .qmd, creo que podría ser ideal para lo que buscaba.

Según entiendo podría ejecutar la aplicación desde un navegador con la aplicación desplegada en github y también generar la aplicación cliente/servidor y usar un empaquetador para distribuirla como un exe descargable y que se pudiera ejecutar en local sin andar instalando python u otras cosas.

¿Alguien lo conoce o lo ha probado?

[Costero]

Yo no lo conozco parece muy bueno.

Yo uso este que es muy parecido.

https://panel.holoviz.org/index.html

Tambien puedes utilizar Notebook o Editor.

Aqui uno de los ejemplos escrito en Editor. Claro tienes que tener instalado las siguients librerias:

panel
hvplot
pandas

Código:

import panel as pn
import hvplot.pandas
import pandas as pd
import numpy as np

pn.extension(design='material')

csv_file = (
    "https://raw.githubusercontent.com/holoviz/panel/main/examples/assets/occupancy.csv")
data = pd.read_csv(csv_file, parse_dates=["date"], index_col="date")

print(data.head())


def transform_data(variable, window, sigma):
    ''' Calculates the rolling average and the outliers '''
    avg = data[variable].rolling(window=window).mean()
    residual = data[variable] - avg
    std = residual.rolling(window=window).std()
    outliers = np.abs(residual) > std * sigma
    return avg, avg[outliers]


def create_plot(variable="Temperature", window=30, sigma=10):
    ''' Plots the rolling average and the outliers '''
    avg, highlight = transform_data(variable, window, sigma)
    return avg.hvplot(height=300, width=400, legend=False) * highlight.hvplot.scatter(
        color="orange", padding=0.1, legend=False
    )


variable_widget = pn.widgets.Select(
    name="variable", value="Temperature", options=list(data.columns))
window_widget = pn.widgets.IntSlider(name="window", value=30, start=1, end=60)
sigma_widget = pn.widgets.IntSlider(name="sigma", value=10, start=0, end=20)


bound_plot = pn.bind(create_plot, variable=variable_widget,
                     window=window_widget, sigma=sigma_widget)


first_app = pn.Column(variable_widget, window_widget, sigma_widget, bound_plot)

first_app.servable()

Para correr el programa, abres un command prompt vas a donde se encuentra la app.py is escribes:


panel serve app.py --autoreload --show

[Francisco]

Hay que tener en cuenta que en estos casos necesitás un servidor para correr el backend de tu aplicación.

Parece que con PyScript es posible correr librerías de visualización de datos también: https://www.makeuseof.com/pyscript-pytho...tions-web/

[Costero]

Al correr algo como, por ejemplo:

panel serve app.py --autoreload --show

La computadora se convierte en servidor.

Si la IP de la computadora es por ejemplo: 192.168.2.456 o se llama 'profesor-mc', y los alumnos estan en el mismo network/wifi, todo lo que tienen hacer los alumnos es apuntar su navegador a:

http://192.168.2.456:5006/app

o

http://profesor-mc:5006/app

Sal2