Velneo con estilo


([N1] Giuseppe::Komenco) #1

A quien le pueda interesar.

Velneo con estilo (I)

Un saludo.


(inigonz) #2

Muy interesante Giuseppe, muchas gracias.


([N4] mperez) #3

Gracias Giuseppe


([N2] gegeo) #4

Enlaces de interes:

Qt 4.5.3: Qt Style Sheets
Qt 4.5.3: Qt Style Sheets Reference
Qt 4.5.3: Qt Style Sheets Examples
Qt 4.5.3: Qt´s Classes
Qt 4.5.3: Qt´s Main Classes

Saludos


([N2] bannu) #5

Experimento sin terminar: http://www.bitcodesoft.com/player/vplayer.html

Todo está realizado con los Style Sheets de QT, los botones las rejillas las toolbars, se le puede
aplicar a todos los objetos excepto al dial y a la rueda, además los gráficos se guardan fuera del map
de velneo, de esta forma se pueden crear skins para nuestras aplicaciones, y resulta más cómodo y rápido
asignar un gráfico a un objeto que desde el propio entorno de desarrollo.

[attachment=15857,1304]


([N4] Infortic) #6

Muchas gracias, es muy interesante.
Un saludo.


([N1] Rafael) #7

Hola Sonovisión.

Todos los elementos de la aplicación están hechos con Velneo?, El reproductor, el pinch?, dónde está el título del formulario y el pie?

Saludos
Miguel D.


([N1] Rafael) #8

Por cierto, ¿Se peude asignar una apariencia distinta a cada elemento de un formulario. me refiero a que, si por ejemplo tengo 4 edit, si es posible tener uno en cada color o la apariencia debe asignarse a todos por igual


([N2] gegeo) #9

@ rzaragoza.dinacom

Si, mediante instrucción Interfaz: Establecer hoja estilo ( ELEMENTO, formato) en el ON_INIT del formulario que te interesa.

Lo que no he probado es si lo hace aún teniendo un CSS cargado previamente en el AUTOEXEC.

Yo he probado en los EDIT que tengo inactivos, y si me da el formato que creo en el ON_INIT de un formulario, aunque en el AUTOEXEC tengo un formato generico para todos los EDIT.

Saludos


([N2] gegeo) #10

@ rzaragoza.dinacom

Confirmado, se puede.
Aún teniendo un CSS cargado previamente al inicio en el AUTOEXEC, si estableces otro en un formulario y dentro de este en un control concreto, respeta éste último.

Interfaz: Establecer hoja estilo CSS (IDENTIFICADOR DEL CONTROL, Estilo CSS)

Saludos


([N1] Giuseppe::Komenco) #11

Teóricamente puedes también usando el identificador del control dentro del CSS y aplicarlo en el ON_INIT, para que todos los edits que se llamen EDIT_CODIGO salgan de esa manera. Es una de las partes que incluiré en la segunda parte de Velneo con estilo.

Un saludo.


([N2] bannu) #12

Todo el entorno gráfico está realizado con Velneo, excepto el espectro (visualización) de la canción
cuando se está reproduciendo, que se realiza desde una DLL.

Se pueden modificar todos los objetos con los style sheets, tanto globalmente, como individualmente, por
lo que sí, se puede tener tantos estilos de líneas de entrada, botones, scrollers etc, como se quiera, las QT le dan una potencia al entorno gráfico inimaginable en una aplicación de Velneo, de hecho en la versión actual es lo único que destacaría.

Tenía pensado presentar la aplicación en el concurso oppen apps pero he decido que no va a ser así, simplemente porque a día de hoy con Velneo no puedo dejar la aplicación como yo quisiera, por ejemplo no funciona el drag&drop en un formulario, tampoco desde la tabla dentro del splitter hacia la lista de auto reproducción, y algunas cositas más, esperemos que en futuras versiones lo tengan solucionado.


rzaragoza.dinacom
, el formulario no muestra el título ni el pie porque se ha recortado la ventana
mediante una DLL.


([N1] Rafael) #13

Gracias Sonovision


([N4] ikonos) #14

@sonovision .telecable

abusando de tu generosidad,

1)cuando dices

que los gráficos se guardan fuera del map de Velneo, de esta forma se pueden crear skins para nuestras aplicaciones, y resulta mas comodo y rápido asignar un gráfico a un objeto que desde el propio entorno
podrias poner un pequeño ejemplo de como hacerlo, por favor!

2) Y ya para colmo de la contribución a la comunidad, si fueras tan amable de poner otro ejemplo de como utilizar esa fantastica dll para ocultar el titulo y el pie del formulario !SERIA LA OS...!!! perdon.

por favor haznos felices!

Un saludo


([N2] bannu) #15

Por ejemplo el fondo del formulario del Player es un gráfico cargado externamente, se crea una conexión de evento, que se dispara al inicializar el formulario y en el evento se pone lo siguiente:

"QFrame
{
border: 0px solid #737373;
border-radius: 0px;
padding: 0px;
background-color: transparent;
background-image: url(./skin/player_bg.png);
background-position: top left;
background-repeat: no-repeat;
}
"

