Ejercicios con Velneo


([N3] pacosatu) #81

Hola.

El acceso a los ejercicios ha cambiado de ubicación, ahora está en París.

vatp://pruebas:pruebas@c3.velneo.com:10180/0PS_Varios_iapp

Saludos
Paco Satué


([N4] arturomiranda) #82

Hola Paco,

en que servidor estan estos ejemplos de QML?

saludos


([N3] pacosatu) #83

Hola arturomiranda

Ejecuta la aplicación vatp://pruebas:pruebas@c3.velneo.com:10180/0PS_Varios_iapp y seleciona la opción del menú Editor de código QML.

Ten en cuenta que el código QML se ejecuta en un formulario Sin Origen por lo que los ListModels debes definirlos previamente.
Son ejercicios básicos para ilustrar algunas de las funcionalidades disponibles con QML 2.0.

Saludos
Paco Satué


([N3] pacosatu) #84

Hola.

He añadido algunos ejercicios sencillos de gráficos con QML y QtChart 2.x.

¿Por qué usar QML si disponemos del objeto nativo Gráfico de Velneo?

Yo veo varias razones:

  • Personalización mucha más extensa en QML.
  • Construcción totalmente dinámica de los Gráficos en tiempo de ejecución.
  • Posibilidad de guardar en disco la imagen con el gráfico personalizado e incorporarla a vReport para su impresión.
  • Gestión de datos en otros formatos (csv, json, xml, …) que provienen de otras fuentes diferentes a las tablas en disco de vServer.
  • Eventos de ratón sobre los gráficos.

Por supuesto la preferencia es el gráfico lifeIsSoft nativo.
Esperemos mientras tanto a las novedades en este campo de la versión 23.

Saludos
Paco Satué


([N3] pacosatu) #85

Hola.

Más código QML para practicar.
Esta vez un “Selector de Fecha” mediante 3 listas: Año, Mes y Dia

En el ejercicio veréis Listas de tipo PathView, gestión del focus para la navegación con teclado y el uso de Componentes para personalizar los objetos de manera sencilla.

Buscar la rama “Tipos QML de QtQuick” y el ejercicio “Calendario - Selector Fecha”

Se puede probar en móviles con la aplicación:
vatp://pruebas:pruebas@c6.velneo.com:16400/0PS_Rotulo_LED_iapp

Saludos
Paco Satué


([N4] franpino) #86

Hay algún nuevo acceso directo, no me conecta.

Un saludo


([N4] franpino) #87

Vale ya lo he conseguido, la dirección que buscaba estaba más arriba.

Gracias


([N1] gorkam) #88

Hola Paco,
Debido a los problemas de compatibilidad en iOS y en android del visor HTML de velneo, he implementado un navegador web QML, usando un formulario QML (y el script que importa QtWebView 1.0 y QtQuick 2.0, y QtQuick.Window 2.0) con el que consigo uno de los objetivos: un navegador web multiplataforma para mostrar correos y demás.
La duda viene cuando quiero conseguir con QML algo similar al editor de texto enriquecido que tienes en los ejercicios que has compartido, que usa un visor HTML con ckeditor.
¿Sabes cómo usar ckeditor o algo del estilo con un formulario QML/navegador como el que te comento?
He intentado de la misma forma que hacía con el visor HTML pero con QML no muestra la edición.

Un saludo.


([N3] pacosatu) #89

Hola gorkam.

No hay ningún problema para que te funcione CKEDITOR en el control WebView.
La misma página HTML que cargas en el Visor HTML funcionará tal cual en el visor WebView de QML.

Debes tener cuidado con los Paths por defecto para las librerías JS y otros recursos.

Lo de navegador mutiplataforma de momento no es posible ya que en iOS no funciona tampoco el control WebView.

Tienes un ejercicio de ejemplo en la rama:
Tipos QML de WebView/WebEngine >> QtWebView - Editor Texto.

Saludos
Paco Satué


([N1] gorkam) #90

Buenas Paco, perdona por la tardanza en responder, no había tenido tiempo de echarle un ojo.
Muchísimas gracias por la respuesta, me ha ayudado bastante a aclararme. He conseguido tirar de ckeditor en el WebView del formulario QML.
Lo estoy haciendo generando el fichero html en disco y enlazándolo al webview. Anteriormente con el “visor html” de velneo había un truquillo que funcionaba para no tener que crear el html físico, se le pasaba el código html a través de un manejador de evento con este código javascript
var visor_html = theRoot.dataView().control(“VISOR_HTML”);
var cod_editor = theRoot.varToString(“COD_EDIT_HTML”);
visor_html.setSourceCode(cod_editor, “file:///”+theRoot.clientCachePath);

Con el formulario QML y el webview no ha habido forma, ¿sabrías cómo conseguir algo así?

Saludos.


([N3] pacosatu) #91

Hola gorkam.

Me alegro que vayas avanzando.
En la rama Tipos QML de WebView/WebEngine tienes el ejemplo QtWebView - Editor Texto.

Ahí verás que al final del código defino una variable “html” que contiene el código HTML para mostrar en el objeto WebView. Esta variable la puedes alimentar desde Velneo de la forma habitual (theRoot.varToString(“HTML”).

Saludos
Paco Satué


([N1] gorkam) #92

Gracias Paco, la variable supongo que te refieres a “property string html:”
Lo que me interesaría es que esa variable estuviera vacía de partida a diferencia de tu ejemplo y rellenarla con una variable que tengo en velneo con todo el código html luego.
He intentado dejar al final solo la línea de property string html: en el script qml del webview y luego hacer en javascript theRoot.varToString(“html”) = theRoot.varToString(“COD_EDIT_HTML”); pero no tira.
Investigaré un poco más, de momento cómo enlazar unas cosas con otras me pierde bastante. De todas formas como te digo es un poco rizar el rizo y curiosidad, porque generando un archivo .htm en disco sí lo consigo.


([N3] pacosatu) #93

Hola gorkam.

La asignación en QML de una variable deberás hacerlo en un evento y con una asignación javascript.
Por ejemplo: Component.onCompleted: { html = theRoot.varToString(“COD_EDIT_HTML”) }

En los ejercicios por supuesto no está el código optimizado y procuro mostrar todo el código en una sola pantalla para entenderlo mejor.
La opción de crear el HTML en disco es una buena opción y funciona bastante bien.

QML está muy bien pero a veces la integración con Velneo nativo da mucha lata.
Esto es debido a que QML está metido en el ecosistema de Velneo con “calzador” y tendremos múltiples problemas con la integración de nuestros módulos en los formularios nativos. QML es asíncrono, no se entera de los eventos de Velneo y tiene un paso de Variables anacrónico.

Saludos
Paco Satué


([N1] gorkam) #94

Perfecto, le echaré un ojo a ese tipo de asignación del html en ejecución.
Los ejemplos son muy completos la verdad, lo que pasa es que es inevitable que parezca un mundo cuando se ve tanto engranaje de golpe si no se está rodado. Controlo otros lenguajes pero con velneo llevo poco y QML es totalmente nuevo para mí.

Muchas gracias de nuevo y saludos.