Color de una pestaña modificado condicionalmente con las librerias QT


(Freyder) #1

Hola, quiero hacer (si se puede...XD) que cambien el color de una pestaña (Notas) si tiene algo escrito. No se si utilizando las librarías Qt pueda modificar una variable global que me sirva para "avisar" que el campo ha sido modificado.

De momento voy tirando con una condición y un texto estático que esta visible o no en función de si la nota tiene algo escrito, pero es un poco cutre... por eso intento darle otra solución.

Gracias


([N1] aztecmexico) #2

Hola Freyder,

Quizas se pueda, te adjunto un ejemplo de como quedaría, para eso en este caso en particular inserté el siguiente código:

"
QTabWidget::pane { /* The tab widget frame */
border-top: 2px solid #C2C7CB;
}

QTabWidget::tab-bar {
left: 5px; /* move to the right by 5px */
}

/* Style the tab using the tab sub-control. Note that
it reads QTabBar _not_ QTabWidget */
QTabBar::tab {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
border: 2px solid #C4C4C3;
border-bottom-color: #C2C7CB; /* same as the pane color */
border-top-left-radius: 4px;
border-top-right-radius: 4px;
min-width: 8ex;
padding: 2px;
}

QTabBar::tab:selected, QTabBar::tab:hover {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #ffff00, stop: 0.4 #ffff99,
stop: 0.5 #ffffff, stop: 1.0 #ccffcc);
}

QTabBar::tab:selected {
border-color: #003399; /* borde izq, sup y der de la pestaña que tiene el foco o seleccionada */
border-bottom-color: #00cc00; /* same as pane color */ /* borde inferior de la misma pestaña */
}

QTabBar::tab:!selected {
margin-top: 4px; /* make non-selected tabs look smaller */
}
"

Para esto tienes que utilizar el comando Interfaz: Establecer Hoja de Estilo CSS y en el control al que lo debes aplicar seleccionas el separador de formularios y en la Formula texto hoja de estilo CSS insertas el código.

Aqui lo interesante es que tú jueges con los códigos hexadecimales de los colores que quieres aplicar.

En este caso yo simplemente lo agregué al crear un evento de inicializado del formulario, pero no veo problema en que mediante el uso de una variable con la cual controles si el contenido de un campo a cambiado, entonces generes un evento que aplique únicamente las condiciones de color a la pestaña que cambió.

Aunque pensandolo un poco este código aplica para todo el separador de formularios y no únicamente para una pestaña.

Yo tengo desactivados las pestañas mediante comandos de interfaz y solo se van activando las que contienen información.

Espero te sirva, un saludo.

Martin Ibarra.

[attachment=19852,1586]


([N1] aztecmexico) #3

Se me olvidaba, la página donde esta todo lo referente a Hojas de Estilo de QT (las cuales puedes aplicar en V7) es http://doc.trolltech.com/4.5/stylesheet-examples.html#customizing-qspinbox

Esta página ya estaba publicada en otro post del blog de velneo, ahi solo cuestión de buscar los controles que deseamos aplicar hojas de estilo y experimentar un poco.

Un Saludo.


([N1] aztecmexico) #4

Así se veían las pestañas previo a la aplicación del CSS

[attachment=19854,1587]


(Freyder) #5

Muchas gracias por la respuesta y las referencias #aztecmexico, esta mañana en el trabajo lo probaré. ;-) Ya posteare algo con los resultados.

Una vez más, gracias.


(Freyder) #6