Las consecuencias de cargar un gráfico en el frame principal del formulario es que todos los objetos heredan dicho comportamiento, por lo que se tiene que definir un style para cada objeto situado dentro de este formulario, por ejemplo los campos texto:

"QFrame{
border: none;
background:transparent ;
}
QFrame:hover { backgroundr: trasparent; border: none; }
QFrame:pressed { background: trasnparent; border: none; }
"

Por supuesto se tiene que seleccionar el objeto en la instrucción Interfaz: Establecer hoja de estilo CSS
Los botones:

"QPushButton{
background-image: url(./skin/btn_play1.png);
background-color:transparent;
border:none;
}
QPushButton::pressed {background-image: url(./skin/btn_play1_over.png); } "

Yo solo he puesto dos estados pero se pueden asignar a todos los estados posibles de un botón:

QPushButton
QPushButton:disabled
QPushButton:pressed
QPushButton:focus
QPushButton:hover

El directorio donde se guardan los gráficos en el ejemplo está situado dentro del directorio del vRunner, ./skin, de esta forma no es necesario especificar la ruta completa de dicho directorio pero si lo deseas también se puede hacer.

En cuanto a la DLL cuando tenga un ratillo la colgaré para poder ser descargada, aunque esto es algo que Velneo debería ofrecer de serie; poder definir el tipo de marco de las ventanas y formularios, sin marco, plano, diálogo, redimensionable…


([N2] gegeo) #16

Gracias sonovision,

con tantas imagenes para cada boton, ¿notas afectado el rendimiento del interfaz?

Saludos


([N4] ikonos) #17

Gracias @sonovision.telecable,

Este hilo vale su peso en oro, ya que es un tema deficientemente o nada documentado por Velneo, y menos de forma práctica.
Perfecta la explicacion del skin, y la herencia de estilos, de la que yo creo que más que una ventaja es un inconveniente, pero que se resuelve con código.
Por otra parte en cuanto a la DLL estoy de acuerdo contigo, que Velneo deberia ofrecer de serie definir el tipo de marco, las ventanas y formularios si queremos ser innovadores en la interfaz, es incomprensible que no se pueda utilizar el canal alpha en un formulario nodal para dejar ver el formulario inferior, eliminar el marco del formulario, definir formularios emergentes de formas irregulares utilizando las transparencias, redimensionar el formulario en tiempo de ejecución para efectuar transiciones, drag and drop, etc ... Esto sumado al CSS si que daria un cambio radical en la interfaz, pero fijate que si para areglar un bug tardan lo que tardan o para cambiar los edit con formato financiero que es básico en una aplicación de gestión se monta un follon en el foro, ¿que cara pondran cuando pidamos estas mejoras?, yo creo que los estilos los tenemos porque vienen de serie en Qt que si no ya veiamos.
Entre tanto, cuando tengas tiempo si puedes ponernos un ejemplo de como hacerlo, le harias un gran favor a la comunidad Velneo.
Un saludo y esperamos tus noticias


([N2] bannu) #18

No, Los gráficos se cargan en memoria, no se leen del disco cada vez que tengan que ser dibujados, lo puedes comprobar en:

http://www.bitcodesoft.com/player/vplayer.html

Es un video, pero se ve que los controles van de lujo, en v7 se han cambiado las tornas con respecto a v6, entorno gráfico potente, rendimiento BD, mejor no hablar, es normal que en la nube se note menor rendimiento que ahí no me voy a meter, pero las tablas en memoria, menudo fiasco.


([N2] bannu) #19

Descarga: http://www.bitcodesoft.com/demos/windowutils.dll

Solo tiene una función : void _stdcall FlatWindow(int x, int y), convención de llamada CX86_WIN32_STD

Parámetro x, especifica los pixeles de recorte superior e inferior
Parámetro y, especifica los pixeles de recorte derecha e izquierda.

Se crea un evento de conexión "inicializado" en el formulario del marco principal, y en el evento se llama a la función de la DLL.

Se puede perfeccionar más, e incluso se puede hacer con llamadas a la API, pero si le puede servir a alguien como está pues perfecto, esto es algo que Velneo tiene que resolver, si queremos darle un aspecto profesional y potente al entorno de nuestras aplicaciones es necesario poder controlar las ventanas de las mismas, por ejemplo la línea de estado que es el widget QToolbar
se tiene que poder ocultar a voluntad y unas cuantas cosas más, que dejaré para otro momento...

Me olvidaba necesita las Microsoft Visual C++ 2010 Redistributable Package (x86) , se descargan desde aquí:

http://www.microsoft.com/downloads/en/details.aspx?FamilyID=a7b7a05e-6de6-4d3a-a423-37bf0912db84

Para instalar en modo silencioso utilizar "vcredist_x86.exe /Q"


([N4] velavisual) #20

@sonovision

Muchísimas gracias

saludos
Antonio Vela
http://www.velavisual.com