Commit 316c250c authored by camilo higuita's avatar camilo higuita
Browse files

add animate dimage viewer control. fix implicit height of toolbars based on...

add animate dimage viewer control. fix implicit height of toolbars based on contents implicit height. fix menuitem action row imp
parent c5896d15
......@@ -13,8 +13,7 @@ AbstractButton
hoverEnabled: true
contentItem: Item
{
{
Maui.X
{
height: Maui.Style.iconSizes.tiny
......
......@@ -121,6 +121,8 @@ Item
property int imageWidth : -1
property int imageHeight: -1
property bool smooth : false
/**
* iconComponent : Component
......@@ -138,7 +140,7 @@ Item
highlighted: control.isCurrentItem
hovered: control.hovered
smooth: control.smooth
iconSizeHint: control.iconSizeHint
fillMode: control.fillMode
......
/*
* SPDX-FileCopyrightText: (C) 2015 Vishesh Handa <vhanda@kde.org>
* SPDX-FileCopyrightText: (C) 2017 Atul Sharma <atulsharma406@gmail.com>
* SPDX-FileCopyrightText: (C) 2017 Marco Martin <mart@kde.org>
*
* SPDX-License-Identifier: LGPL-2.1-only OR LGPL-3.0-only OR LicenseRef-KDE-Accepted-LGPL
*/
import QtQuick 2.15
import QtQuick.Controls 2.15
import org.kde.kirigami 2.9 as Kirigami
Flickable
{
id: flick
property string currentImageSource
contentWidth: width
contentHeight: height
boundsBehavior: Flickable.StopAtBounds
boundsMovement: Flickable.StopAtBounds
interactive: contentWidth > width || contentHeight > height
clip: true
ScrollBar.vertical: ScrollBar {
visible: false
}
ScrollBar.horizontal: ScrollBar {
visible: false
}
/**
* image : Image
*/
property alias image: image
property alias sourceSize : image.sourceSize
/**
* fillMode : Image.fillMode
*/
property int fillMode: Image.PreserveAspectFit
/**
* asynchronous : bool
*/
property alias asynchronous : image.asynchronous
/**
* cache : bool
*/
property alias cache: image.cache
/**
* imageWidth : int
*/
property alias imageWidth: image.sourceSize.width
/**
* imageHeight : int
*/
property alias imageHeight: image.sourceSize.height
/**
* animated : bool
*/
property bool animated: false
/**
* source : url
*/
property alias source : image.source
/**
* rightClicked
*/
signal rightClicked()
/**
* pressAndHold
*/
signal pressAndHold()
PinchArea {
width: Math.max(flick.contentWidth, flick.width)
height: Math.max(flick.contentHeight, flick.height)
property real initialWidth
property real initialHeight
onPinchStarted: {
initialWidth = flick.contentWidth
initialHeight = flick.contentHeight
}
onPinchUpdated: {
// adjust content pos due to drag
flick.contentX += pinch.previousCenter.x - pinch.center.x
flick.contentY += pinch.previousCenter.y - pinch.center.y
// resize content
flick.resizeContent(Math.max(root.width*0.7, initialWidth * pinch.scale), Math.max(root.height*0.7, initialHeight * pinch.scale), pinch.center)
}
onPinchFinished: {
// Move its content within bounds.
if (flick.contentWidth < root.width ||
flick.contentHeight < root.height) {
zoomAnim.x = 0;
zoomAnim.y = 0;
zoomAnim.width = root.width;
zoomAnim.height = root.height;
zoomAnim.running = true;
} else {
flick.returnToBounds();
}
}
ParallelAnimation {
id: zoomAnim
property real x: 0
property real y: 0
property real width: root.width
property real height: root.height
NumberAnimation {
target: flick
property: "contentWidth"
from: flick.contentWidth
to: zoomAnim.width
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
}
NumberAnimation {
target: flick
property: "contentHeight"
from: flick.contentHeight
to: zoomAnim.height
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
}
NumberAnimation {
target: flick
property: "contentY"
from: flick.contentY
to: zoomAnim.y
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
}
NumberAnimation {
target: flick
property: "contentX"
from: flick.contentX
to: zoomAnim.x
duration: Kirigami.Units.longDuration
easing.type: Easing.InOutQuad
}
}
AnimatedImage {
id: image
width: flick.contentWidth
height: flick.contentHeight
fillMode: AnimatedImage.PreserveAspectFit
autoTransform: true
asynchronous: true
onStatusChanged: playing = (status == AnimatedImage.Ready)
BusyIndicator
{
anchors.centerIn: parent
running: parent.status === AnimatedImage.Loading
}
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.RightButton | Qt.LeftButton
onClicked: if(!Kirigami.Settings.isMobile && mouse.button === Qt.RightButton)
flick.rightClicked()
onPressAndHold: flick.pressAndHold()
onDoubleClicked: {
if (flick.interactive) {
zoomAnim.x = 0;
zoomAnim.y = 0;
zoomAnim.width = root.width;
zoomAnim.height = root.height;
zoomAnim.running = true;
flick.interactive = !flick.interactive
} else {
zoomAnim.x = mouse.x * 2;
zoomAnim.y = mouse.y *2;
zoomAnim.width = root.width * 3;
zoomAnim.height = root.height * 3;
zoomAnim.running = true;
flick.interactive = !flick.interactive
}
}
onWheel: {
if (wheel.modifiers & Qt.ControlModifier) {
if (wheel.angleDelta.y != 0) {
var factor = 1 + wheel.angleDelta.y / 600;
zoomAnim.running = false;
zoomAnim.width = Math.min(Math.max(root.width, zoomAnim.width * factor), root.width * 4);
zoomAnim.height = Math.min(Math.max(root.height, zoomAnim.height * factor), root.height * 4);
//actual factors, may be less than factor
var xFactor = zoomAnim.width / flick.contentWidth;
var yFactor = zoomAnim.height / flick.contentHeight;
zoomAnim.x = flick.contentX * xFactor + (((wheel.x - flick.contentX) * xFactor) - (wheel.x - flick.contentX))
zoomAnim.y = flick.contentY * yFactor + (((wheel.y - flick.contentY) * yFactor) - (wheel.y - flick.contentY))
zoomAnim.running = true;
} else if (wheel.pixelDelta.y != 0) {
flick.resizeContent(Math.min(Math.max(root.width, flick.contentWidth + wheel.pixelDelta.y), root.width * 4),
Math.min(Math.max(root.height, flick.contentHeight + wheel.pixelDelta.y), root.height * 4),
wheel);
}
} else {
flick.contentX += wheel.pixelDelta.x;
flick.contentY += wheel.pixelDelta.y;
}
}
}
}
}
/**
*
*/
function fit()
{
image.width = image.sourceSize.width
}
/**
*
*/
function fill()
{
image.width = parent.width
}
/**
*
*/
function rotateLeft()
{
image.rotation = image.rotation - 90
}
/**
*
*/
function rotateRight()
{
image.rotation = image.rotation + 90
}
}
......@@ -77,7 +77,7 @@ Item
property int imageWidth : -1
property int imageHeight : -1
property bool smooth: true
property bool smooth: false
Kirigami.Icon
{
......@@ -114,6 +114,7 @@ Item
cache: false
asynchronous: true
smooth: control.smooth
mipmap: false
layer.enabled: control.maskRadius
layer.effect: OpacityMask
......
......@@ -60,11 +60,6 @@ Flickable
*/
property alias imageHeight: image.sourceSize.height
/**
* animated : bool
*/
property bool animated: false
/**
* source : url
*/
......
......@@ -18,35 +18,37 @@ MenuItem
background: null
display : width > Kirigami.Units.gridUnit * 28 && control.actions.length <= 3 ? ToolButton.TextBesideIcon : (Kirigami.Settings.isMobile ? ToolButton.TextUnderIcon : ToolButton.IconOnly)
Loader
leftPadding: Maui.Style.space.medium
rightPadding: Maui.Style.space.medium
topPadding: 0
bottomPadding: 0
contentItem: Loader
{
id: _layoutLoader
asynchronous: true
anchors.fill: parent
anchors.leftMargin: Maui.Style.space.medium
anchors.rightMargin: Maui.Style.space.medium
sourceComponent: RowLayout
{
{
spacing: Maui.Style.space.medium
Repeater
{
id: _repeater
model: control.actions
delegate: ToolButton
{
id: _delegate
Layout.fillWidth: true
Layout.fillHeight: true
action: modelData
display: control.display
ToolTip.delay: 1000
ToolTip.timeout: 5000
ToolTip.visible: ( _delegate.hovered ) && _delegate.text.length
ToolTip.text: modelData.text
Connections
{
target: _delegate.action
......
......@@ -7,6 +7,7 @@ Item
id: control
visible: _layout.children.length
implicitWidth: _layout.implicitWidth
implicitHeight: _layout.implicitHeight
property alias spacing : _layout.spacing
default property alias content : _layout.data
property alias visibleChildren: _layout.visibleChildren
......
......@@ -62,6 +62,7 @@ ShareDialog 1.1 labs/ShareDialog.qml
ActionToolBar 1.1 labs/ActionToolBar.qml
ToolButtonAction 1.1 labs/ToolButtonAction.qml
ImageViewer 1.1 labs/ImageViewer.qml
AnimatedImageViewer 1.1 labs/AnimatedImageViewer.qml
TabsBrowser 1.1 labs/TabsBrowser.qml
SettingsDialog 1.1 labs/SettingsDialog.qml
......
......@@ -40,7 +40,8 @@ import QtQuick.Controls.Material.impl 2.12
import QtQuick.Templates 2.12 as T
import org.mauikit.controls 1.0 as Maui
T.Switch {
T.Switch
{
id: control
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
......@@ -50,13 +51,15 @@ T.Switch {
padding: 8
spacing: 8
indicator: SwitchIndicator {
indicator: SwitchIndicator
{
x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2
y: control.topPadding + (control.availableHeight - height) / 2
control: control
}
contentItem: Text {
contentItem: Text
{
leftPadding: control.indicator && !control.mirrored ? control.indicator.width + control.spacing : 0
rightPadding: control.indicator && control.mirrored ? control.indicator.width + control.spacing : 0
......@@ -67,7 +70,8 @@ T.Switch {
verticalAlignment: Text.AlignVCenter
}
background: Item {
background: Item
{
implicitHeight: Math.floor(Maui.Style.iconSizes.medium + (Maui.Style.space.medium * 1.25))
}
}
......@@ -55,7 +55,7 @@ T.ToolButton
hoverEnabled: !Kirigami.Settings.isMobile
padding: Maui.Style.space.small
spacing: Kirigami.Settings.isMobile ? Maui.Style.space.big : Maui.Style.space.small
spacing: Kirigami.Settings.isMobile ? Maui.Style.space.small : Maui.Style.space.small
rightPadding: Maui.Style.space.small
leftPadding: Maui.Style.space.small
topPadding: Maui.Style.space.small
......
......@@ -113,6 +113,7 @@ void MauiKit::registerTypes(const char *uri)
qmlRegisterType(componentUrl(QStringLiteral("labs/SettingsDialog.qml")), uri, 1, 1, "SettingsDialog");
qmlRegisterType(componentUrl(QStringLiteral("labs/SettingsSection.qml")), uri, 1, 1, "SettingsSection");
qmlRegisterType(componentUrl(QStringLiteral("labs/ImageViewer.qml")), uri, 1, 1, "ImageViewer");
qmlRegisterType(componentUrl(QStringLiteral("labs/AnimatedImageViewer.qml")), uri, 1, 1, "AnimatedImageViewer");
/** 1.2 **/
qmlRegisterType(componentUrl(QStringLiteral("labs/SettingTemplate.qml")), uri, 1, 2, "SettingTemplate");
......
......@@ -86,5 +86,6 @@
<file alias="labs/MenuItemActionRow.qml">controls/labs/MenuItemActionRow.qml</file>
<file alias="labs/GalleryRollTemplate.qml">controls/labs/GalleryRollTemplate.qml</file>
<file alias="labs/ImageViewer.qml">controls/labs/ImageViewer.qml</file>
<file alias="labs/AnimatedImageViewer.qml">controls/labs/AnimatedImageViewer.qml</file>
</qresource>
</RCC>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment