forked from qt-creator/qt-creator
Utils: Improve metrics handling in StyleHelper::uiFont
Figma designs have font sizes defined in pixels. We want to define font sizes in points. This change introduces the original font pixel size values from Figma and provides the conversion to sensible point sizes. Change-Id: Ic8356942a9bc033d2b5cd62863d2bd0a4cc6973b Reviewed-by: Cristian Adam <cristian.adam@qt.io>
This commit is contained in:
@@ -942,51 +942,61 @@ static QStringList brandFontFamilies()
|
||||
return families;
|
||||
}
|
||||
|
||||
struct UiFontMetrics {
|
||||
// Original "text token" values are defined in pixels
|
||||
const int pixelSize = -1;
|
||||
const int lineHeight = -1;
|
||||
const QFont::Weight weight = QFont::Normal;
|
||||
};
|
||||
|
||||
static const UiFontMetrics& uiFontMetrics(StyleHelper::UiElement element)
|
||||
{
|
||||
static const std::map<StyleHelper::UiElement, UiFontMetrics> metrics {
|
||||
{StyleHelper::UiElementH1, {36, 54, QFont::DemiBold}},
|
||||
{StyleHelper::UiElementH2, {28, 44, QFont::DemiBold}},
|
||||
{StyleHelper::UiElementH3, {16, 20, QFont::Bold}},
|
||||
{StyleHelper::UiElementH4, {16, 20, QFont::Bold}},
|
||||
{StyleHelper::UiElementH5, {14, 16, QFont::DemiBold}},
|
||||
{StyleHelper::UiElementH6, {12, 14, QFont::DemiBold}},
|
||||
{StyleHelper::UiElementH6Capital, {12, 14, QFont::DemiBold}},
|
||||
{StyleHelper::UiElementCaptionStrong, {10, 12, QFont::DemiBold}},
|
||||
{StyleHelper::UiElementCaption, {10, 12, QFont::Normal}},
|
||||
};
|
||||
QTC_ASSERT(metrics.count(element) > 0, return metrics.at(StyleHelper::UiElementCaptionStrong));
|
||||
return metrics.at(element);
|
||||
}
|
||||
|
||||
QFont StyleHelper::uiFont(UiElement element)
|
||||
{
|
||||
QFont font;
|
||||
|
||||
constexpr qreal panelTitleSize = HostOsInfo::isMacHost() ? 10 : 7.5;
|
||||
|
||||
switch (element) {
|
||||
case UiElementH1:
|
||||
font.setFamilies(brandFontFamilies());
|
||||
font.setPixelSize(30);
|
||||
font.setWeight(QFont::Light);
|
||||
font.setWordSpacing(2);
|
||||
break;
|
||||
case UiElementH2:
|
||||
font.setFamilies(brandFontFamilies());
|
||||
font.setPixelSize(16);
|
||||
break;
|
||||
case UiElementH3:
|
||||
font.setPointSizeF(font.pointSizeF() * 1.6);
|
||||
font.setBold(true);
|
||||
break;
|
||||
case UiElementH4:
|
||||
font.setPointSizeF(font.pointSizeF() * 1.2);
|
||||
font.setBold(true);
|
||||
break;
|
||||
case UiElementH5:
|
||||
font.setPointSizeF(font.pointSizeF() * 1.2);
|
||||
font.setWeight(QFont::DemiBold);
|
||||
break;
|
||||
case UiElementH6:
|
||||
font.setWeight(QFont::DemiBold);
|
||||
break;
|
||||
case UiElementH6Capital:
|
||||
font.setWeight(QFont::DemiBold);
|
||||
font.setCapitalization(QFont::AllUppercase);
|
||||
break;
|
||||
case UiElementCaptionStrong:
|
||||
font.setPointSizeF(panelTitleSize);
|
||||
font.setWeight(QFont::DemiBold);
|
||||
break;
|
||||
case UiElementCaption:
|
||||
font.setPointSizeF(panelTitleSize);
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
const UiFontMetrics &metrics = uiFontMetrics(element);
|
||||
|
||||
// On macOS, by default 72 dpi are assumed for conversion between point and pixel size.
|
||||
// For non-macOS, it is 96 dpi.
|
||||
constexpr qreal defaultDpi = HostOsInfo::isMacHost() ? 72.0 : 96.0;
|
||||
constexpr qreal pixelsToPointSizeFactor = 72.0 / defaultDpi;
|
||||
const qreal qrealPointSize = metrics.pixelSize * pixelsToPointSizeFactor;
|
||||
font.setPointSizeF(qrealPointSize);
|
||||
|
||||
font.setWeight(metrics.weight);
|
||||
|
||||
return font;
|
||||
}
|
||||
|
||||
|
@@ -40,7 +40,11 @@ int main(int argc, char *argv[])
|
||||
auto *sampleLabel = new QLabel(textSample);
|
||||
sampleLabel->setFont(font);
|
||||
sampleLabel->setSizePolicy(uiElementLabel->sizePolicy());
|
||||
fontLabels.addItems({uiElementLabel, sampleLabel, st, font.toString(), br});
|
||||
QFontInfo fontInfo(font);
|
||||
const QString pixelMetrics = QString::fromLatin1("Pixel size: %1")
|
||||
.arg(fontInfo.pixelSize());
|
||||
auto *metricsLabel = new QLabel(pixelMetrics);
|
||||
fontLabels.addItems({uiElementLabel, sampleLabel, st, font.toString(), metricsLabel, br});
|
||||
}
|
||||
|
||||
QString html("<html><body><table>");
|
||||
|
Reference in New Issue
Block a user