Gracias Martin.
:( , ya he probado el código y no es precisamente lo que busco este permite cambiar el color de las pestañas (seleccionadas o no), pero no lo cambia si un control de una de las pestañas(en este caso un qlineEdit) ha sido modificado o se ha escrito en él, que es precisamente lo que busco.

De todas formas gracias...XD

Freyder Espinosa.


([N1] Giuseppe::Komenco) #7

@Freyder

A lo que se refiere @aztecmexico es que a través de CSS, puedes cambiar el color, pero sú código, al aplicarlo, obviamente te lo deja tal cual y ya está.

Lo que tendrías que hacer, es establecer la hoja de estilo que te interese a través de un evento.

Por ejemplo, la imágen adjunta, es un proceso COMPROBAR_OBLIGATORIOS donde se comprueba si los campos obligatorios están vacíos, y si lo están, no permite la grabación del registro, muestra un mensaje en pantalla, y marca los campos obligatorios a rellenar.

Ahora mismo me pillas un poco espeso, pero vamos, un evento lanzado con el/los comandos necesarios ¿Ha cambiado el campo? podria servirte a la hora de controlar si debes establecer la hoja de estilo nueva o no.

[attachment=19874,1588]


(Freyder) #8

Buenas @Giuseppe,

La hoja de estilos se puede aplicar de la manera que me dices, pero lo que quiero hacer es modificar un subcontrol que es la pestaña "Notas" de un formulario cuando el campo de texto sea distinto de "vacío", (vamos que se haya escrito una nota) , de esa manera cuando abra la aplicación aunque la pestaña activa sea otra, esta pestaña "Notas" este de un color diferente que sirva de aviso para saber que hay una nota pendiente de revisar.


([N1] Giuseppe::Komenco) #9

Ah, vale, entonces no lo entendí correctamente.

Con los CSS se pueden acceder a controles directamente a través de su identificador (pero también me suena que lo probé y no funcionaba, pero por probar), pero desconozco si se podría hacer con una pestaña en particular.

Prueba a construir algo del estilo (donde notas es el identificador de la pestaña)


QTabBar::tab#notas {
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #fafafa, stop: 0.4 #f4f4f4,
stop: 0.5 #e7e7e7, stop: 1.0 #fafafa);

Y este CSS lo aplicas sobre el separador de formularios.
.
Lo mismo cuela, aunque tengo mis dudas.
.
Aparte, así, a bote pronto, sólo se me ocurre, que la pestaba de notas sólo esté visible si el texto es distinto a vacío, y para dar de alta una nota, lo hagas desde fuera de esas pestaña con algún botón que la habilite o algo así.

Un saludo.


(Freyder) #10

Hola @Giuseppe,

He ahí el problema... como referirme a un subcontrol utilizando la hoja de estilos. La alternativa que planteas ya la había contemplado y funciona, más no es una opción para lo que estoy haciendo.

gracias a ti y a @Martin por el interés, seguiremos probando cosas.

Un saludo


([N1] aztecmexico) #11

Hola, el día de ayer despues de responderte me baje el QT CREATOR que incluye a su ves el Qt Designer.

En este programa se pueden generar Los prototypes de interfaces y al mismo tiempo sacar las instrucciones para luego insert atlas en las hojas de estilo.

Y precisamente ahi observe que si se puede lo que pretendes hacer, solo requieres dos hojas, una para aplicarla cuando tienes algo Nuevo y otra para que una vez que lo leiste la hoja regrese a sus colored estandar. Ojo, aplicarla la hoja al subcontrol pestaña dentro del control separador.


(Freyder) #12

exacto!!!

Voy a probar lo que me dices que se ve que tiene buena pinta... moltes gracies.


([N1] aztecmexico) #13

Hola de nuevo,

Algunas observaciones:

1. En teoría las librerías QT permiten aplicar el efecto que en este caso deseamos al objeto separador de formularios y en nuestro caso particular a cada pestaña.

2. Después de hacer muchas pruebas me doy cuenta que la implementación de V7 de dichas funciones de las librerías Qt no contempla el aplicar o poder hacer uso de dichas funcionalidades al 100%.

3. Digo lo anterior (que no está implementada la funcionalidad al 100%) porque en V7, aún y cuando en la documentación se indica que se pueden aplicar los estilos a los controles y, en el caso que nos ocupa, a los subcontroles, ESTO NO ES CIERTO, además de que aparece que si se puede en el texto del manual de vDevelop, al momento de seleccionar el subobjeto -pestaña- particular de un separador de formularios vía editor vDevelop, el estilo no se aplica al subobjeto seleccionado.

4. Como dice Emanuel en su post de "caprichos de V7", y concuerdo con él, "si está, debería funcionar, si no que lo quiten".

5. Si solo selecciono el control SEP-FORM, si se aplica el estilo, si selecciono el subcontrol SEP-FORM.pestañaX entonces se pasa por el arco del triunfo el estilo y NO lo aplica.

Por lo anterior y ante las pruebas realizadas, me temo que en este caso particular, cuando menos de momento no podrás implementar dicha funcionalidad, es una pena, ya que en lo particular me parece que le daría realce a tu aplicación y a las de muchos otros.

OJO, todas las pruebas las hice con el control separador de formularios, no se si funcione con controles similares tales como pila de formularios, etc.

Me queda hacer una última prueba, ya que leyendo el manual veo que la sintaxis cambia un poco al momento de implementarlo en V7 respecto de la original de la CSS, transcribo el ejemplo del manual de vDevelop:

Código fuente original de CSS:
nameEdit->setStyleSheet("color: blue;"
"background-color: yellow;"
"selection-color: yellow;"
"selection-background-color: blue;");

Fórmula en Velneo V7:
"nameEdit->setStyleSheet(ccolor: blue;c
cbackground-color: yellow;c
cselection-color: yellow;c
cselection-background-color: blue;c);"

