mirror of
https://github.com/subsurface/subsurface.git
synced 2025-02-19 22:16:15 +00:00
more complete implementation of Plasma's Units
This is a currently work-in-progress attempt at making a minimal set of Plasma components available. The code needs a bunch of adjustments yet, which I'm making in tune with upstream. The idea is to create a standardized sub-set of Plasma's QML API for applications, which brings only minimal new dependencies (for now: none). Signed-off-by: Sebastian Kügler <sebas@kde.org> Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Sebastian Kügler
Dirk Hohndel
parent
b76d3fa25f
commit
c8227e200d
2 changed files with 157 additions and 18 deletions
|
|
@ -1,10 +1,58 @@
|
||||||
import QtQuick 2.3
|
/*
|
||||||
|
* Copyright 2015 Marco Martin <mart@kde.org>
|
||||||
|
*
|
||||||
|
* This program is free software; you can redistribute it and/or modify
|
||||||
|
* it under the terms of the GNU Library General Public License as
|
||||||
|
* published by the Free Software Foundation; either version 2, or
|
||||||
|
* (at your option) any later version.
|
||||||
|
*
|
||||||
|
* This program is distributed in the hope that it will be useful,
|
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
* GNU Library General Public License for more details
|
||||||
|
*
|
||||||
|
* You should have received a copy of the GNU Library General Public
|
||||||
|
* License along with this program; if not, write to the
|
||||||
|
* Free Software Foundation, Inc.,
|
||||||
|
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||||||
|
*/
|
||||||
|
|
||||||
QtObject {
|
import QtQuick 2.0
|
||||||
property color accentColor: "#2d5b9a"
|
|
||||||
property color accentTextColor: "#ececec"
|
pragma Singleton
|
||||||
property color textColor: "#333333"
|
|
||||||
property color backgroundColor: "#ececec"
|
/*!
|
||||||
property color highlightColor: "#91c4e1"
|
\qmltype Theme
|
||||||
property color highlightTextColor: "#333333"
|
\inqmlmodule Material 0.1
|
||||||
}
|
|
||||||
|
\brief Provides access to standard colors that follow the Material Design specification.
|
||||||
|
|
||||||
|
See \l {http://www.google.com/design/spec/style/color.html#color-ui-color-application} for
|
||||||
|
details about choosing a color scheme for your application.
|
||||||
|
*/
|
||||||
|
Object {
|
||||||
|
id: theme
|
||||||
|
|
||||||
|
property color textColor: Qt.rgba(0,0,0, 0.54)
|
||||||
|
|
||||||
|
property color highlightColor: "#2196F3"
|
||||||
|
property color backgroundColor: "#f3f3f3"
|
||||||
|
property color linkColor: "#2196F3"
|
||||||
|
property color visitedLinkColor: "#2196F3"
|
||||||
|
|
||||||
|
property color buttonTextColor: Qt.rgba(0,0,0, 0.54)
|
||||||
|
property color buttonBackgroundColor: "#f3f3f3"
|
||||||
|
property color buttonHoverColor: "#2196F3"
|
||||||
|
property color buttonFocusColor: "#2196F3"
|
||||||
|
|
||||||
|
property color viewTextColor: Qt.rgba(0,0,0, 0.54)
|
||||||
|
property color viewBackgroundColor: "#f3f3f3"
|
||||||
|
property color viewHoverColor: "#2196F3"
|
||||||
|
property color viewFocusColor: "#2196F3"
|
||||||
|
|
||||||
|
property color complementaryTextColor: "#f3f3f3"
|
||||||
|
property color complementaryBackgroundColor: Qt.rgba(0,0,0, 0.54)
|
||||||
|
property color complementaryHoverColor: "#2196F3"
|
||||||
|
property color complementaryFocusColor: "#2196F3"
|
||||||
|
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,102 @@
|
||||||
import QtQuick 2.3
|
/*
|
||||||
|
* Copyright 2015 Marco Martin <mart@kde.org>
|
||||||
|
*
|
||||||
|
* This program is free software; you can redistribute it and/or modify
|
||||||
|
* it under the terms of the GNU Library General Public License as
|
||||||
|
* published by the Free Software Foundation; either version 2, or
|
||||||
|
* (at your option) any later version.
|
||||||
|
*
|
||||||
|
* This program is distributed in the hope that it will be useful,
|
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
* GNU Library General Public License for more details
|
||||||
|
*
|
||||||
|
* You should have received a copy of the GNU Library General Public
|
||||||
|
* License along with this program; if not, write to the
|
||||||
|
* Free Software Foundation, Inc.,
|
||||||
|
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||||||
|
*/
|
||||||
|
|
||||||
Item {
|
import QtQuick 2.0
|
||||||
property int gridUnit: unitsM.paintedHeight
|
import QtQuick.Window 2.2
|
||||||
property int spacing: gridUnit / 3
|
|
||||||
|
|
||||||
Text {
|
pragma Singleton
|
||||||
id: unitsM
|
|
||||||
text: "M"
|
|
||||||
}
|
Object {
|
||||||
}
|
id: units
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The fundamental unit of space that should be used for sizes, expressed in pixels.
|
||||||
|
* Given the screen has an accurate DPI settings, it corresponds to a width of
|
||||||
|
* the capital letter M
|
||||||
|
*/
|
||||||
|
property int gridUnit: textSpacer.height
|
||||||
|
|
||||||
|
/**
|
||||||
|
* units.iconSizes provides access to platform-dependent icon sizing
|
||||||
|
*
|
||||||
|
* The icon sizes provided are normalized for different DPI, so icons
|
||||||
|
* will scale depending on the DPI.
|
||||||
|
*
|
||||||
|
* Icon sizes from KIconLoader, adjusted to devicePixelRatio:
|
||||||
|
* * small
|
||||||
|
* * smallMedium
|
||||||
|
* * medium
|
||||||
|
* * large
|
||||||
|
* * huge
|
||||||
|
* * enormous
|
||||||
|
*
|
||||||
|
* Not devicePixelRation-adjusted::
|
||||||
|
* * desktop
|
||||||
|
*/
|
||||||
|
property QtObject iconSizes: Object {
|
||||||
|
property int small: 16 * devicePixelRatio
|
||||||
|
property int smallMedium: 22 * devicePixelRatio
|
||||||
|
property int medium: 32 * devicePixelRatio
|
||||||
|
property int large: 48 * devicePixelRatio
|
||||||
|
property int huge: 64 * devicePixelRatio
|
||||||
|
property int enormous: 128 * devicePixelRatio
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* units.smallSpacing is the amount of spacing that should be used around smaller UI elements,
|
||||||
|
* for example as spacing in Columns. Internally, this size depends on the size of
|
||||||
|
* the default font as rendered on the screen, so it takes user-configured font size and DPI
|
||||||
|
* into account.
|
||||||
|
*/
|
||||||
|
property int smallSpacing: gridUnit/4
|
||||||
|
|
||||||
|
/**
|
||||||
|
* units.largeSpacing is the amount of spacing that should be used inside bigger UI elements,
|
||||||
|
* for example between an icon and the corresponding text. Internally, this size depends on
|
||||||
|
* the size of the default font as rendered on the screen, so it takes user-configured font
|
||||||
|
* size and DPI into account.
|
||||||
|
*/
|
||||||
|
property int largeSpacing: gridUnit
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The ratio between physical and device-independent pixels. This value does not depend on the \
|
||||||
|
* size of the configured font. If you want to take font sizes into account when scaling elements,
|
||||||
|
* use theme.mSize(theme.defaultFont), units.smallSpacing and units.largeSpacing.
|
||||||
|
* The devicePixelRatio follows the definition of "device independent pixel" by Microsoft.
|
||||||
|
*/
|
||||||
|
property real devicePixelRatio: Screen.devicePixelRatio
|
||||||
|
|
||||||
|
/**
|
||||||
|
* units.longDuration should be used for longer, screen-covering animations, for opening and
|
||||||
|
* closing of dialogs and other "not too small" animations
|
||||||
|
*/
|
||||||
|
property int longDuration: 250
|
||||||
|
|
||||||
|
/**
|
||||||
|
* units.shortDuration should be used for short animations, such as accentuating a UI event,
|
||||||
|
* hover events, etc..
|
||||||
|
*/
|
||||||
|
property int shortDuration: 150
|
||||||
|
|
||||||
|
Text {
|
||||||
|
id: textSpacer
|
||||||
|
text: "M"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue