¿Cómo se hace el front-end del software que no es del sitio web?

Tenga en cuenta que el navegador, que aloja HTML para una descripción de alto nivel de las interfaces, es de hecho una aplicación de escritorio.

Hay muchas capas de un navegador. Pero, su pregunta se refiere a diferentes dispositivos.

OKAY. Alguien mencionó que podría hacer versiones del navegador para hacer aplicaciones de escritorio, o incluso en algunos dispositivos. Esto es verdad. Algunos de los dispositivos pequeños son tan potentes en estos días, que el pequeño dispositivo que se puede sostener en la mano es equivalente a los sistemas de escritorio que se fabricaron hace solo unos años.

Pero, solo decir que hay herramientas para usar no responde a su pregunta. Todas las herramientas mencionadas tienen varias capas antes de llegar al punto en el que está trabajando en el dispositivo gráfico.

En sistemas operativos como Linux / Unix o Windows, el último punto de entrada al dispositivo de gráficos en el nivel de aplicación del usuario es una llamada a subrutinas que interactúan con un controlador de gráficos. El controlador se ejecuta cuando se ejecuta el sistema operativo. Y, selecciona su próxima tarea, que puede indicarle que establezca un píxel particular en el dispositivo gráfico.

Algunos sistemas integrados no tendrán el lujo de proporcionar controladores. El software tiene que hablar directamente con el dispositivo gráfico. Y, si escribe el controlador para sistemas operativos más grandes, el software debe escribir directamente en el dispositivo gráfico.

Entonces, llega al final de la pila de software, hay llamadas al código que puede enviar un marco de instrucciones a un dispositivo gráfico. Es posible que pueda establecer la coordenada x, y del píxel y luego establecer las propiedades de un píxel. Puede tomar un bloque de bits y una región de dibujo. Por ejemplo, en el controlador, el código puede escribir una palabra de comando en una dirección de dispositivo en particular, que está conectada a un registro en el dispositivo gráfico. Luego, otra instrucción de código podría escribir datos para el comando en un puerto para una cola de datos o búfer. Un comando final puede finalizar la operación o indicar el final de los datos. El, el hardware hará lo suyo.

El dispositivo podría saber algo sobre las capas de polígonos. Pero. entonces podría no ser así, y todos los gráficos dibujados, todo el texto renderizado y cualquier otra cosa tienen que establecerse píxel por píxel. El software haría un seguimiento de la lógica de la representación que el dispositivo no puede seguir.

Aquí hay un enlace, elegido casi al azar en el hardware de gráficos: Cómo funciona: Hardware de gráficos | NotebookReview.com

Los dispositivos pueden ser bastante sofisticados. Pero, el software tiene que tomar el relevo. Además, el software puede tener que normalizarse en todos los dispositivos. Sin embargo, puede ser que para ciertos contratos, como los de las líneas aéreas, se use un dispositivo en particular y el software sea muy personalizado para ese dispositivo. Pero, la mayoría de las compañías proveedoras de software de gráficos tratarían de hacer que el software sea útil para muchas compañías. Entonces, si la empresa no utiliza un estándar, intentará crear uno internamente.

Por supuesto, hay consolas de caracteres programadas de manera muy simple que llevarán caracteres a través de un RS-232 o USB. Puede encontrarlos en kits de inicio de hardware, por ejemplo, para Arduino o BeagleBone Black. Estas áreas en realidad son conjuntos de caracteres cableados (o al menos segmentos de caracteres están cableados, por ejemplo, en una pantalla LCD, donde puede ver esos caracteres de bloque con líneas cortas con solo algunas orientaciones). Estos tipos de dispositivos aceptarán el carácter e iluminarán los segmentos para ese carácter según lo determine su diseño lógico.

Una vez que la forma en que se escribe la información en el hardware de gráficos se establece firmemente, la otra capa de software controlará la calidad de la representación y controlará la disposición de las formas.

Por lo tanto, la mayoría del software de gráficos tiene una biblioteca de representación en alguna parte. Para muchos dispositivos integrados, esto puede ser tan simple como la salida de línea de caracteres. Pero, para el software de nivel de espacio de usuario más complicado, que incluye las aplicaciones, el software de ventanas alojado por un sistema operativo moderno, etc., el software de representación será el software de representación que puede ser una biblioteca cuidadosamente mantenida.

