From 0076dd3588921e9dd88c6a871988dded626c38a1 Mon Sep 17 00:00:00 2001 From: sshane Date: Thu, 15 Jul 2021 17:41:01 -0700 Subject: [PATCH] Update wifi setup design (#21604) * wifi design draft * ui draft 2 * draft * updates * fix spacing * strength indicator * font weight * fix lock icon aspect ratio * fix font weights * new checkmark * fix spacing * was being applied to everything * network handles its own padding * fix spacing * cleanup * looks pretty good * little more * revert that * scroll bar Co-authored-by: Adeeb Shihadeh --- selfdrive/assets/offroad/icon_checkmark.png | Bin 4471 -> 0 bytes selfdrive/assets/offroad/icon_checkmark.svg | 3 + selfdrive/assets/offroad/icon_lock_closed.svg | 6 +- .../offroad/icon_wifi_strength_full.svg | 6 + .../offroad/icon_wifi_strength_high.svg | 6 + .../assets/offroad/icon_wifi_strength_low.svg | 6 + .../offroad/icon_wifi_strength_medium.svg | 6 + selfdrive/ui/qt/offroad/networking.cc | 149 ++++++++++++------ selfdrive/ui/qt/offroad/networking.h | 16 +- selfdrive/ui/qt/offroad/settings.cc | 3 +- selfdrive/ui/qt/offroad/wifiManager.h | 1 + selfdrive/ui/qt/setup/setup.cc | 4 + selfdrive/ui/qt/widgets/scrollview.cc | 7 +- 13 files changed, 141 insertions(+), 72 deletions(-) delete mode 100644 selfdrive/assets/offroad/icon_checkmark.png create mode 100644 selfdrive/assets/offroad/icon_checkmark.svg create mode 100644 selfdrive/assets/offroad/icon_wifi_strength_full.svg create mode 100644 selfdrive/assets/offroad/icon_wifi_strength_high.svg create mode 100644 selfdrive/assets/offroad/icon_wifi_strength_low.svg create mode 100644 selfdrive/assets/offroad/icon_wifi_strength_medium.svg diff --git a/selfdrive/assets/offroad/icon_checkmark.png b/selfdrive/assets/offroad/icon_checkmark.png deleted file mode 100644 index 06efdfb0cbc471ab73932943335366affbfd6e9b..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 4471 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 JPDHLkV1lIvc3uDg diff --git a/selfdrive/assets/offroad/icon_checkmark.svg b/selfdrive/assets/offroad/icon_checkmark.svg new file mode 100644 index 0000000000..b024eccd9e --- /dev/null +++ b/selfdrive/assets/offroad/icon_checkmark.svg @@ -0,0 +1,3 @@ + + + diff --git a/selfdrive/assets/offroad/icon_lock_closed.svg b/selfdrive/assets/offroad/icon_lock_closed.svg index b787097409..7dc9283c81 100644 --- a/selfdrive/assets/offroad/icon_lock_closed.svg +++ b/selfdrive/assets/offroad/icon_lock_closed.svg @@ -1,4 +1,4 @@ - - + + + - diff --git a/selfdrive/assets/offroad/icon_wifi_strength_full.svg b/selfdrive/assets/offroad/icon_wifi_strength_full.svg new file mode 100644 index 0000000000..758198e97f --- /dev/null +++ b/selfdrive/assets/offroad/icon_wifi_strength_full.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/selfdrive/assets/offroad/icon_wifi_strength_high.svg b/selfdrive/assets/offroad/icon_wifi_strength_high.svg new file mode 100644 index 0000000000..a8db07f91e --- /dev/null +++ b/selfdrive/assets/offroad/icon_wifi_strength_high.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/selfdrive/assets/offroad/icon_wifi_strength_low.svg b/selfdrive/assets/offroad/icon_wifi_strength_low.svg new file mode 100644 index 0000000000..8963c3dbc1 --- /dev/null +++ b/selfdrive/assets/offroad/icon_wifi_strength_low.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/selfdrive/assets/offroad/icon_wifi_strength_medium.svg b/selfdrive/assets/offroad/icon_wifi_strength_medium.svg new file mode 100644 index 0000000000..8f8d503260 --- /dev/null +++ b/selfdrive/assets/offroad/icon_wifi_strength_medium.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/selfdrive/ui/qt/offroad/networking.cc b/selfdrive/ui/qt/offroad/networking.cc index 49998cd0b7..4a7d9e8655 100644 --- a/selfdrive/ui/qt/offroad/networking.cc +++ b/selfdrive/ui/qt/offroad/networking.cc @@ -4,34 +4,34 @@ #include #include #include +#include #include "selfdrive/ui/qt/widgets/scrollview.h" #include "selfdrive/ui/qt/util.h" -void NetworkStrengthWidget::paintEvent(QPaintEvent* event) { - QPainter p(this); - p.setRenderHint(QPainter::Antialiasing); - p.setPen(Qt::NoPen); - const QColor gray(0x54, 0x54, 0x54); - for (int i = 0, x = 0; i < 5; ++i) { - p.setBrush(i < strength_ ? Qt::white : gray); - p.drawEllipse(x, 0, 15, 15); - x += 20; - } +QLabel *networkStrengthWidget(const unsigned int strength_) { + QLabel *strength = new QLabel(); + QVector imgs({"low", "medium", "high", "full"}); + QPixmap pix("../assets/offroad/icon_wifi_strength_" + imgs.at(strength_) + ".svg"); + strength->setPixmap(pix.scaledToHeight(68, Qt::SmoothTransformation)); + strength->setSizePolicy(QSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed)); + strength->setStyleSheet("padding: 0px; margin-left: 50px; margin-right: 80px "); + return strength; } // Networking functions -Networking::Networking(QWidget* parent, bool show_advanced) : QWidget(parent), show_advanced(show_advanced) { +Networking::Networking(QWidget* parent, bool show_advanced) : QFrame(parent) { main_layout = new QStackedLayout(this); wifi = new WifiManager(this); - connect(wifi, &WifiManager::wrongPassword, this, &Networking::wrongPassword); connect(wifi, &WifiManager::refreshSignal, this, &Networking::refresh); + connect(wifi, &WifiManager::wrongPassword, this, &Networking::wrongPassword); QWidget* wifiScreen = new QWidget(this); QVBoxLayout* vlayout = new QVBoxLayout(wifiScreen); + vlayout->setContentsMargins(20, 20, 20, 20); if (show_advanced) { QPushButton* advancedSettings = new QPushButton("Advanced"); advancedSettings->setObjectName("advancedBtn"); @@ -46,14 +46,22 @@ Networking::Networking(QWidget* parent, bool show_advanced) : QWidget(parent), s wifiWidget = new WifiUI(this, wifi); wifiWidget->setObjectName("wifiWidget"); connect(wifiWidget, &WifiUI::connectToNetwork, this, &Networking::connectToNetwork); - vlayout->addWidget(new ScrollView(wifiWidget, this), 1); + + ScrollView *wifiScroller = new ScrollView(wifiWidget, this); + wifiScroller->setVerticalScrollBarPolicy(Qt::ScrollBarAsNeeded); + vlayout->addWidget(wifiScroller, 1); main_layout->addWidget(wifiScreen); an = new AdvancedNetworking(this, wifi); connect(an, &AdvancedNetworking::backPress, [=]() { main_layout->setCurrentWidget(wifiScreen); }); main_layout->addWidget(an); + // TODO: revisit pressed colors setStyleSheet(R"( + Networking { + border-radius: 13px; + background-color: #292929; + } #wifiWidget > QPushButton, #back_btn, #advancedBtn { font-size: 50px; margin: 0px; @@ -63,10 +71,6 @@ Networking::Networking(QWidget* parent, bool show_advanced) : QWidget(parent), s color: #dddddd; background-color: #444444; } - #wifiWidget > QPushButton:disabled { - color: #777777; - background-color: #222222; - } )"); main_layout->setCurrentWidget(wifiScreen); } @@ -169,74 +173,119 @@ void AdvancedNetworking::toggleTethering(bool enabled) { WifiUI::WifiUI(QWidget *parent, WifiManager* wifi) : QWidget(parent), wifi(wifi) { main_layout = new QVBoxLayout(this); + main_layout->setContentsMargins(0, 0, 0, 0); + main_layout->setSpacing(0); - // Scan on startup - QLabel *scanning = new QLabel("Scanning for networks"); - scanning->setStyleSheet(R"(font-size: 65px;)"); + QLabel *scanning = new QLabel("Scanning for networks..."); + scanning->setStyleSheet("font-size: 65px;"); main_layout->addWidget(scanning, 0, Qt::AlignCenter); - main_layout->setSpacing(25); + + setStyleSheet(R"( + QScrollBar::handle:vertical { + min-height: 0px; + border-radius: 4px; + background-color: #8A8A8A; + } + #forgetBtn { + font-size: 32px; + font-weight: 600; + color: #292929; + background-color: #BDBDBD; + border-width: 1px solid #828282; + border-radius: 5px; + padding: 40px; + padding-bottom: 16px; + padding-top: 16px; + } + )"); } void WifiUI::refresh() { + // TODO: don't rebuild this every time clearLayout(main_layout); + if (wifi->seen_networks.size() == 0) { QLabel *scanning = new QLabel("No networks found. Scanning..."); - scanning->setStyleSheet(R"(font-size: 65px;)"); + scanning->setStyleSheet("font-size: 65px;"); main_layout->addWidget(scanning, 0, Qt::AlignCenter); return; } + // add networks int i = 0; for (Network &network : wifi->seen_networks) { QHBoxLayout *hlayout = new QHBoxLayout; - - ElidedLabel *ssid_label = new ElidedLabel(network.ssid); - ssid_label->setStyleSheet("font-size: 55px;"); - hlayout->addWidget(ssid_label, 1, Qt::AlignLeft); - + hlayout->setContentsMargins(44, 0, 0, 0); + hlayout->setSpacing(0); + + // Clickable SSID label + QPushButton *ssid_label = new QPushButton(network.ssid); + ssid_label->setEnabled(network.connected != ConnectedType::CONNECTED && + network.connected != ConnectedType::CONNECTING && + network.security_type != SecurityType::UNSUPPORTED); + int weight = network.connected == ConnectedType::DISCONNECTED ? 300 : 500; + ssid_label->setStyleSheet(QString(R"( + font-size: 55px; + font-weight: %1; + text-align: left; + border: none; + padding-top: 50px; + padding-bottom: 50px; + background-color: transparent; + )").arg(weight)); + QObject::connect(ssid_label, &QPushButton::clicked, this, [=]() { emit connectToNetwork(network); }); + hlayout->addWidget(ssid_label, 1); + + // Forget button if (wifi->isKnownConnection(network.ssid) && !wifi->isTetheringEnabled()) { - QPushButton *forgetBtn = new QPushButton(); - QPixmap pix("../assets/offroad/icon_close.svg"); - - forgetBtn->setIcon(QIcon(pix)); - forgetBtn->setIconSize(QSize(35, 35)); - forgetBtn->setStyleSheet("QPushButton { background-color: #E22C2C; }"); - forgetBtn->setFixedSize(100, 90); - + QPushButton *forgetBtn = new QPushButton("FORGET"); + forgetBtn->setObjectName("forgetBtn"); QObject::connect(forgetBtn, &QPushButton::released, [=]() { if (ConfirmationDialog::confirm("Are you sure you want to forget " + QString::fromUtf8(network.ssid) + "?", this)) { wifi->forgetConnection(network.ssid); } }); - hlayout->addWidget(forgetBtn, 0, Qt::AlignRight); + } + + // Status icon + if (network.connected == ConnectedType::CONNECTED) { + QLabel *connectIcon = new QLabel(); + QPixmap pix("../assets/offroad/icon_checkmark.svg"); + + connectIcon->setPixmap(pix.scaledToWidth(49, Qt::SmoothTransformation)); + connectIcon->setSizePolicy(QSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed)); + connectIcon->setStyleSheet("margin: 0px; padding-left: 51px; padding-right: 0px "); + hlayout->addWidget(connectIcon, 0, Qt::AlignRight); + } else if (network.connected == ConnectedType::CONNECTING) { + QLabel *connectIcon = new QLabel(); + // TODO replace connecting icon with proper widget/icon + QPixmap pix(network.connected == ConnectedType::CONNECTED ? "../assets/offroad/icon_checkmark.svg" : "../assets/navigation/direction_rotary.png"); + + connectIcon->setPixmap(pix.scaledToWidth(49, Qt::SmoothTransformation)); + connectIcon->setSizePolicy(QSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed)); + connectIcon->setStyleSheet("margin: 0px; padding-left: 51px; padding-right: 0px "); + hlayout->addWidget(connectIcon, 0, Qt::AlignRight); } else if (network.security_type == SecurityType::WPA) { QLabel *lockIcon = new QLabel(); QPixmap pix("../assets/offroad/icon_lock_closed.svg"); - lockIcon->setPixmap(pix.scaledToWidth(35, Qt::SmoothTransformation)); - lockIcon->setSizePolicy(QSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed)); - lockIcon->setStyleSheet("QLabel { margin: 0px; padding-left: 15px; padding-right: 15px; }"); + lockIcon->setPixmap(pix.scaledToHeight(49, Qt::SmoothTransformation)); + lockIcon->setSizePolicy(QSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed)); + lockIcon->setStyleSheet("padding: 0px; margin-left: 62px; margin-right: 0px "); hlayout->addWidget(lockIcon, 0, Qt::AlignRight); } - // strength indicator - unsigned int strength_scale = network.strength / 17; - hlayout->addWidget(new NetworkStrengthWidget(strength_scale), 0, Qt::AlignRight); + // Strength indicator + hlayout->addWidget(networkStrengthWidget(network.strength / 26), 0, Qt::AlignRight); - // connect button - QPushButton* btn = new QPushButton(network.security_type == SecurityType::UNSUPPORTED ? "Unsupported" : (network.connected == ConnectedType::CONNECTED ? "Connected" : (network.connected == ConnectedType::CONNECTING ? "Connecting" : "Connect"))); - btn->setDisabled(network.connected == ConnectedType::CONNECTED || network.connected == ConnectedType::CONNECTING || network.security_type == SecurityType::UNSUPPORTED); - btn->setFixedWidth(350); - QObject::connect(btn, &QPushButton::clicked, this, [=]() { emit connectToNetwork(network); }); - - hlayout->addWidget(btn, 0, Qt::AlignRight); main_layout->addLayout(hlayout, 1); + // Don't add the last horizontal line if (i+1 < wifi->seen_networks.size()) { main_layout->addWidget(horizontal_line(), 0); } i++; } - main_layout->addStretch(3); + main_layout->addStretch(1); } diff --git a/selfdrive/ui/qt/offroad/networking.h b/selfdrive/ui/qt/offroad/networking.h index 7c0ad319bf..bd4e00538a 100644 --- a/selfdrive/ui/qt/offroad/networking.h +++ b/selfdrive/ui/qt/offroad/networking.h @@ -9,17 +9,6 @@ #include "selfdrive/ui/qt/widgets/ssh_keys.h" #include "selfdrive/ui/qt/widgets/toggle.h" -class NetworkStrengthWidget : public QWidget { - Q_OBJECT - -public: - explicit NetworkStrengthWidget(int strength, QWidget* parent = nullptr) : strength_(strength), QWidget(parent) { setFixedSize(100, 15); } - -private: - void paintEvent(QPaintEvent* event) override; - int strength_ = 0; -}; - class WifiUI : public QWidget { Q_OBJECT @@ -54,17 +43,16 @@ public slots: void refresh(); }; -class Networking : public QWidget { +class Networking : public QFrame { Q_OBJECT public: explicit Networking(QWidget* parent = 0, bool show_advanced = true); private: - QStackedLayout* main_layout = nullptr; // nm_warning, wifiScreen, advanced + QStackedLayout* main_layout = nullptr; QWidget* wifiScreen = nullptr; AdvancedNetworking* an = nullptr; - bool show_advanced; WifiUI* wifiWidget; WifiManager* wifi = nullptr; diff --git a/selfdrive/ui/qt/offroad/settings.cc b/selfdrive/ui/qt/offroad/settings.cc index 6c61166dd4..f4645ca719 100644 --- a/selfdrive/ui/qt/offroad/settings.cc +++ b/selfdrive/ui/qt/offroad/settings.cc @@ -366,7 +366,8 @@ SettingsWindow::SettingsWindow(QWidget *parent) : QFrame(parent) { nav_btns->addButton(btn); sidebar_layout->addWidget(btn, 0, Qt::AlignRight); - panel->setContentsMargins(50, 25, 50, 25); + const int lr_margin = name != "Network" ? 50 : 0; // Network panel handles its own margins + panel->setContentsMargins(lr_margin, 25, lr_margin, 25); ScrollView *panel_frame = new ScrollView(panel, this); panel_widget->addWidget(panel_frame); diff --git a/selfdrive/ui/qt/offroad/wifiManager.h b/selfdrive/ui/qt/offroad/wifiManager.h index e6741ec8ff..898a13659d 100644 --- a/selfdrive/ui/qt/offroad/wifiManager.h +++ b/selfdrive/ui/qt/offroad/wifiManager.h @@ -29,6 +29,7 @@ struct Network { class WifiManager : public QWidget { Q_OBJECT + public: explicit WifiManager(QWidget* parent); diff --git a/selfdrive/ui/qt/setup/setup.cc b/selfdrive/ui/qt/setup/setup.cc index e06e677a6f..5f1f2f3e40 100644 --- a/selfdrive/ui/qt/setup/setup.cc +++ b/selfdrive/ui/qt/setup/setup.cc @@ -93,10 +93,14 @@ QWidget * Setup::network_setup() { title->setStyleSheet("font-size: 90px; font-weight: 500;"); main_layout->addWidget(title, 0, Qt::AlignLeft | Qt::AlignTop); + main_layout->addSpacing(25); + // wifi widget Networking *wifi = new Networking(this, false); main_layout->addWidget(wifi, 1); + main_layout->addSpacing(35); + // back + continue buttons QHBoxLayout *blayout = new QHBoxLayout; main_layout->addLayout(blayout); diff --git a/selfdrive/ui/qt/widgets/scrollview.cc b/selfdrive/ui/qt/widgets/scrollview.cc index 18cd6ee675..1aa05b4157 100644 --- a/selfdrive/ui/qt/widgets/scrollview.cc +++ b/selfdrive/ui/qt/widgets/scrollview.cc @@ -8,18 +8,18 @@ ScrollView::ScrollView(QWidget *w, QWidget *parent) : QScrollArea(parent) { setWidgetResizable(true); setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOff); setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff); - setStyleSheet("ScrollView { background-color:transparent; }"); + setStyleSheet("background-color: transparent;"); QString style = R"( QScrollBar:vertical { border: none; background: transparent; - width:10px; + width: 10px; margin: 0; } QScrollBar::handle:vertical { min-height: 0px; - border-radius: 4px; + border-radius: 5px; background-color: white; } QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { @@ -29,7 +29,6 @@ ScrollView::ScrollView(QWidget *w, QWidget *parent) : QScrollArea(parent) { background: none; } )"; - verticalScrollBar()->setStyleSheet(style); horizontalScrollBar()->setStyleSheet(style);