mirror of
https://github.com/subsurface/subsurface.git
synced 2024-12-01 06:30:26 +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 {
|
||||
property color accentColor: "#2d5b9a"
|
||||
property color accentTextColor: "#ececec"
|
||||
property color textColor: "#333333"
|
||||
property color backgroundColor: "#ececec"
|
||||
property color highlightColor: "#91c4e1"
|
||||
property color highlightTextColor: "#333333"
|
||||
}
|
||||
import QtQuick 2.0
|
||||
|
||||
pragma Singleton
|
||||
|
||||
/*!
|
||||
\qmltype Theme
|
||||
\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 {
|
||||
property int gridUnit: unitsM.paintedHeight
|
||||
property int spacing: gridUnit / 3
|
||||
import QtQuick 2.0
|
||||
import QtQuick.Window 2.2
|
||||
|
||||
Text {
|
||||
id: unitsM
|
||||
text: "M"
|
||||
}
|
||||
}
|
||||
pragma Singleton
|
||||
|
||||
|
||||
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…
Reference in a new issue