mirror of
https://git.jami.net/savoirfairelinux/jami-client-qt.git
synced 2025-09-10 03:53:23 +02:00
locationSharing: new icon design
GitLab: #987 Change-Id: I58befd7630e4632a4dc1286b4c692d6e5c0dd40e
This commit is contained in:
parent
cb568318a9
commit
f06ec3ae7a
9 changed files with 126 additions and 65 deletions
14
resources/icons/Localisation_Sharing_Send_Arrow.svg
Normal file
14
resources/icons/Localisation_Sharing_Send_Arrow.svg
Normal file
|
@ -0,0 +1,14 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 24.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 600 600" style="enable-background:new 0 0 600 600;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#005699;}
|
||||
</style>
|
||||
<g id="Layer_1">
|
||||
<path id="noun-arrow-1167262" class="st0" d="M202.8,225.1H324L160.6,388.5l27.9,27.9L351.8,253v121.2l39.4-0.3V185.7l-188.4-0.4
|
||||
V225.1z"/>
|
||||
</g>
|
||||
<g id="Layer_2">
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 581 B |
18
resources/icons/Localisation_Sharing_Send_Pin.svg
Normal file
18
resources/icons/Localisation_Sharing_Send_Pin.svg
Normal file
|
@ -0,0 +1,18 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 24.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 600 600" style="enable-background:new 0 0 600 600;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#005699;}
|
||||
</style>
|
||||
<g id="Layer_1">
|
||||
</g>
|
||||
<g id="Layer_2">
|
||||
<g id="noun-pin-106435">
|
||||
<path class="st0" d="M299.8,549.9l-14.2-12.8c-3.8-3.4-93.5-84.6-121.3-113.6c-45.2-41-72.6-98.6-75.9-161
|
||||
c0-117.7,94.8-212.6,211.4-212.6l0,0c116.5,0,211.4,94.8,211.4,211.4c0,59.2-28.6,116.6-87.4,175.4c-9.1,9-99.6,91.1-109.9,100.4
|
||||
L299.8,549.9z M299.8,92.1c-93.3,0-169.2,75.9-169.2,169.2c2.7,50.1,25.1,97.3,63.1,131.9c21.2,22,79.1,75.1,106.1,99.7
|
||||
c39.1-35.5,88.6-80.5,94.2-86.1c50.4-50.4,75-98,75-145.5C469,168.1,393.1,92.2,299.8,92.1L299.8,92.1z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 932 B |
|
@ -47,8 +47,6 @@ Item {
|
|||
|
||||
property alias presenceStatus: presenceIndicator.status
|
||||
property bool showPresenceIndicator: true
|
||||
property bool showSharePositionIndicator: false
|
||||
property bool showSharedPositionIndicator: false
|
||||
property alias fillMode: image.fillMode
|
||||
|
||||
onImageIdChanged: image.updateSource()
|
||||
|
@ -119,49 +117,5 @@ Item {
|
|||
size: root.width * JamiTheme.avatarPresenceRatio
|
||||
|
||||
visible: showPresenceIndicator
|
||||
}
|
||||
RowLayout {
|
||||
id: positionIndicatorLayout
|
||||
anchors.left: root.left
|
||||
anchors.leftMargin: -1
|
||||
anchors.bottom: root.bottom
|
||||
anchors.bottomMargin: -1
|
||||
spacing: 0
|
||||
property real sizeI: root.width * JamiTheme.avatarPresenceRatio
|
||||
Rectangle {
|
||||
id: sharePositionIndicator
|
||||
visible: showSharePositionIndicator
|
||||
Layout.preferredWidth: parent.sizeI
|
||||
Layout.preferredHeight: parent.sizeI
|
||||
color: JamiTheme.backgroundColor
|
||||
radius: parent.sizeI * 0.5
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
ColorOverlay {
|
||||
anchors.fill: parent
|
||||
source: parent
|
||||
color: JamiTheme.sharePositionIndicatorColor
|
||||
}
|
||||
source: JamiResources.my_location_svg
|
||||
}
|
||||
}
|
||||
Rectangle {
|
||||
id: sharedPositionIndicator
|
||||
visible: showSharedPositionIndicator
|
||||
Layout.preferredWidth: parent.sizeI
|
||||
Layout.preferredHeight: parent.sizeI
|
||||
color: JamiTheme.backgroundColor
|
||||
radius: parent.sizeI * 0.5
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
ColorOverlay {
|
||||
anchors.fill: parent
|
||||
source: parent
|
||||
color: JamiTheme.sharedPositionIndicatorColor
|
||||
}
|
||||
source: JamiResources.my_location_svg
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
@ -35,6 +35,8 @@ Item {
|
|||
property alias status: image.status
|
||||
property string color: "transparent"
|
||||
property bool hovered: false
|
||||
property bool mirrorHorizontally: false
|
||||
property bool mirrorVertically: false
|
||||
|
||||
property bool isSvg: {
|
||||
var match = /[^.]+$/.exec(source)
|
||||
|
@ -66,6 +68,8 @@ Item {
|
|||
antialiasing: true
|
||||
asynchronous: true
|
||||
visible: false
|
||||
mirror: root.mirrorHorizontally
|
||||
mirrorVertically: root.mirrorVertically
|
||||
|
||||
function setSourceSize() {
|
||||
sourceSize = undefined
|
||||
|
|
|
@ -102,7 +102,7 @@ Item {
|
|||
property color invertedNormalButtonColor: Qt.rgba(0, 0, 0, 0.75)
|
||||
|
||||
property color editLineColor: "#03b9e9"
|
||||
property color buttonTintedBlue: "#005699"
|
||||
property color buttonTintedBlue: darkTheme ? "#03B9E9" : "#005699"
|
||||
property color buttonTintedBlueHovered: "#0071c9"
|
||||
property color buttonTintedBlueInternalHover: Qt.rgba(0, 86, 153, 0.2)
|
||||
property color buttonTintedBluePressed: "#0071c9"
|
||||
|
@ -227,8 +227,8 @@ Item {
|
|||
//mapPosition
|
||||
property color mapButtonsOverlayColor: darkTheme ? "#000000" : "#f0f0f0"
|
||||
property color mapButtonColor: darkTheme ? "#f0f0f0" : "#000000"
|
||||
property color sharePositionIndicatorColor: red_
|
||||
property color sharedPositionIndicatorColor: urgentOrange_
|
||||
property color sharePositionIndicatorColor: buttonTintedBlue
|
||||
property color sharedPositionIndicatorColor: darkTheme ? whiteColor : blackColor
|
||||
|
||||
//EmojiReact
|
||||
property real emojiBubbleSize: calcSize(17)
|
||||
|
|
45
src/app/mainview/components/BlinkingLocationIcon.qml
Normal file
45
src/app/mainview/components/BlinkingLocationIcon.qml
Normal file
|
@ -0,0 +1,45 @@
|
|||
/*
|
||||
* Copyright (C) 2023 Savoir-faire Linux Inc.
|
||||
*
|
||||
* 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 3 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 <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import net.jami.Constants 1.1
|
||||
|
||||
|
||||
import "../../commoncomponents"
|
||||
|
||||
ResponsiveImage {
|
||||
id: root
|
||||
|
||||
property bool isSharing: false
|
||||
property bool arrowTimerVisibility
|
||||
source: JamiResources.localisation_sharing_send_pin_svg
|
||||
|
||||
ResponsiveImage {
|
||||
id: arrowSharePosition
|
||||
|
||||
visible: arrowTimerVisibility
|
||||
source: JamiResources.localisation_sharing_send_arrow_svg
|
||||
color: root.color
|
||||
mirrorHorizontally: isSharing ? false : true
|
||||
mirrorVertically: isSharing ? false : true
|
||||
anchors.fill: parent
|
||||
anchors.bottomMargin: isSharing ? 0 : 4
|
||||
anchors.leftMargin: isSharing ? 0 : 3
|
||||
}
|
||||
}
|
||||
|
|
@ -28,8 +28,6 @@ Item {
|
|||
|
||||
property alias imageId: avatar.imageId
|
||||
property alias showPresenceIndicator: avatar.showPresenceIndicator
|
||||
property alias showSharePositionIndicator: avatar.showSharePositionIndicator
|
||||
property alias showSharedPositionIndicator: avatar.showSharedPositionIndicator
|
||||
property alias animationMode: animation.mode
|
||||
|
||||
SpinningAnimation {
|
||||
|
|
|
@ -474,6 +474,19 @@ BaseView {
|
|||
}
|
||||
}
|
||||
currentIndex: model.currentFilteredRow
|
||||
|
||||
Timer {
|
||||
id: locationIconTimer
|
||||
|
||||
property bool showIconArrow: true
|
||||
property bool isSharingPosition: PositionManager.positionShareConvIdsCount !== 0
|
||||
property bool isReceivingPosition: PositionManager.sharingUrisCount !== 0
|
||||
|
||||
interval: 750
|
||||
running: isSharingPosition || isReceivingPosition
|
||||
repeat: true
|
||||
onTriggered: {showIconArrow = !showIconArrow}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -53,6 +53,19 @@ ItemDelegate {
|
|||
}
|
||||
}
|
||||
|
||||
property bool showSharePositionIndicator: PositionManager.isPositionSharedToConv(accountId, UID)
|
||||
property bool showSharedPositionIndicator: PositionManager.isConvSharingPosition(accountId, UID)
|
||||
|
||||
Connections {
|
||||
target: PositionManager
|
||||
function onPositionShareConvIdsCountChanged () {
|
||||
root.showSharePositionIndicator = PositionManager.isPositionSharedToConv(accountId, UID)
|
||||
}
|
||||
function onSharingUrisCountChanged () {
|
||||
root.showSharedPositionIndicator = PositionManager.isConvSharingPosition(accountId, UID)
|
||||
}
|
||||
}
|
||||
|
||||
onVisibleChanged: {
|
||||
if (visible)
|
||||
return
|
||||
|
@ -68,7 +81,7 @@ ItemDelegate {
|
|||
|
||||
Component.onCompleted: {
|
||||
// Store to avoid undefined at the end
|
||||
root.accountId = CurrentAccount.id
|
||||
root.accountId = Qt.binding(() => CurrentAccount.id)
|
||||
root.convId = UID
|
||||
}
|
||||
|
||||
|
@ -87,22 +100,10 @@ ItemDelegate {
|
|||
|
||||
imageId: UID
|
||||
showPresenceIndicator: Presence !== undefined ? Presence : false
|
||||
showSharePositionIndicator: PositionManager.isPositionSharedToConv(CurrentAccount.id, UID)
|
||||
showSharedPositionIndicator: PositionManager.isConvSharingPosition(CurrentAccount.id, UID)
|
||||
|
||||
Layout.preferredWidth: JamiTheme.smartListAvatarSize
|
||||
Layout.preferredHeight: JamiTheme.smartListAvatarSize
|
||||
|
||||
Connections {
|
||||
target: PositionManager
|
||||
function onPositionShareConvIdsCountChanged () {
|
||||
avatar.showSharePositionIndicator = PositionManager.isPositionSharedToConv(CurrentAccount.id, UID)
|
||||
}
|
||||
function onSharingUrisCountChanged () {
|
||||
avatar.showSharedPositionIndicator = PositionManager.isConvSharingPosition(CurrentAccount.id, UID)
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
id: overlayHighlighted
|
||||
visible: highlighted && !interactive
|
||||
|
@ -209,6 +210,20 @@ ItemDelegate {
|
|||
color: JamiTheme.primaryForegroundColor
|
||||
}
|
||||
|
||||
BlinkingLocationIcon {
|
||||
isSharing: true
|
||||
visible: showSharePositionIndicator
|
||||
arrowTimerVisibility: locationIconTimer.showIconArrow
|
||||
color: JamiTheme.sharePositionIndicatorColor
|
||||
}
|
||||
|
||||
BlinkingLocationIcon {
|
||||
isSharing: false
|
||||
visible: showSharedPositionIndicator
|
||||
arrowTimerVisibility: locationIconTimer.showIconArrow
|
||||
color: JamiTheme.sharedPositionIndicatorColor
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
Layout.fillHeight: true
|
||||
spacing: 2
|
||||
|
|
Loading…
Add table
Reference in a new issue