Replace QHBoxLayout with QFormLayout in UserSettings

This allows form fields to wrap dynamically when they are too long for
the view. This should help mobile and small screen users to configure
the app without having to force it into portrait mode, or not be able to
reach the settings fields at all.
This commit is contained in:
Adasauce 2020-02-18 11:08:19 -04:00
parent b24165371c
commit 111e4504ac
No known key found for this signature in database
GPG Key ID: B4FD3151235211CB
2 changed files with 74 additions and 138 deletions

View File

@ -18,6 +18,7 @@
#include <QApplication> #include <QApplication>
#include <QComboBox> #include <QComboBox>
#include <QFileDialog> #include <QFileDialog>
#include <QFormLayout>
#include <QInputDialog> #include <QInputDialog>
#include <QLabel> #include <QLabel>
#include <QLineEdit> #include <QLineEdit>
@ -173,81 +174,43 @@ UserSettingsPage::UserSettingsPage(QSharedPointer<UserSettings> settings, QWidge
topBarLayout_->addWidget(backBtn_, 1, Qt::AlignLeft | Qt::AlignVCenter); topBarLayout_->addWidget(backBtn_, 1, Qt::AlignLeft | Qt::AlignVCenter);
topBarLayout_->addStretch(1); topBarLayout_->addStretch(1);
auto addSetting = [this, &font](QString labelText) { formLayout_ = new QFormLayout;
auto layout = new QHBoxLayout;
layout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto label = new QLabel(labelText, this); formLayout_->setLabelAlignment(Qt::AlignLeft);
label->setFont(font); formLayout_->setFormAlignment(Qt::AlignRight);
formLayout_->setFieldGrowthPolicy(QFormLayout::AllNonFixedFieldsGrow);
formLayout_->setRowWrapPolicy(QFormLayout::WrapLongRows);
formLayout_->setHorizontalSpacing(0);
auto toggle = new Toggle(this); auto general_ = new QLabel(tr("GENERAL"), this);
general_->setSizePolicy(QSizePolicy::Ignored, QSizePolicy::Fixed);
general_->setFont(font);
layout->addWidget(label); trayToggle_ = new Toggle(this);
layout->addWidget(toggle, 0, Qt::AlignRight); startInTrayToggle_ = new Toggle(this);
return std::pair{layout, toggle};
};
QHBoxLayout *trayOptionLayout_ = nullptr;
std::tie(trayOptionLayout_, trayToggle_) = addSetting(tr("Minimize to tray"));
QHBoxLayout *startInTrayOptionLayout_ = nullptr;
std::tie(startInTrayOptionLayout_, startInTrayToggle_) = addSetting(tr("Start in tray"));
if (!settings_->isTrayEnabled()) if (!settings_->isTrayEnabled())
startInTrayToggle_->setDisabled(true); startInTrayToggle_->setDisabled(true);
QHBoxLayout *groupViewLayout = nullptr; avatarCircles_ = new Toggle(this);
std::tie(groupViewLayout, groupViewToggle_) = addSetting(tr("Group's sidebar")); groupViewToggle_ = new Toggle(this);
typingNotifications_ = new Toggle(this);
QHBoxLayout *avatarViewLayout = nullptr; readReceipts_ = new Toggle(this);
std::tie(avatarViewLayout, avatarCircles_) = addSetting(tr("Circular Avatars")); markdownEnabled_ = new Toggle(this);
desktopNotifications_ = new Toggle(this);
QHBoxLayout *typingLayout = nullptr; scaleFactorCombo_ = new QComboBox(this);
std::tie(typingLayout, typingNotifications_) = addSetting(tr("Typing notifications"));
QHBoxLayout *receiptsLayout = nullptr;
std::tie(receiptsLayout, readReceipts_) = addSetting(tr("Read receipts"));
QHBoxLayout *markdownLayout = nullptr;
std::tie(markdownLayout, markdownEnabled_) = addSetting(tr("Send messages as Markdown"));
QHBoxLayout *desktopLayout = nullptr;
std::tie(desktopLayout, desktopNotifications_) = addSetting(tr("Desktop notifications"));
auto scaleFactorOptionLayout = new QHBoxLayout;
scaleFactorOptionLayout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto scaleFactorLabel = new QLabel(tr("Scale factor"), this);
scaleFactorLabel->setFont(font);
scaleFactorCombo_ = new QComboBox(this);
for (double option = 1; option <= 3; option += 0.25) for (double option = 1; option <= 3; option += 0.25)
scaleFactorCombo_->addItem(QString::number(option)); scaleFactorCombo_->addItem(QString::number(option));
scaleFactorOptionLayout->addWidget(scaleFactorLabel);
scaleFactorOptionLayout->addWidget(scaleFactorCombo_, 0, Qt::AlignRight);
auto fontSizeOptionLayout = new QHBoxLayout;
fontSizeOptionLayout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto fontSizeLabel = new QLabel(tr("Font size"), this);
fontSizeLabel->setFont(font);
fontSizeCombo_ = new QComboBox(this); fontSizeCombo_ = new QComboBox(this);
for (double option = 10; option < 17; option += 0.5) for (double option = 10; option < 17; option += 0.5)
fontSizeCombo_->addItem(QString("%1 ").arg(QString::number(option))); fontSizeCombo_->addItem(QString("%1 ").arg(QString::number(option)));
fontSizeOptionLayout->addWidget(fontSizeLabel);
fontSizeOptionLayout->addWidget(fontSizeCombo_, 0, Qt::AlignRight);
auto fontFamilyOptionLayout = new QHBoxLayout;
auto emojiFontFamilyOptionLayout = new QHBoxLayout;
fontFamilyOptionLayout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
emojiFontFamilyOptionLayout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto fontFamilyLabel = new QLabel(tr("Font Family"), this);
auto emojiFamilyLabel = new QLabel(tr("Emoji Font Famly"), this);
fontFamilyLabel->setFont(font);
emojiFamilyLabel->setFont(font);
fontSelectionCombo_ = new QComboBox(this); fontSelectionCombo_ = new QComboBox(this);
emojiFontSelectionCombo_ = new QComboBox(this); emojiFontSelectionCombo_ = new QComboBox(this);
QFontDatabase fontDb; QFontDatabase fontDb;
auto fontFamilies = fontDb.families(); auto fontFamilies = fontDb.families();
// TODO: Is there a way to limit to just emojis, rather than // TODO: Is there a way to limit to just emojis, rather than
// all emoji fonts? // all emoji fonts?
auto emojiFamilies = fontDb.families(QFontDatabase::Symbol); auto emojiFamilies = fontDb.families(QFontDatabase::Symbol);
@ -266,16 +229,6 @@ UserSettingsPage::UserSettingsPage(QSharedPointer<UserSettings> settings, QWidge
fontIndex = emojiFontSelectionCombo_->findText(settings_->emojiFont()); fontIndex = emojiFontSelectionCombo_->findText(settings_->emojiFont());
emojiFontSelectionCombo_->setCurrentIndex(fontIndex); emojiFontSelectionCombo_->setCurrentIndex(fontIndex);
fontFamilyOptionLayout->addWidget(fontFamilyLabel);
fontFamilyOptionLayout->addWidget(fontSelectionCombo_, 0, Qt::AlignRight);
emojiFontFamilyOptionLayout->addWidget(emojiFamilyLabel);
emojiFontFamilyOptionLayout->addWidget(emojiFontSelectionCombo_, 0, Qt::AlignRight);
auto themeOptionLayout_ = new QHBoxLayout;
themeOptionLayout_->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto themeLabel_ = new QLabel(tr("Theme"), this);
themeLabel_->setFont(font);
themeCombo_ = new QComboBox(this); themeCombo_ = new QComboBox(this);
themeCombo_->addItem("Light"); themeCombo_->addItem("Light");
themeCombo_->addItem("Dark"); themeCombo_->addItem("Dark");
@ -286,112 +239,87 @@ UserSettingsPage::UserSettingsPage(QSharedPointer<UserSettings> settings, QWidge
int themeIndex = themeCombo_->findText(themeStr); int themeIndex = themeCombo_->findText(themeStr);
themeCombo_->setCurrentIndex(themeIndex); themeCombo_->setCurrentIndex(themeIndex);
themeOptionLayout_->addWidget(themeLabel_); auto encryptionLabel_ = new QLabel(tr("ENCRYPTION"), this);
themeOptionLayout_->addWidget(themeCombo_, 0, Qt::AlignRight); encryptionLabel_->setSizePolicy(QSizePolicy::Ignored, QSizePolicy::Fixed);
encryptionLabel_->setFont(font);
auto encryptionLayout_ = new QVBoxLayout;
encryptionLayout_->setContentsMargins(0, OptionMargin, 0, OptionMargin);
encryptionLayout_->setAlignment(Qt::AlignVCenter);
QFont monospaceFont; QFont monospaceFont;
monospaceFont.setFamily("Monospace"); monospaceFont.setFamily("Monospace");
monospaceFont.setStyleHint(QFont::Monospace); monospaceFont.setStyleHint(QFont::Monospace);
monospaceFont.setPointSizeF(monospaceFont.pointSizeF() * 0.9); monospaceFont.setPointSizeF(monospaceFont.pointSizeF() * 0.9);
auto deviceIdLayout = new QHBoxLayout;
deviceIdLayout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto deviceIdLabel = new QLabel(tr("Device ID"), this);
deviceIdLabel->setFont(font);
deviceIdLabel->setMargin(0);
deviceIdValue_ = new QLabel{this}; deviceIdValue_ = new QLabel{this};
deviceIdValue_->setTextInteractionFlags(Qt::TextSelectableByMouse); deviceIdValue_->setTextInteractionFlags(Qt::TextSelectableByMouse);
deviceIdValue_->setFont(monospaceFont); deviceIdValue_->setFont(monospaceFont);
deviceIdLayout->addWidget(deviceIdLabel, 1);
deviceIdLayout->addWidget(deviceIdValue_);
auto deviceFingerprintLayout = new QHBoxLayout;
deviceFingerprintLayout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto deviceFingerprintLabel = new QLabel(tr("Device Fingerprint"), this);
deviceFingerprintLabel->setFont(font);
deviceFingerprintLabel->setMargin(0);
deviceFingerprintValue_ = new QLabel{this}; deviceFingerprintValue_ = new QLabel{this};
deviceFingerprintValue_->setTextInteractionFlags(Qt::TextSelectableByMouse); deviceFingerprintValue_->setTextInteractionFlags(Qt::TextSelectableByMouse);
deviceFingerprintValue_->setFont(monospaceFont); deviceFingerprintValue_->setFont(monospaceFont);
deviceFingerprintLayout->addWidget(deviceFingerprintLabel, 1);
deviceFingerprintLayout->addWidget(deviceFingerprintValue_);
auto sessionKeysLayout = new QHBoxLayout;
sessionKeysLayout->setContentsMargins(0, OptionMargin, 0, OptionMargin);
auto sessionKeysLabel = new QLabel(tr("Session Keys"), this); auto sessionKeysLabel = new QLabel(tr("Session Keys"), this);
sessionKeysLabel->setFont(font); sessionKeysLabel->setFont(font);
sessionKeysLayout->addWidget(sessionKeysLabel, 1); sessionKeysLabel->setMargin(OptionMargin);
auto sessionKeysImportBtn = new QPushButton{tr("IMPORT"), this}; auto sessionKeysImportBtn = new QPushButton{tr("IMPORT"), this};
connect(
sessionKeysImportBtn, &QPushButton::clicked, this, &UserSettingsPage::importSessionKeys);
auto sessionKeysExportBtn = new QPushButton{tr("EXPORT"), this}; auto sessionKeysExportBtn = new QPushButton{tr("EXPORT"), this};
connect(
sessionKeysExportBtn, &QPushButton::clicked, this, &UserSettingsPage::exportSessionKeys); auto sessionKeysLayout = new QHBoxLayout(this);
sessionKeysLayout->addWidget(new QLabel("", this), 1, Qt::AlignRight);
sessionKeysLayout->addWidget(sessionKeysExportBtn, 0, Qt::AlignRight); sessionKeysLayout->addWidget(sessionKeysExportBtn, 0, Qt::AlignRight);
sessionKeysLayout->addWidget(sessionKeysImportBtn, 0, Qt::AlignRight); sessionKeysLayout->addWidget(sessionKeysImportBtn, 0, Qt::AlignRight);
encryptionLayout_->addLayout(deviceIdLayout); auto boxWrap = [this, &font](QString labelText, QWidget *field) {
encryptionLayout_->addLayout(deviceFingerprintLayout); auto label = new QLabel(labelText, this);
encryptionLayout_->addWidget(new HorizontalLine{this}); label->setFont(font);
encryptionLayout_->addLayout(sessionKeysLayout); label->setMargin(OptionMargin);
font.setWeight(QFont::Medium); auto layout = new QHBoxLayout(this);
layout->addWidget(field, 0, Qt::AlignRight);
auto encryptionLabel_ = new QLabel(tr("ENCRYPTION"), this); formLayout_->addRow(label, layout);
encryptionLabel_->setSizePolicy(QSizePolicy::Ignored, QSizePolicy::Fixed); };
encryptionLabel_->setFont(font);
auto general_ = new QLabel(tr("GENERAL"), this); formLayout_->addRow(general_);
general_->setSizePolicy(QSizePolicy::Ignored, QSizePolicy::Fixed); formLayout_->addRow(new HorizontalLine(this));
general_->setFont(font); boxWrap(tr("Minimize to tray"), trayToggle_);
boxWrap(tr("Start in tray"), startInTrayToggle_);
formLayout_->addRow(new HorizontalLine{this});
boxWrap(tr("Circular Avatars"), avatarCircles_);
boxWrap(tr("Group's sidebar"), groupViewToggle_);
boxWrap(tr("Typing notifications"), typingNotifications_);
formLayout_->addRow(new HorizontalLine{this});
boxWrap(tr("Read receipts"), readReceipts_);
boxWrap(tr("Send messages as Markdown"), markdownEnabled_);
boxWrap(tr("Desktop notifications"), desktopNotifications_);
formLayout_->addRow(new QLabel("", this));
formLayout_->addRow(new HorizontalLine{this});
boxWrap(tr("Scale factor"), scaleFactorCombo_);
boxWrap(tr("Font size"), fontSizeCombo_);
formLayout_->addRow(new HorizontalLine(this));
boxWrap(tr("Font Family"), fontSelectionCombo_);
boxWrap(tr("Emoji Font Family"), emojiFontSelectionCombo_);
boxWrap(tr("Theme"), themeCombo_);
formLayout_->addRow(new QLabel("", this));
formLayout_->addRow(encryptionLabel_);
formLayout_->addRow(new HorizontalLine(this));
boxWrap(tr("Device ID"), deviceIdValue_);
boxWrap(tr("Device Fingerprint"), deviceFingerprintValue_);
formLayout_->addRow(new HorizontalLine(this));
formLayout_->addRow(sessionKeysLabel, sessionKeysLayout);
mainLayout_ = new QVBoxLayout; mainLayout_ = new QVBoxLayout;
mainLayout_->setAlignment(Qt::AlignTop); mainLayout_->setAlignment(Qt::AlignTop);
mainLayout_->setSpacing(7); mainLayout_->setSpacing(7);
mainLayout_->setContentsMargins( mainLayout_->setContentsMargins(
sideMargin_, LayoutTopMargin, sideMargin_, LayoutBottomMargin); sideMargin_, LayoutTopMargin, sideMargin_, LayoutBottomMargin);
mainLayout_->addWidget(general_, 1, Qt::AlignLeft | Qt::AlignBottom); mainLayout_->addLayout(formLayout_);
mainLayout_->addWidget(new HorizontalLine(this));
mainLayout_->addLayout(trayOptionLayout_);
mainLayout_->addLayout(startInTrayOptionLayout_);
mainLayout_->addWidget(new HorizontalLine(this));
mainLayout_->addLayout(groupViewLayout);
mainLayout_->addLayout(avatarViewLayout);
mainLayout_->addWidget(new HorizontalLine(this));
mainLayout_->addLayout(typingLayout);
mainLayout_->addLayout(receiptsLayout);
mainLayout_->addLayout(markdownLayout);
mainLayout_->addLayout(desktopLayout);
mainLayout_->addWidget(new HorizontalLine(this));
#if defined(Q_OS_MAC) #if defined(Q_OS_MAC)
scaleFactorLabel->hide(); // TODO: hide these with formlayout
scaleFactorCombo_->hide(); scaleFactorCombo_->hide();
emojiFamilyLabel->hide();
emojiFontSelectionCombo_->hide(); emojiFontSelectionCombo_->hide();
#endif #endif
mainLayout_->addLayout(scaleFactorOptionLayout);
mainLayout_->addLayout(fontSizeOptionLayout);
mainLayout_->addLayout(fontFamilyOptionLayout);
mainLayout_->addLayout(emojiFontFamilyOptionLayout);
mainLayout_->addWidget(new HorizontalLine(this));
mainLayout_->addLayout(themeOptionLayout_);
mainLayout_->addWidget(new HorizontalLine(this));
mainLayout_->addSpacing(50);
mainLayout_->addWidget(encryptionLabel_, 1, Qt::AlignLeft | Qt::AlignBottom);
mainLayout_->addWidget(new HorizontalLine(this));
mainLayout_->addLayout(encryptionLayout_);
auto scrollArea_ = new QScrollArea(this); auto scrollArea_ = new QScrollArea(this);
scrollArea_->setFrameShape(QFrame::NoFrame); scrollArea_->setFrameShape(QFrame::NoFrame);
scrollArea_->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff); scrollArea_->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
@ -467,6 +395,12 @@ UserSettingsPage::UserSettingsPage(QSharedPointer<UserSettings> settings, QWidge
settings_->setDesktopNotifications(!isDisabled); settings_->setDesktopNotifications(!isDisabled);
}); });
connect(
sessionKeysImportBtn, &QPushButton::clicked, this, &UserSettingsPage::importSessionKeys);
connect(
sessionKeysExportBtn, &QPushButton::clicked, this, &UserSettingsPage::exportSessionKeys);
connect(backBtn_, &QPushButton::clicked, this, [this]() { connect(backBtn_, &QPushButton::clicked, this, [this]() {
settings_->save(); settings_->save();
emit moveBack(); emit moveBack();
@ -507,7 +441,7 @@ UserSettingsPage::resizeEvent(QResizeEvent *event)
else else
sideMargin_ = static_cast<double>(event->size().width() - contentMinWidth) / 2.; sideMargin_ = static_cast<double>(event->size().width() - contentMinWidth) / 2.;
if (sideMargin_ < 40) if (sideMargin_ < 70)
sideMargin_ = 0; sideMargin_ = 0;
mainLayout_->setContentsMargins( mainLayout_->setContentsMargins(

View File

@ -19,6 +19,7 @@
#include <QComboBox> #include <QComboBox>
#include <QFontDatabase> #include <QFontDatabase>
#include <QFormLayout>
#include <QFrame> #include <QFrame>
#include <QLabel> #include <QLabel>
#include <QLayout> #include <QLayout>
@ -166,6 +167,7 @@ private slots:
private: private:
// Layouts // Layouts
QVBoxLayout *topLayout_; QVBoxLayout *topLayout_;
QFormLayout *formLayout_;
QVBoxLayout *mainLayout_; QVBoxLayout *mainLayout_;
QHBoxLayout *topBarLayout_; QHBoxLayout *topBarLayout_;