Commit 2be59c99 authored by Ronan's avatar Ronan
Browse files

feat(ui/modules/Linphone/Chat): use a custom QML2 `BusyIndicator`

parent fdb937f5
......@@ -134,6 +134,7 @@
<file>assets/images/video_call_pressed.svg</file>
<file>ui/modules/Common/Animations/CaterpillarAnimation.qml</file>
<file>ui/modules/Common/Borders.qml</file>
<file>ui/modules/Common/BusyIndicator.qml</file>
<file>ui/modules/Common/Collapse.qml</file>
<file>ui/modules/Common/Colors.qml</file>
<file>ui/modules/Common/Constants.qml</file>
......@@ -172,6 +173,7 @@
<file>ui/modules/Common/SearchBox.qml</file>
<file>ui/modules/Common/SmartConnect.qml</file>
<file>ui/modules/Common/Styles/Animations/CaterpillarAnimationStyle.qml</file>
<file>ui/modules/Common/Styles/BusyIndicatorStyle.qml</file>
<file>ui/modules/Common/Styles/CollapseStyle.qml</file>
<file>ui/modules/Common/Styles/DialogStyle.qml</file>
<file>ui/modules/Common/Styles/DroppableTextAreaStyle.qml</file>
......
import QtQuick 2.7
import QtQuick.Controls 2.0
import Common.Styles 1.0
// =============================================================================
BusyIndicator {
id: busyIndicator
// ---------------------------------------------------------------------------
readonly property int _rotation: 360
readonly property int _size: width < height ? width : height
// ---------------------------------------------------------------------------
contentItem: Item {
x: parent.width / 2 - width / 2
y: parent.height / 2 - height / 2
height: _size
width: _size
Item {
id: item
height: parent.height
width: parent.width
// -----------------------------------------------------------------------
// Animation.
// -----------------------------------------------------------------------
RotationAnimator {
duration: BusyIndicatorStyle.duration
loops: Animation.Infinite
running: busyIndicator.visible && busyIndicator.running
target: item
from: 0
to: busyIndicator._rotation
}
// -----------------------------------------------------------------------
// Items to draw.
// -----------------------------------------------------------------------
Repeater {
id: repeater
model: BusyIndicatorStyle.nSpheres
Rectangle {
x: item.width / 2 - width / 2
y: item.height / 2 - height / 2
height: item.height / 3
width: item.width / 3
color: BusyIndicatorStyle.color
radius: (width > height ? width : height) / 2
transform: [
Translate {
y: busyIndicator._size / 2
},
Rotation {
angle: index / repeater.count * busyIndicator._rotation
origin {
x: width / 2
y: height / 2
}
}
]
}
}
}
}
}
pragma Singleton
import QtQuick 2.7
import Common 1.0
// =============================================================================
QtObject {
property color color: Colors.i
property int duration: 1250
property int nSpheres: 6
}
......@@ -4,6 +4,8 @@ module Common.Styles
# Components styles ------------------------------------------------------------
singleton BusyIndicatorStyle 1.0 BusyIndicatorStyle.qml
singleton CaterpillarAnimationStyle 1.0 Animations/CaterpillarAnimationStyle.qml
singleton CollapseStyle 1.0 CollapseStyle.qml
......
# ====================================================================
# ==============================================================================
# Common's components to export.
# ====================================================================
# ==============================================================================
module Common
# Constants ----------------------------------------------------------
# Constants --------------------------------------------------------------------
singleton Colors 1.0 Colors.qml
singleton Constants 1.0 Constants.qml
# Components ---------------------------------------------------------
# Components -------------------------------------------------------------------
# Animations
CaterpillarAnimation 1.0 Animations/CaterpillarAnimation.qml
......@@ -17,6 +17,9 @@ CaterpillarAnimation 1.0 Animations/CaterpillarAnimation.qml
# Chat
Borders 1.0 Borders.qml
# BusyIndicator
BusyIndicator 1.0 BusyIndicator.qml
# Collapse
Collapse 1.0 Collapse.qml
......
......@@ -223,13 +223,13 @@ Row {
Component {
id: indicator
BusyIndicator {
width: ChatStyle.entry.message.outgoing.sendIconSize
}
BusyIndicator {}
}
Loader {
height: ChatStyle.entry.lineHeight
width: ChatStyle.entry.message.outgoing.sendIconSize
sourceComponent: $chatEntry.isOutgoing
? (
$chatEntry.status === ChatModel.MessageStatusInProgress
......
......@@ -52,13 +52,13 @@ Item {
Component {
id: indicator
BusyIndicator {
width: ChatStyle.entry.message.outgoing.sendIconSize
}
BusyIndicator {}
}
Loader {
height: ChatStyle.entry.lineHeight
width: ChatStyle.entry.message.outgoing.sendIconSize
sourceComponent: $chatEntry.status === ChatModel.MessageStatusInProgress
? indicator
: icon
......
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