Botón plano y esquinas rectas

Velneo
1

Hola Foro,

Necesito hacer un botón que tenga la característica de plano y con las esquinas rectas, vamos como son los nuevos botones de Windows 10.

Por lo que he visto por el foro, esto se puede hacer con QPushButton, pero no he podido encontrar como se tiene que configurar para hacer que las esquinas rectas y con un estilo plano.

Os dejo adjunto el estilo de botón que me gustaría construir.

Si alguien me puede echar una mano, gracias anticipadas…

Saludos,

2

Revisa que en alguna linea anterior de tu CSS no tengas un QPushButton con la propiedad:

border-radius

Si lo tienes, una de dos, o eliminas la propiedad, o dedicas un QPushButton especifico para ese boton, indicando en nombre del boton, por ejemplo:

QPushButton#NOMBRE_DEL_BOTON {tus propiedades para este boton}

Saludos

3

Perdon,

Quise decir, indicando el identificador de tu nuevo boton:

QPushButton#IDENTIFICADOR_DEL_BOTON {tus propiedades para este boton}

Si te creas un CSS especifico para este boton nuevo, deberas poner el mismo identificador a todos los botones que quieres que tengan ese efecto.
-Esto esta bien, porque cambian todos de golpe.
-Esta esta mal, si quieres utilizar el mismo CSS para varios botones en el mismo formulario, porque no podras repetir el identificador.

Para solucionar esto si es tu caso, puedes poner en tu CSS todos los identificadores de los botones que compartan unas mismas propiedades:

QPushButton#IDENTIFICADOR_DEL_BOTON, QPushButton#IDENTIFICADOR_DEL_BOTON_2 {tus propiedades para este boton}

Saludos

4

Hola GEGEO

He revisado todos los QPushButton y ninguno tiene la propiedad border-radius

Os adjunto el código que estoy utilizando:

QPushButton#BTN_MENSAJERIA { 
 background:  qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop:0 #FF6666, stop:1 #FF0000);
 border: 1px solid #FF0000;
 color: #FFF;
5

ALTO!!! - GEGEO

Ya lo tengo, solucionado, como bien has dicho tenia un border con el border-radius, pero al pasar el buscador la primera vez, no se porque no lo encontrado, pero lo he vuelto a pasar y efectivamente había un border-radius, lo he quitado y ya tengo el botón sin esquinas redondas.

Gracias
saludos

6

ALTO :smiley:

Otra opcion, pero no la he probado:

Como vas a especificar el CSS para un boton concreto, sin quitar el border-radius que tenias, puedes probar indicando en tu boton nuevo

border-radius: 0px;

Pero ya te digo que esto no lo he probado, y no se si priorizaria en este caso el border-radius original.

Saludos

7

Hola.

Existe la posibilidad de tener 2 tipos de Botones con caracter general en nuestra aplicación. Simplemente poniendo a Falso o Verdadero la propiedad Plano del control Botón.

Por ejemplo, el CSS para los botones con la propiedad Plano a Falso podría quedar de la siguiente manera:
QPushButton {
font-family: arial, sans-serif;
background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #FFFFFF, stop: 0.5 #D3CEC8);
padding: 5px 10px 5px 10px;
border: 1px solid;
border-color: DimGray;
border-radius: 4px;
color: black;
}

y el CSS para los botones con la propiedad Plano a Verdadero de esta otra manera:
QPushButton:flat {
background-color: Honeydew;
border: 1px solid SeaGreen;
border-radius: 0px;
}

Saludos
Paco Satué

8

Gracias Paco,

Lo voy a probar, a ver como queda.

Saludos