PDA

View Full Version : GTQ UI buttons are not working with rounded corners



Zii
5th April 2020, 21:52
I'm a designer, not a coder. I will try to understand the programming suggestions you guys give me.

I am using the QT5 designer to make a simple login page. Was about 80% done and decided to modify the StyleSheets of the buttons so they don't look so 2007.

I noticed 2 "bugs":
1. When I change the background color of the button, it doesn't update in the canvas/viewport. It' stays the default grey color until I run the program and the color shows up only in the live program.
2. When I add a slight amount of rounding to the corner of the burtons, they do not work at all. You can't press them, and hover doesn't work either. I would really like to keep the rounded corners but it's just not working for some reason.
I tried "bring to front" in case there was an invisible box obscuring them, and nothing changed.

Help? I have no clue how to fix this, I am not a programmer.




#include "mainwindow.h"

#include <QApplication>

int main(int argc, char *argv[])
{
QApplication a(argc, argv);
MainWindow w;
w.show();
return a.exec();
}





#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
, ui(new Ui::MainWindow)
{
ui->setupUi(this);
}

MainWindow::~MainWindow()
{
delete ui;
}




<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>MainWindow</class>
<widget class="QMainWindow" name="MainWindow">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>800</width>
<height>600</height>
</rect>
</property>
<property name="windowTitle">
<string>MainWindow</string>
</property>
<property name="styleSheet">
<string notr="true">#centralwidget {background: qradialgradient(cx: 0.3, cy: -0.4, fx: 0.3, fy: -0.4, radius: 1.35, stop: 0 #962D3E, stop: 1 #343642);}
</string>
</property>
<widget class="QWidget" name="centralwidget">
<layout class="QVBoxLayout" name="verticalLayout">
<item>
<widget class="QWidget" name="TopPanel" native="true">
<property name="sizePolicy">
<sizepolicy hsizetype="Preferred" vsizetype="Preferred">
<horstretch>10</horstretch>
<verstretch>0</verstretch>
</sizepolicy>
</property>
<property name="styleSheet">
<string notr="true"/>
</property>
<layout class="QHBoxLayout" name="horizontalLayout">
<item>
<widget class="QPushButton" name="Help">
<property name="styleSheet">
<string notr="true">font: 63 16pt &quot;Cocogoose&quot;;
background-color: rgb(52, 136, 153);
selection-background-color: rgb(150, 45, 62);
color: rgb(255, 255, 255);
border-color: rgb(255, 255, 255);
border-radius: 5px;
padding: 0 8px;</string>
</property>
<property name="text">
<string>?</string>
</property>
</widget>
</item>
<item>
<spacer name="horizontalSpacer">
<property name="orientation">
<enum>Qt::Horizontal</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>40</width>
<height>20</height>
</size>
</property>
</spacer>
</item>
<item>
<widget class="QPushButton" name="Exit">
<property name="styleSheet">
<string notr="true">font: 63 16pt &quot;Cocogoose&quot;;
background-color: rgb(150, 45, 62);
color: rgb(255, 255, 255);
border-color: rgb(255, 255, 255);
border-radius: 5px;
padding: 0 8px;</string>
</property>
<property name="text">
<string>X</string>
</property>
</widget>
</item>
</layout>
<zorder>horizontalSpacer</zorder>
<zorder>Help</zorder>
<zorder>Exit</zorder>
</widget>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_2">
<property name="topMargin">
<number>0</number>
</property>
<item>
<spacer name="verticalSpacer_2">
<property name="orientation">
<enum>Qt::Vertical</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>20</width>
<height>40</height>
</size>
</property>
</spacer>
</item>
<item>
<widget class="QLabel" name="Logo">
<property name="sizePolicy">
<sizepolicy hsizetype="Fixed" vsizetype="Fixed">
<horstretch>0</horstretch>
<verstretch>0</verstretch>
.
.
.
.
<widget class="QWidget" name="loginform" native="true">
<property name="minimumSize">
<size>
<width>35</width>
<height>35</height>
</size>
</property>
<property name="styleSheet">
<string notr="true">background: rgba(0, 0, 0, 80);
border-radius: 8px;</string>
</property>
<layout class="QVBoxLayout" name="verticalLayout_2">
<property name="topMargin">
<number>10</number>
</property>
<item>
<layout class="QHBoxLayout" name="password">
<property name="topMargin">
<number>0</number>
</property>
<item>
<widget class="QLineEdit" name="user">
<property name="minimumSize">
<size>
<width>0</width>
<height>30</height>
</size>
</property>
<property name="styleSheet">
<string notr="true">color: rgb(255, 255, 255);
font: 25 12pt &quot;COCOGOOSE &quot;;</string>
</property>
</widget>
</item>
</layout>
</item>
<item>
<layout class="QHBoxLayout" name="username">
<property name="topMargin">
<number>0</number>
</property>
<item>
<widget class="QLineEdit" name="pass">
<property name="minimumSize">
<size>
<width>0</width>
<height>30</height>
</size>
</property>
<property name="styleSheet">
<string notr="true">color: rgb(255, 255, 255);
font: 25 12pt &quot;COCOGOOSE &quot;;</string>
</property>
</widget>
</item>
</layout>
</item>
<item>
<spacer name="verticalSpacer">
<property name="orientation">
<enum>Qt::Vertical</enum>
</property>
<property name="sizeType">
<enum>QSizePolicy::Fixed</enum>
</property>
<property name="sizeHint" stdset="0">
<size>
<width>0</width>
<height>10</height>
</size>
</property>
</spacer>
</item>
<item>
<layout class="QHBoxLayout" name="horizontalLayout_4">
<property name="leftMargin">
<number>180</number>
</property>
<property name="rightMargin">
<number>180</number>
</property>
<property name="bottomMargin">
<number>0</number>
</property>
<item>
<widget class="QPushButton" name="Login">
<property name="minimumSize">
<size>
<width>0</width>
<height>30</height>
</size>
</property>
<property name="styleSheet">
<string notr="true">font: 63 16pt &quot;Cocogoose&quot;;
background-color: rgb(52, 136, 153);
selection-background-color: rgb(150, 45, 62);
color: rgb(255, 255, 255);
border-color: rgb(255, 255, 255);
border-radius: 5px;
padding: 0 8px;
</string>
</property>
<property name="text">
<string>LOGIN</string>
</property>
</widget>
</item>
</layout>
</item>
</layout>
</widget>
</item>
</layout>
</item>
<item>
<widget class="QCommandLinkButton" name="Forgot">
<property name="styleSheet">
<string notr="true">background-color: rgb(52, 54, 66);
border-radius: 20px;
color: rgb(150, 45, 62);</string>
</property>
<property name="text">
<string>FORGOT PASSWORD?</string>
</property>
</widget>
</item>
</layout>
</widget>
<widget class="QMenuBar" name="menubar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>800</width>
<height>21</height>
</rect>
</property>
</widget>
<widget class="QStatusBar" name="statusbar"/>
</widget>
<resources/>
<connections/>
</ui>