Font/UI scaling improvements

CHANGELOG.md

@@ -9,6 +9,7 @@
 - Minor: The account switcher is now styled to match your theme. (#4817)
 - Minor: Add an invisible resize handle to the bottom of frameless user info popups and reply thread popups. (#4795)
 - Minor: The installer now checks for the VC Runtime version and shows more info when it's outdated. (#4847)
+- Minor: Improved font and UI scaling on high DPI screens. (#3690)
 - Minor: Allow running `/ban`, `/timeout`, `/unban`, and `/untimeout` on User IDs by using the `id:123` syntax (e.g. `/timeout id:22484632 1m stop winning`). (#4945, #4956, #4957)
 - Minor: The `/usercard` command now accepts user ids. (#4934)
 - Minor: Add menu actions to reply directly to a message or the original thread root. (#4923)

src/controllers/accounts/AccountModel.cpp

@@ -22,7 +22,6 @@ void AccountModel::getRowFromItem(const std::shared_ptr<Account> &item,
                                   std::vector<QStandardItem *> &row)
 {
     setStringItem(row[0], item->toString(), false);
-    row[0]->setData(QFont("Segoe UI", 10), Qt::FontRole);
 }
 
 int AccountModel::beforeInsert(const std::shared_ptr<Account> &item,
@@ -34,7 +33,7 @@ int AccountModel::beforeInsert(const std::shared_ptr<Account> &item,
         auto newRow = this->createRow();
 
         setStringItem(newRow[0], item->getCategory(), false, false);
-        newRow[0]->setData(QFont("Segoe UI Light", 16), Qt::FontRole);
+        newRow[0]->setBackground(QBrush(Qt::GlobalColor::darkGray));
 
         this->insertCustomRow(std::move(newRow), proposedIndex);
 

src/controllers/hotkeys/HotkeyModel.cpp

@@ -22,18 +22,14 @@ std::shared_ptr<Hotkey> HotkeyModel::getItemFromRow(
 void HotkeyModel::getRowFromItem(const std::shared_ptr<Hotkey> &item,
                                  std::vector<QStandardItem *> &row)
 {
-    QFont font("Segoe UI", 10);
-
+    setStringItem(row[0], item->name(), false);
+    setStringItem(row[1], item->toString(), false);
     if (!item->validAction())
     {
-        font.setStrikeOut(true);
+        QBrush bgColor(Qt::GlobalColor::darkRed);
+        row[0]->setBackground(bgColor);
+        row[1]->setBackground(bgColor);
     }
-
-    setStringItem(row[0], item->name(), false);
-    row[0]->setData(font, Qt::FontRole);
-
-    setStringItem(row[1], item->toString(), false);
-    row[1]->setData(font, Qt::FontRole);
 }
 
 int HotkeyModel::beforeInsert(const std::shared_ptr<Hotkey> &item,
@@ -46,12 +42,14 @@ int HotkeyModel::beforeInsert(const std::shared_ptr<Hotkey> &item,
         auto newRow = this->createRow();
 
         setStringItem(newRow[0], category, false, false);
-        newRow[0]->setData(QFont("Segoe UI Light", 16), Qt::FontRole);
+        QBrush bgColor(Qt::GlobalColor::darkGray);
+        newRow[0]->setBackground(bgColor);
 
         // make sure category headers aren't editable
         for (unsigned long i = 1; i < newRow.size(); i++)
         {
             setStringItem(newRow[i], "", false, false);
+            newRow[i]->setBackground(bgColor);
         }
 
         this->insertCustomRow(std::move(newRow), proposedIndex);

src/singletons/Fonts.cpp

@@ -77,22 +77,33 @@ Fonts::Fonts(Settings &settings)
     this->fontChangedListener.addSetting(settings.boldScale);
 }
 
-QFont Fonts::getFont(FontStyle type, float scale)
+QFont Fonts::getFont(FontStyle type, float scale, QWidget *widget)
 {
-    return this->getOrCreateFontData(type, scale).font;
+    return this->getOrCreateFontData(type, scale, widget).font;
 }
 
-QFontMetrics Fonts::getFontMetrics(FontStyle type, float scale)
+QFontMetrics Fonts::getFontMetrics(FontStyle type, float scale, QWidget *widget)
 {
-    return this->getOrCreateFontData(type, scale).metrics;
+    return this->getOrCreateFontData(type, scale, widget).metrics;
 }
 
-Fonts::FontData &Fonts::getOrCreateFontData(FontStyle type, float scale)
+Fonts::FontData &Fonts::getOrCreateFontData(FontStyle type, float scale,
+                                            QWidget *widget)
 {
     assertInGuiThread();
 
     assert(type < FontStyle::EndType);
 
+    // use DPI scaling if widget was passed
+#if defined(Q_OS_WIN) || defined(Q_OS_MACOS)
+    if (widget != nullptr)
+    {
+        scale = scale * 96.f /
+                std::max<float>(
+                    0.01f, widget->logicalDpiX() * widget->devicePixelRatioF());
+    }
+#endif
+
     auto &map = this->fontsByType_[size_t(type)];
 
     // find element
@@ -113,9 +124,7 @@ Fonts::FontData &Fonts::getOrCreateFontData(FontStyle type, float scale)
 
 Fonts::FontData Fonts::createFontData(FontStyle type, float scale)
 {
-    auto *settings = getSettings();
-
-    // check if it's a chat (scale the setting)
+    // check if it's a chat
     if (type >= FontStyle::ChatStart && type <= FontStyle::ChatEnd)
     {
         static std::unordered_map<FontStyle, ChatFontData> sizeScale{
@@ -128,37 +137,25 @@ Fonts::FontData Fonts::createFontData(FontStyle type, float scale)
             {FontStyle::ChatLarge, {1.2f, false, QFont::Normal}},
             {FontStyle::ChatVeryLarge, {1.4f, false, QFont::Normal}},
         };
-        sizeScale[FontStyle::ChatMediumBold] = {1, false,
-                                                QFont::Weight(getBoldness())};
-        auto data = sizeScale[type];
-        return FontData(
-            QFont(settings->chatFontFamily.getValue(),
-                  int(settings->chatFontSize.getValue() * data.scale * scale),
-                  data.weight, data.italic));
-    }
 
-    // normal Ui font (use pt size)
-    {
-#ifdef Q_OS_MAC
-        constexpr float multiplier = 0.8f;
-#else
-        constexpr float multiplier = 1.f;
-#endif
-
-        static std::unordered_map<FontStyle, UiFontData> defaultSize{
-            {FontStyle::Tiny, {8, "Monospace", false, QFont::Normal}},
-            {FontStyle::UiMedium,
-             {int(9 * multiplier), DEFAULT_FONT_FAMILY, false, QFont::Normal}},
-            {FontStyle::UiMediumBold,
-             {int(9 * multiplier), DEFAULT_FONT_FAMILY, false, QFont::Bold}},
-            {FontStyle::UiTabs,
-             {int(9 * multiplier), DEFAULT_FONT_FAMILY, false, QFont::Normal}},
-        };
-
-        UiFontData &data = defaultSize[type];
-        QFont font(data.name, int(data.size * scale), data.weight, data.italic);
-        return FontData(font);
+        ChatFontData data = sizeScale[type];
+        return FontData(QFont(
+            getSettings()->chatFontFamily.getValue(),
+            int(getSettings()->chatFontSize.getValue() * data.scale * scale),
+            data.weight, data.italic));
     }
+
+    // normal UI font
+    static std::unordered_map<FontStyle, UiFontData> defaultSize{
+        {FontStyle::Tiny, {8, "Monospace", false, QFont::Normal}},
+        {FontStyle::UiMedium, {9, DEFAULT_FONT_FAMILY, false, QFont::Normal}},
+        {FontStyle::UiMediumBold, {9, DEFAULT_FONT_FAMILY, false, QFont::Bold}},
+        {FontStyle::UiTabs, {9, DEFAULT_FONT_FAMILY, false, QFont::Normal}},
+    };
+
+    UiFontData &data = defaultSize[type];
+    return FontData(
+        QFont(data.name, int(data.size * scale), data.weight, data.italic));
 }
 
 }  // namespace chatterino

src/singletons/Fonts.hpp

@@ -43,8 +43,9 @@ class Fonts final
 
     // font data gets set in createFontData(...)
 
-    QFont getFont(FontStyle type, float scale);
-    QFontMetrics getFontMetrics(FontStyle type, float scale);
+    QFont getFont(FontStyle type, float scale, QWidget *widget = nullptr);
+    QFontMetrics getFontMetrics(FontStyle type, float scale,
+                                QWidget *widget = nullptr);
 
     pajlada::Signals::NoArgSignal fontChanged;
 
@@ -73,7 +74,7 @@ class Fonts final
         QFont::Weight weight;
     };
 
-    FontData &getOrCreateFontData(FontStyle type, float scale);
+    FontData &getOrCreateFontData(FontStyle type, float scale, QWidget *widget);
     FontData createFontData(FontStyle type, float scale);
 
     std::vector<std::unordered_map<float, FontData>> fontsByType_;

src/widgets/BaseWindow.cpp

@@ -776,7 +776,7 @@ void BaseWindow::scaleChangedEvent(float scale)
 #endif
 
     this->setFont(
-        getIApp()->getFonts()->getFont(FontStyle::UiTabs, this->qtFontScale()));
+        getIApp()->getFonts()->getFont(FontStyle::UiTabs, this->scale(), this));
 }
 
 void BaseWindow::paintEvent(QPaintEvent *)

src/widgets/Label.cpp

@@ -88,23 +88,11 @@ void Label::paintEvent(QPaintEvent *)
 {
     QPainter painter(this);
 
-    qreal deviceDpi =
-#ifdef Q_OS_WIN
-        this->devicePixelRatioF();
-#else
-        1.0;
-#endif
-
     QFontMetrics metrics = getIApp()->getFonts()->getFontMetrics(
-        this->getFontStyle(),
-        this->scale() * 96.f /
-            std::max<float>(
-                0.01F, static_cast<float>(this->logicalDpiX() * deviceDpi)));
-    painter.setFont(getIApp()->getFonts()->getFont(
-        this->getFontStyle(),
-        this->scale() * 96.f /
-            std::max<float>(
-                0.02F, static_cast<float>(this->logicalDpiX() * deviceDpi))));
+        this->getFontStyle(), this->scale(), this);
+
+    painter.setFont(getIApp()->getFonts()->getFont(this->getFontStyle(),
+                                                   this->scale(), this));
 
     int offset = this->getOffset();
 
@@ -130,8 +118,8 @@ void Label::paintEvent(QPaintEvent *)
 
 void Label::updateSize()
 {
-    QFontMetrics metrics =
-        getIApp()->getFonts()->getFontMetrics(this->fontStyle_, this->scale());
+    QFontMetrics metrics = getIApp()->getFonts()->getFontMetrics(
+        this->fontStyle_, this->scale(), this);
 
     int width =
         metrics.horizontalAdvance(this->text_) + (2 * this->getOffset());

src/widgets/TooltipWidget.cpp

@@ -301,7 +301,7 @@ void TooltipWidget::scaleChangedEvent(float)
 void TooltipWidget::updateFont()
 {
     this->setFont(getIApp()->getFonts()->getFont(FontStyle::ChatMediumSmall,
-                                                 this->scale()));
+                                                 this->scale(), this));
 }
 
 void TooltipWidget::setWordWrap(bool wrap)

src/widgets/dialogs/UserInfoPopup.cpp

@@ -572,8 +572,8 @@ void UserInfoPopup::themeChangedEvent()
 
     for (auto &&child : this->findChildren<QCheckBox *>())
     {
-        child->setFont(
-            getIApp()->getFonts()->getFont(FontStyle::UiMedium, this->scale()));
+        child->setFont(getIApp()->getFonts()->getFont(FontStyle::UiMedium,
+                                                      this->scale(), this));
     }
 }
 

src/widgets/helper/ChannelView.cpp

@@ -598,14 +598,8 @@ void ChannelView::scaleChangedEvent(float scale)
 
     if (this->goToBottom_)
     {
-        auto factor = this->qtFontScale();
-#ifdef Q_OS_MACOS
-        factor = scale * 80.F /
-                 std::max<float>(
-                     0.01, this->logicalDpiX() * this->devicePixelRatioF());
-#endif
-        this->goToBottom_->getLabel().setFont(
-            getIApp()->getFonts()->getFont(FontStyle::UiMedium, factor));
+        this->goToBottom_->getLabel().setFont(getIApp()->getFonts()->getFont(
+            FontStyle::UiMedium, this->scale(), this));
     }
 }
 

src/widgets/helper/NotebookTab.cpp

@@ -27,14 +27,6 @@
 
 namespace chatterino {
 namespace {
-    qreal deviceDpi(QWidget *widget)
-    {
-#ifdef Q_OS_WIN
-        return widget->devicePixelRatioF();
-#else
-        return 1.0;
-#endif
-    }
 
     // Translates the given rectangle by an amount in the direction to appear like the tab is selected.
     // For example, if location is Top, the rectangle will be translated in the negative Y direction,
@@ -196,8 +188,8 @@ int NotebookTab::normalTabWidth()
     float scale = this->scale();
     int width;
 
-    auto metrics = getIApp()->getFonts()->getFontMetrics(
-        FontStyle::UiTabs, float(qreal(this->scale()) * deviceDpi(this)));
+    QFontMetrics metrics =
+        getIApp()->getFonts()->getFontMetrics(FontStyle::UiTabs, scale, this);
 
     if (this->hasXButton())
     {
@@ -435,15 +427,14 @@ void NotebookTab::moveAnimated(QPoint pos, bool animated)
 
 void NotebookTab::paintEvent(QPaintEvent *)
 {
-    auto *app = getApp();
+    auto *app = getIApp();
     QPainter painter(this);
     float scale = this->scale();
 
-    auto div = std::max<float>(0.01f, this->logicalDpiX() * deviceDpi(this));
     painter.setFont(
-        getIApp()->getFonts()->getFont(FontStyle::UiTabs, scale * 96.f / div));
+        getIApp()->getFonts()->getFont(FontStyle::UiTabs, scale, this));
     QFontMetrics metrics =
-        app->getFonts()->getFontMetrics(FontStyle::UiTabs, scale * 96.f / div);
+        app->getFonts()->getFontMetrics(FontStyle::UiTabs, scale, this);
 
     int height = int(scale * NOTEBOOK_TAB_HEIGHT);
 

src/widgets/settingspages/GeneralPage.cpp

@@ -1295,7 +1295,7 @@ QString GeneralPage::getFont(const DropdownArgs &args) const
     {
         args.combobox->setEditText("Choosing...");
 
-        auto ok = bool();
+        bool ok;
         auto previousFont =
             getIApp()->getFonts()->getFont(FontStyle::ChatMedium, 1.);
         auto font = QFontDialog::getFont(&ok, previousFont, this->window());

src/widgets/splits/Split.cpp

@@ -944,6 +944,12 @@ void Split::showChangeChannelPopup(const char *dialogTitle, bool empty,
     this->selectChannelDialog_ = dialog;
 }
 
+void Split::scaleChangedEvent(float scale)
+{
+    this->setFont(
+        getIApp()->getFonts()->getFont(FontStyle::UiMedium, scale, this));
+}
+
 void Split::updateGifEmotes()
 {
     this->view_->queueUpdate();
@@ -1194,11 +1200,11 @@ void Split::showChatterList()
     auto *loadingLabel = new QLabel("Loading...");
     searchBar->setPlaceholderText("Search User...");
 
-    auto formatListItemText = [](QString text) {
+    auto formatListItemText = [this](QString text) {
         auto *item = new QListWidgetItem();
         item->setText(text);
-        item->setFont(
-            getIApp()->getFonts()->getFont(FontStyle::ChatMedium, 1.0));
+        item->setFont(getIApp()->getFonts()->getFont(FontStyle::UiMedium,
+                                                     this->scale(), this));
         return item;
     };
 

src/widgets/splits/Split.hpp

@@ -99,6 +99,8 @@ class Split : public BaseWidget
     pajlada::Signals::Signal<SplitDirection, Split *> insertSplitRequested;
 
 protected:
+    void scaleChangedEvent(float scale_) override;
+
     void paintEvent(QPaintEvent *event) override;
     void mouseMoveEvent(QMouseEvent *event) override;
     void keyPressEvent(QKeyEvent *event) override;

src/widgets/splits/SplitContainer.cpp

@@ -615,7 +615,7 @@ void SplitContainer::paintEvent(QPaintEvent * /*event*/)
         painter.setPen(this->theme->splits.header.text);
 
         const auto font = getIApp()->getFonts()->getFont(FontStyle::ChatMedium,
-                                                         this->scale());
+                                                         this->scale(), this);
         painter.setFont(font);
 
         QString text = "Click to add a split";