Aunque me hace ruido tal nota, ya que utilicé la sintaxis original de CSS y si funciono.

Bueno, de momento sigo haciendo pruebas, quien quite y le pego al gordo.

Un saludo.

Martin Ibarra.










([N1] aztecmexico) #14

Haber, supongo que la pestaña donde se pueden actualizar las notas es una entre varias, o sea, el separador de formularios tiene más de una pestaña.

Bueno, dado que no existe manera de que si tienes 8 pestañas, le indiquemos que queremos que aplique determinadas condiciones a la número 5 -por ejemplo-, peeero lo que si existe son los siguientes pseudo-estados: :first, :last, :middle, :previous--selected, :next-selected, :selected , lo que probé y funcionó fué que la pestaña de las notas cambiantes -jejeje- fuera siempre la última o la primera en el separador de formularios.

Si esta en alguna de esas posiciones, entonces sí puedes lanzar el aplicar la hoja de estilo con lo siguiente:

QTabBar::tab:last {
color: #CCCCCC;
background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
stop: 0 #010101, stop: 0.4 #808080,
stop: 0.5 #545454, stop: 1.0 #292829);
border: 2px solid #C4C4C3;
border-bottom-color: #f7f7f7; /* same as the pane color */
border-top-left-radius: 4px;
border-top-right-radius: 4px;
min-width: 8ex;
padding: 2px;
}

Recuerda, le aplicas el comando al control separador de formularios, no al subcontrol específico, si no es así no funciona.

La condicionante para aplicar el estilo a la primer o ultima pestaña ya lo manejas dentro del evento on-innit del formulario donde esta el separador, eso si, si mientras tienes abierto el formulario, algún otro usuario cambia el contenido de la pestaña notas -supongo que así puede ser- no veras reflejado el cambio, sino hasta que cierres y vuelvas a abrir el formulario, ya que de momento no existe ninguna instrucción para reinicializar un formulario mientras está abierto.

Algo es algo, dijo el calvo.

De todos modos, tercos que somos, seguimos leyendo, aunque por ahi encontré que se prevee que dicha funcionalidad se implemente en la versión 8.7 de Qt, con esto me retracto un poco de mi anterior post en el que critico a mis cuates de Velneo por una incompleta implementación, aunque tambien es culpa de ellos por hacer creer que funcionan cosas que, de momento, no se puede, aunque no dependa de ellos sino del desarrollo de las QT.

Bueno, por hoy me voy a dormir, aunque creo que soñare con colores de pestañas, ojos abiertos, pestañas caidas, párpados pachichis, ............

Un Saludo.

Martin Ibarra.


(Freyder) #15

Buenos días @Martin,

Hemos hecho las pruebas que describes y con idéntico resultado no conseguimos referirnos a un subcontrol "pestaña" en concreto, coincido contigo en lo que dices, no es cierto que se pueda hacer pese a que en la documentación dice que si.

Hemos realizado la consulta a la asistencia de velneo y no se ha resulto nuestra consulta en particular, más si nos plantearon una alternativa que es la de duplicar el subcontrol añadiéndole una imagen (flecha) para diferenciarlos y activar o desactivar una u otra en función del contenido del Edit, es una soluciónparcial de momento, porque para hacer efectivo esto debo refrescar el separador de formularios y ocultar o mostrar al instante la pestaña, para esto creo el evento y su respectiva conexión a él lanzándolo cuando pierde el foco el Edit, después de escribir o borrar algo, pero debo salir para poder ver los resultados.

He probado lo que me dices en el último post y de momento no consigo que funcione no te puedo decir nada definitivo porque lo acabo de probar y me he apurado a contestarte por tu implicación con el tema, en cuanto tenga algo concreto lo pondré.

Gracias y un saludo.

Freyder Espinosa.