yukijoou/kwin
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
kwin/tabbox/qml/clients/thumbnails/contents/ui/main.qml

205 lines
7.8 KiB
QML
Raw Normal View History

Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
/********************************************************************
KWin - the KDE window manager
This file is part of the KDE project.
Copyright (C) 2011 Martin Gräßlin <mgraesslin@kde.org>
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 2 of the License, 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 General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>.
*********************************************************************/
import QtQuick 1.0
import org.kde.plasma.core 0.1 as PlasmaCore
import org.kde.qtextracomponents 0.1
import org.kde.kwin 0.1 as KWin
Item {
id: thumbnailTabBox
property int screenWidth : 1
property int screenHeight : 1
property real screenFactor: screenWidth/screenHeight
property int imagePathPrefix: (new Date()).getTime()
use qml and svg to drag shadow in tabbox due to plasma change, shadow is not included by default, hence kwin tabbox need to handle shadow by itself, and due to kwin is compositor and have shadow as effects, it's not a good idea to use X property to pass shadow from kwin to X and to kwin. This change use the old way to draw shadow side the tabbox, and partly move the blur region setting to qml. REVIEW: 108243
2013-01-10 07:55:08 +00:00
property int optimalWidth: (thumbnailListView.thumbnailWidth + hoverItem.margins.left + hoverItem.margins.right) * thumbnailListView.count + background.leftMargin + background.bottomMargin
property int optimalHeight: thumbnailListView.thumbnailWidth*(1.0/screenFactor) + hoverItem.margins.top + hoverItem.margins.bottom + background.topMargin + background.bottomMargin + 40
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
property bool canStretchX: false
property bool canStretchY: false
Use translucent/dialogs/background elements where possible In effects it's obvious that compositing is enabled, so specifying the translucent element is no problem. In tabbox a context property "compositing" is injected which decides whether "translucent" or "opaque" elements should be used. Here the translucent elements are only used if the Blur effect is available - for this a new Effect::Feature Blur is introduced and in addition it is tested whether the theme provides the translucent element. Also the masking is adjusted to ensure that only the shadow is not blurred. Reason for this change is that Plasma theme seems not always to pick up whether compositing is used when used from inside KWin. It does not cover the Desktop Change OSD which uses PlasmaCore.Dialog and there we cannot (yet) inject that we use compositing. Overall I'm quite unhappy with this patch and I do hope we can fix it in the proper place in the lifetime of 4.10 and revert this patch. CCBUG: 311995 REVIEW: 108438
2013-01-16 13:50:43 +00:00
property string maskImagePath: background.maskImagePath
use qml and svg to drag shadow in tabbox due to plasma change, shadow is not included by default, hence kwin tabbox need to handle shadow by itself, and due to kwin is compositor and have shadow as effects, it's not a good idea to use X property to pass shadow from kwin to X and to kwin. This change use the old way to draw shadow side the tabbox, and partly move the blur region setting to qml. REVIEW: 108243
2013-01-10 07:55:08 +00:00
property double maskWidth: background.centerWidth
property double maskHeight: background.centerHeight
property int maskTopMargin: background.centerTopMargin
property int maskLeftMargin: background.centerLeftMargin
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
width: Math.min(Math.max(screenWidth * 0.3, optimalWidth), screenWidth * 0.9)
height: Math.min(Math.max(screenHeight * 0.15, optimalHeight), screenHeight * 0.7)
clip: true
Add proper key navigation to layout based window switchers The grabbed key events inside TabBox are forwarded to the declarative view which passes it to the normal keyPressedEvent() method. This allows the QML files to handle keyboard navigation themselves. The views support key navigation natively, though this cannot be used as we need to update the ModelIndex when a new item is selected. Also there seems to be a problem if the tabbox is shown again, in that case the focus seems to be somehow lost. Because of that the navigation is handled in the Item embedding the list. REVIEW: 104357 FEATURE: 291916 FIXED-IN: 4.9.0
2012-03-20 19:01:46 +00:00
focus: true
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
function setModel(model) {
thumbnailListView.model = model;
thumbnailListView.imageId++;
}
function modelChanged() {
thumbnailListView.imageId++;
}
use qml and svg to drag shadow in tabbox due to plasma change, shadow is not included by default, hence kwin tabbox need to handle shadow by itself, and due to kwin is compositor and have shadow as effects, it's not a good idea to use X property to pass shadow from kwin to X and to kwin. This change use the old way to draw shadow side the tabbox, and partly move the blur region setting to qml. REVIEW: 108243
2013-01-10 07:55:08 +00:00
ShadowedSvgItem {
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
id: background
anchors.fill: parent
}
// just to get the margin sizes
PlasmaCore.FrameSvgItem {
id: hoverItem
imagePath: "widgets/viewitem"
prefix: "hover"
visible: false
}
PlasmaCore.Theme {
id: theme
}
ListView {
signal currentIndexChanged(int index)
id: thumbnailListView
objectName: "listView"
orientation: ListView.Horizontal
// used for image provider URL to trick Qt into reloading icons when the model changes
property int imageId: 0
property int thumbnailWidth: 300
height: thumbnailWidth * (1.0/screenFactor) + hoverItem.margins.bottom + hoverItem.margins.top
spacing: 5
Setting a maximum highlight move duration on the TabBox layouts Makes the wrapping around the corners much more usable...
2011-11-12 21:16:02 +00:00
highlightMoveDuration: 250
Horizontal center the Thumbnail ListView This ensures that also for a small TabBox with just one item the thumbnail is nicely centered. REVIEW: 104541 CCBUG: 297856
2012-04-10 19:58:18 +00:00
width: Math.min(parent.width - (anchors.leftMargin + anchors.rightMargin) - (hoverItem.margins.left + hoverItem.margins.right), thumbnailWidth * count + 5 * (count - 1))
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
anchors {
top: parent.top
use qml and svg to drag shadow in tabbox due to plasma change, shadow is not included by default, hence kwin tabbox need to handle shadow by itself, and due to kwin is compositor and have shadow as effects, it's not a good idea to use X property to pass shadow from kwin to X and to kwin. This change use the old way to draw shadow side the tabbox, and partly move the blur region setting to qml. REVIEW: 108243
2013-01-10 07:55:08 +00:00
topMargin: background.topMargin
leftMargin: background.leftMargin
rightMargin: background.rightMargin
bottomMargin: background.bottomMargin
Horizontal center the Thumbnail ListView This ensures that also for a small TabBox with just one item the thumbnail is nicely centered. REVIEW: 104541 CCBUG: 297856
2012-04-10 19:58:18 +00:00
horizontalCenter: parent.horizontalCenter
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
}
clip: true
delegate: Item {
property alias data: thumbnailItem.data
id: delegateItem
width: thumbnailListView.thumbnailWidth
height: thumbnailListView.thumbnailWidth*(1.0/screenFactor)
KWin.ThumbnailItem {
property variant data: model
id: thumbnailItem
wId: windowId
anchors {
fill: parent
leftMargin: hoverItem.margins.left
rightMargin: hoverItem.margins.right
topMargin: hoverItem.margins.top
bottomMargin: hoverItem.margins.bottom
}
}
Move mouse area into the delegate Fixes mouse clicks not being accepted in TabBox in case the view had started to scroll.
2011-12-04 17:53:48 +00:00
MouseArea {
anchors.fill: parent
onClicked: {
thumbnailListView.currentIndex = index;
thumbnailListView.currentIndexChanged(thumbnailListView.currentIndex);
}
}
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
}
highlight: PlasmaCore.FrameSvgItem {
id: highlightItem
imagePath: "widgets/viewitem"
prefix: "hover"
width: thumbnailListView.thumbnailWidth
height: thumbnailListView.thumbnailWidth*(1.0/screenFactor)
}
Window Switching layouts are not flickable over bounds Flicking has to stop at the bounds in the window switcher layouts. It's not natural on the desktop that they are flickable in the first place. Window Strip is unchanged as this layout is intended to be used on touch and flickable user experiences. REVIEW: 105001
2012-05-20 19:00:48 +00:00
boundsBehavior: Flickable.StopAtBounds
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
}
Item {
height: 40
Constrain width of text element in Thumbnail Layout Fixes a layouting issue when caption does not fit into the window switcher box. REVIEW: 104507 CCBUG: 297028
2012-04-09 09:28:04 +00:00
id: captionFrame
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
anchors {
top: thumbnailListView.bottom
left: parent.left
right: parent.right
bottom: parent.bottom
topMargin: hoverItem.margins.bottom
use qml and svg to drag shadow in tabbox due to plasma change, shadow is not included by default, hence kwin tabbox need to handle shadow by itself, and due to kwin is compositor and have shadow as effects, it's not a good idea to use X property to pass shadow from kwin to X and to kwin. This change use the old way to draw shadow side the tabbox, and partly move the blur region setting to qml. REVIEW: 108243
2013-01-10 07:55:08 +00:00
leftMargin: background.leftMargin
rightMargin: background.rightMargin
bottomMargin: background.bottomMargin
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
}
Image {
id: iconItem
source: "image://client/" + thumbnailListView.currentIndex + "/" + thumbnailTabBox.imagePathPrefix + "-" + thumbnailListView.imageId
width: 32
height: 32
sourceSize {
width: 32
height: 32
}
anchors {
verticalCenter: parent.verticalCenter
right: textItem.left
rightMargin: 4
}
}
Text {
Constrain width of text element in Thumbnail Layout Fixes a layouting issue when caption does not fit into the window switcher box. REVIEW: 104507 CCBUG: 297028
2012-04-09 09:28:04 +00:00
function constrainWidth() {
if (textItem.width > textItem.maxWidth && textItem.width > 0 && textItem.maxWidth > 0) {
textItem.width = textItem.maxWidth;
} else {
textItem.width = undefined;
}
}
function calculateMaxWidth() {
textItem.maxWidth = thumbnailTabBox.width - captionFrame.anchors.leftMargin - captionFrame.anchors.rightMargin - iconItem.width * 2 - captionFrame.anchors.rightMargin;
}
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
id: textItem
Constrain width of text element in Thumbnail Layout Fixes a layouting issue when caption does not fit into the window switcher box. REVIEW: 104507 CCBUG: 297028
2012-04-09 09:28:04 +00:00
property int maxWidth: 0
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
text: thumbnailListView.currentItem ? thumbnailListView.currentItem.data.caption : ""
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
color: theme.textColor
Constrain width of text element in Thumbnail Layout Fixes a layouting issue when caption does not fit into the window switcher box. REVIEW: 104507 CCBUG: 297028
2012-04-09 09:28:04 +00:00
elide: Text.ElideMiddle
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
font {
bold: true
}
anchors {
verticalCenter: parent.verticalCenter
horizontalCenter: parent.horizontalCenter
}
Constrain width of text element in Thumbnail Layout Fixes a layouting issue when caption does not fit into the window switcher box. REVIEW: 104507 CCBUG: 297028
2012-04-09 09:28:04 +00:00
onTextChanged: textItem.constrainWidth()
Component.onCompleted: textItem.calculateMaxWidth()
Connections {
target: thumbnailTabBox
onWidthChanged: {
textItem.calculateMaxWidth();
textItem.constrainWidth();
}
}
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
}
}
Add proper key navigation to layout based window switchers The grabbed key events inside TabBox are forwarded to the declarative view which passes it to the normal keyPressedEvent() method. This allows the QML files to handle keyboard navigation themselves. The views support key navigation natively, though this cannot be used as we need to update the ModelIndex when a new item is selected. Also there seems to be a problem if the tabbox is shown again, in that case the focus seems to be somehow lost. Because of that the navigation is handled in the Item embedding the list. REVIEW: 104357 FEATURE: 291916 FIXED-IN: 4.9.0
2012-03-20 19:01:46 +00:00
/*
* Key navigation on outer item for two reasons:
* @li we have to emit the change signal
* @li on multiple invocation it does not work on the list view. Focus seems to be lost.
**/
Keys.onPressed: {
if (event.key == Qt.Key_Left) {
thumbnailListView.decrementCurrentIndex();
thumbnailListView.currentIndexChanged(thumbnailListView.currentIndex);
} else if (event.key == Qt.Key_Right) {
thumbnailListView.incrementCurrentIndex();
thumbnailListView.currentIndexChanged(thumbnailListView.currentIndex);
}
}
Window Thumbnail support for QML A new QML item "ThumbnailItem" is registered to the TabBox. The C++ implementation finds the EffectWindow of the TabBox and adds itself to the EffectWindow. While rendering the EffectWindow the information for all registered ThumbnailItems are extracted and the thumbnail is rendered on top of the EffectWindow. This has obvious limitations like you cannot put other QML items on top of the thumbnail. Nevertheless it works well enough to be a possible replacement for e.g. BoxSwitch effect. When compositing is disabled an icon is rendered instead of the Thumbnail. One TabBox Layout inspired by BoxSwitch Effect is added. For the KCM small pre-rendered items are used. REVIEW: 103039
2011-11-10 13:28:06 +00:00
}
Reference in a new issue Copy permalink