Google Chrome y QT pueden hacer uso de la misma biblioteca de renderizado. Es decir, hay una biblioteca de representación multiplataforma que tiene un back-end expuesto por un sistema operativo. La biblioteca intenta normalizarse a través del sistema operativo. Mire Cairo, Skia, Direct2D, etc. Skia -> Documentos o aquí Biblioteca de gráficos – Wikipedia. Muchas de estas bibliotecas abordan la traducción de gráficos vectoriales a gráficos ráster. O bien, pueden preparar especialmente gráficos de trama teniendo en cuenta ciertos filtros, tramado, gradientes, etc.

Hay mucho en este tema. Entonces, para hacer esto bien, la escritura debería tomar más tiempo del que le estoy dando. Fácilmente podría juzgar cada párrafo aquí como algo para ser reescrito e investigado mejor. Pero para su preocupación, la gran pregunta puede ser dónde desea enfocarse en el gran esquema de todos estos dispositivos y tipos de software de control.

Gracias por hacer esta interesante pregunta. Llego tarde al programa, pero no miraré las respuestas que ya se dieron … 🙂

Básicamente, hay dos formas de hacer esto.

Una es usar los recursos proporcionados por el sistema operativo. Por ejemplo, en la programación de Windows, puede codificar en C y llamar a la API Win32 para crear ventanas, luego agregarles componentes en lugares determinados y luego describir el comportamiento de estos componentes: por ejemplo. Cuando marca una casilla de verificación, el sistema puede llamar a una función registrada para permitirle reaccionar ante la acción. Esa es probablemente también la forma de codificar interfaces de dispositivos de bajo nivel.

Este método tiene algunos inconvenientes: primero, depende totalmente del sistema. Si codificó para Windows y desea portar a Linux o MacOS, debe reescribir la interfaz. En segundo lugar, es de nivel bastante bajo: debe especificar el tamaño y la posición de cada componente, y si cambia el tamaño de una ventana y desea utilizar el nuevo espacio, debe cambiar la posición y el tamaño de cada componente …

Algunos marcos / bibliotecas se han desarrollado para hacer frente a la complejidad: Microsoft creó MFC, por ejemplo, para una codificación más fácil en C ++. Hubo otros, como VCL, etc. Hoy, eso es WinForms o similar, perdí el rastro cuando cambiaron a C #.

Pero estos todavía están vinculados a un sistema operativo.

Hay algunas bibliotecas que permiten crear una interfaz de usuario (UI) que funciona en todos los sistemas. En el dominio, hay dos escuelas:

  • Aquellos con aspecto nativo, como Qt o SWT en el ámbito de Java. Ventaja: utilizan los componentes reales, envueltos por la interfaz del kit de herramientas para ofrecer las mismas funciones en todas partes. Por lo tanto, se ven y realizan exactamente cómo se utilizan las personas. Inconvenientes: son más difíciles de personalizar, y alguien que usa el mismo software en varios sistemas operativos tiene una interfaz diferente cada vez. Y algunas características avanzadas para un sistema operativo pueden no estar disponibles.
  • Aquellos con su propio aspecto, a menudo dibujando los componentes sobre algún tipo de lienzo (y reaccionando a los clics de los usuarios y las pulsaciones de teclas, por supuesto). Ventaja: son consistentes en todos los sistemas, tienen su propio aspecto, que puede personalizarse. Inconveniencia: ¡se ven ajenos a las personas acostumbradas a los componentes nativos! Y en algún momento, pueden ser menos pulidos. En el dominio, tiene GTK + o Swing (ahora JavaFX) para Java.

Mencioné solo algunas de estas bibliotecas, hay muchas otras: WxWidget es un ejemplo bien conocido, el kit de herramientas de Fox es otro.

Solo para proporcionar un contrapunto divertido a las otras respuestas aquí, también puede usar HTML, CSS y Javascript para crear aplicaciones de escritorio y móviles utilizando marcos de aplicaciones como Electron y Cordova / PhoneGap …

