style/impl/Units.qml

0001 /*
0002  *  SPDX-FileCopyrightText: 2015 Marco Martin <mart@kde.org>
0003  *  SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
0004  *  SPDX-FileCopyrightText: 2021 Dan Leinir Turthra Jensen <admin@leinir.dk>
0005  *  SPDX-License-Identifier: LGPL-2.0-or-later
0006  */
0007
0008 import QtQuick
0009 import QtQuick.Window
0010 import org.kde.kirigami as Kirigami
0011
0012 pragma Singleton
0013
0014 /**
0015  * A set of values to define semantically sizes and durations
0016  * @inherit QtQuick.QtObject
0017  */
0018 QtObject {
0019     id: units
0020
0021     // The default border width
0022     property int smallBorder: 1
0023     // Used for the focus ring
0024     property int mediumBorder: smallBorder * 2
0025     // Usually for highlights on larger surfaces like Cards
0026     property int largeBorder: smallBorder * 4
0027
0028     // The default corner radius
0029     property int smallRadius: 3
0030     // Usually for larger surfaces like Cards
0031     property int largeRadius: smallRadius * 2
0032
0033     // Used to underline checkbox labels
0034     property int focusUnderlineThickness: smallBorder
0035     // Used for tabs and items in sidebars
0036     property int highlightLineThickness: smallRadius
0037
0038     property int grooveHeight: {
0039         let h = Math.floor(fontMetrics.height / 3);
0040         h += h % 2;
0041         return h;
0042     }
0043
0044     property int thickGrooveHeight: {
0045         let h = Math.floor(fontMetrics.height / 1.5);
0046         h += h % 2;
0047         return h;
0048     }
0049
0050     /// For things like checkboxes/radiobuttons/switches/slider handles
0051     property int inlineControlHeight: fontMetrics.height
0052
0053     // For small controls with a small amount of vertical padding
0054     property int smallControlHeight: fontMetrics.height + Kirigami.Units.smallSpacing * 2
0055
0056     // For medium controls with a medium amount of vertical padding
0057     property int mediumControlHeight: fontMetrics.height + Kirigami.Units.mediumSpacing * 2
0058
0059     // For large controls with a large amount of vertical padding
0060     property int largeControlHeight: fontMetrics.height + Kirigami.Units.largeSpacing * 2
0061
0062     property real horizontalPaddingRatio: Math.max(fontMetrics.height / fontMetrics.fullWidthCharWidth, 1)
0063
0064     property int verySmallHorizontalPadding: Math.round(horizontalPaddingRatio * units.verySmallSpacing)
0065
0066     property int smallHorizontalPadding: Math.round(horizontalPaddingRatio * Kirigami.Units.smallSpacing)
0067
0068     property int mediumHorizontalPadding: Math.round(horizontalPaddingRatio * Kirigami.Units.mediumSpacing)
0069
0070     property int largeHorizontalPadding: Math.round(horizontalPaddingRatio * Kirigami.Units.largeSpacing)
0071
0072     function symbolSize(size) {
0073         size -= size % 6
0074         size -= size/3
0075         return size
0076     }
0077
0078     /**
0079      * Units.verySmallSpacing is the amount of spacing that should be used around smaller UI elements,
0080      * for example as spacing in Columns. Internally, this size depends on the size of
0081      * the default font as rendered on the screen, so it takes user-configured font size and DPI
0082      * into account.
0083      */
0084     property int verySmallSpacing: Kirigami.Units.smallSpacing * 0.5
0085
0086     /**
0087      * Units.veryLargeSpacing is the amount of spacing that should be used inside very big UI elements
0088      */
0089     property int veryLargeSpacing: Kirigami.Units.largeSpacing * 1.5
0090
0091     /**
0092      * metrics used by the default font
0093      */
0094     property var fontMetrics: FontMetrics {
0095         property real fullWidthCharWidth: fontMetrics.tightBoundingRect('＿').width
0096     }
0097 }