Estas aplicaciones envuelven su aplicación HTML en un contenedor que se ejecuta como si fuera una aplicación nativa en el sistema operativo de destino y proporcionan API de Javascript para permitirle controlar cosas como el tamaño y la creación de ventanas, menús de aplicaciones y otros comportamientos específicos del sistema operativo. Internamente, la ventana es básicamente un marco de navegador web que usa los motores Webkit o Blink.

Por lo general, existen algunas compensaciones y limitaciones a este enfoque, aunque el muy popular y poderoso IDE desarrollador de Atom es una aplicación Electron, pero las aplicaciones más comunes podrían implementarse fácilmente de esta manera, y puede ser una forma muy rápida de obtener un La aplicación multiplataforma se basa en las habilidades comúnmente disponibles.

ReactNative tiene un enfoque diferente. Todavía codifica en Javascript y JSX (similar a HTML), pero en lugar de que su código web se ejecute en un motor de navegador en la plataforma de destino, se compila en el código de marco nativo para una mayor eficiencia.

Depende del sistema operativo.

Cada sistema operativo tiene una API que proporciona funciones de bajo nivel, como la creación de ventanas, el manejo de eventos y demás. Estos son (para los principales sistemas operativos de escritorio):

  • Linux: API de Linux “espacio de usuario kernel”
  • Windows: API de Windows (WinAPI)
  • OS X / iOS: Cocoa

Sin embargo, estas API son de muy bajo nivel (excepto Cocoa) y requieren que codifique manualmente cada botón, imagen y todo en su aplicación.

Puedes notar algo. ¿Cómo pueden ciertas aplicaciones ser multiplataforma si la API es diferente en todas las plataformas?

El enfoque común es utilizar una biblioteca multiplataforma, como Qt (para C ++). Estas bibliotecas tienen su propia API que escribieron y que satisface sus necesidades, pero las funciones son diferentes en cada plataforma de manera que logran la misma funcionalidad. De esta manera, debe escribir la API para cada plataforma que desee admitir, pero solo tiene que escribir las aplicaciones una vez.

Para Qt, también está el Qt Creator con una interfaz gráfica donde puedes colocar tus widgets. Sin embargo, esto es para programar en C ++.

Si solo desea programar para Windows y desea una aplicación GUI, la forma más común sería escribir una aplicación .NET usando C # o Visual Basic. El IDE para estos idiomas también tiene una interfaz gráfica.

El equivalente multiplataforma de esto sería usar Java, y usar JFC o Swing.

Los refrigeradores y otros sistemas embebidos son una historia completamente diferente. Esos básicamente tienen sistemas operativos muy especializados o ningún sistema operativo, por lo que para escribir esos softwares, tendrías que programar en C y ensamblado. A veces C ++, pero C está un poco más cerca del hardware.

TL; DR:

Hay muchas formas de crear una aplicación de escritorio. Tienes que elegir entre muchas bibliotecas e idiomas. Uno elegiría principalmente en qué tiene experiencia.

Existen diversas tecnologías y marcos para desarrollar una interfaz de usuario para software de escritorio. Realmente depende del marco y la tecnología que uno esté usando.

Por ejemplo,

Para las aplicaciones .net, hay Winforms y WPF. Para C ++, uno tiene MFC, Windows SDK, QT. Para Mac, tienes Cocoa. Luego está Tkl. Existen múltiples marcos de IU para Java.

Elaboraré esta respuesta en algún momento.

Cada plataforma tendrá una forma diferente de hacerlo. En el escritorio, hay opciones como Java (JavaFX) o C ++ (Qt) o Python (PySide). En dispositivos móviles, hay Android y Java, o iOS y Objective-C.

Android y Java se pueden usar para muchas aplicaciones integradas. También puede Smalltalk.

Pensaría en cualquier idioma en el que estén escribiendo. Al menos para programas Java. En Java puede iniciar una aplicación con botones, un cursor y una entrada, solo tiene que proporcionar una imagen o dos.

Otras aplicaciones deberían ser similares. Asigne un comando determinado para que se active cuando se haga clic en un botón determinado y ya tenga los conceptos básicos de la interfaz de usuario para su programa

También hay administradores de interfaz para eso: al igual que lo que son las formas y CSS para HTML, Tkinter y xWidgets son para otros lenguajes (python en este caso).

Depende de la plataforma. En Windows podría ser QT o con más probabilidad WPF

En Linux, QT, GTK