mirrors/linphone-desktop
1
0
Fork 0
mirror of https://gitlab.linphone.org/BC/public/linphone-desktop.git synced 2026-01-23 22:58:15 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(DroppableTextArea): nice features, supports drag and drop/button click to select file

Browse source
This commit is contained in:
Ronan Abhamon 2016-10-14 17:07:53 +02:00
parent 3fbc24fd07
commit f8e4d72fe8
7 changed files with 124 additions and 85 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
tests/languages/en.ts
View file

@ -105,7 +105,18 @@
<name>DropZone</name>
<message>
<source>fileChooserTitle</source>
<translation>Please choose one or many files</translation>
<translation type="vanished">Please choose one or many files</translation>
</message>
</context>
<context>
<name>DroppableTextArea</name>
<message>
<source>fileChooserTitle</source>
<translation type="unfinished">Please choose one or many files</translation>
</message>
<message>
<source>DROP YOUR ATTACHMENT</source>
<translation type="unfinished"></translation>
</message>
</context>
<context>

13
tests/languages/fr.ts
View file

@ -105,7 +105,18 @@
<name>DropZone</name>
<message>
<source>fileChooserTitle</source>
<translation>Merci de choisir un ou plusieurs fichiers</translation>
<translation type="vanished">Merci de choisir un ou plusieurs fichiers</translation>
</message>
</context>
<context>
<name>DroppableTextArea</name>
<message>
<source>fileChooserTitle</source>
<translation type="unfinished">Merci de choisir un ou plusieurs fichiers</translation>
</message>
<message>
<source>DROP YOUR ATTACHMENT</source>
<translation type="unfinished"></translation>
</message>
</context>
<context>

1
tests/resources.qrc
View file

@ -34,7 +34,6 @@
<file>ui/modules/Common/Dialog/DialogDescription.qml</file>
<file>ui/modules/Common/Dialog/DialogPlus.qml</file>
<file>ui/modules/Common/DroppableTextArea.qml</file>
<file>ui/modules/Common/DropZone.qml</file>
<file>ui/modules/Common/ForceScrollBar.qml</file>
<file>ui/modules/Common/Form/AbstractTextButton.qml</file>
<file>ui/modules/Common/Form/ActionBar.qml</file>

4
tests/ui/modules/Common/Borders.qml
View file

@ -1,5 +1,9 @@
import QtQuick 2.7
// ===================================================================
// Alternative to rectangle border which is a limited feature.
// Allow the use of different borders (size, color...) for each
// rectangle side.
// ===================================================================
Item {

67
tests/ui/modules/Common/DropZone.qml
View file

@ -1,67 +0,0 @@
import QtQuick 2.7
import QtQuick.Dialogs 1.2
// ===================================================================
Rectangle {
signal dropped (var files)
color: '#DDDDDD'
id: dropZone
function emitFiles (files) {
// Filtering files, urls are forbidden.
files = files.reduce(function (files, file) {
var result = file.match(/^file:\/\/(.*)/)
if (result) {
files.push(result[1])
}
return files
}, [])
if (files.length > 0) {
dropped(files)
}
}
DropArea {
anchors.fill: parent
onDropped: {
dropZone.state = ''
if (drop.hasUrls) {
emitFiles(drop.urls)
}
}
onEntered: dropZone.state = 'hover'
onExited: dropZone.state = ''
}
MouseArea {
anchors.fill: parent
onClicked: fileDialog.visible = true
}
Image {
anchors.centerIn: parent
fillMode: Image.PreserveAspectFit
height: parent.height
source: 'qrc:/imgs/chat_attachment.svg'
width: parent.width
}
FileDialog {
folder: shortcuts.home
id: fileDialog
title: qsTr('fileChooserTitle')
onAccepted: emitFiles(fileDialog.fileUrls)
}
states: State {
name: 'hover'
PropertyChanges { target: dropZone; color: '#BBBBBB' }
}
}

108
tests/ui/modules/Common/DroppableTextArea.qml
View file

@ -1,23 +1,107 @@
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
import QtQuick.Dialogs 1.2
import Common.Styles 1.0
Item {
signal dropped (var files)
RowLayout {
property alias placeholderText: textArea.placeholderText
Flickable {
Layout.preferredHeight: parent.height
Layout.fillWidth: true
ScrollBar.vertical: ScrollBar { }
TextArea.flickable: TextArea {
id: textArea
function _emitFiles (files) {
// Filtering files, other urls are forbidden.
files = files.reduce(function (files, file) {
var result = file.match(/^file:\/\/(.*)/)
wrapMode: TextArea.Wrap
if (result) {
files.push(result[1])
}
return files
}, [])
if (files.length > 0) {
dropped(files)
}
}
DropZone {
Layout.preferredHeight: parent.height
Layout.preferredWidth: 40
// Text area.
Flickable {
ScrollBar.vertical: ForceScrollBar {
id: scrollBar
}
TextArea.flickable: TextArea {
id: textArea
rightPadding: fileChooserButton.width + fileChooserButton.anchors.rightMargin + 6
wrapMode: TextArea.Wrap
}
anchors.fill: parent
}
// Handle click to select files.
MouseArea {
id: fileChooserButton
anchors {
right: parent.right
rightMargin: scrollBar.width + 6
}
height: parent.height
width: 40
onClicked: fileDialog.open()
FileDialog {
id: fileDialog
folder: shortcuts.home
title: qsTr('fileChooserTitle')
onAccepted: _emitFiles(fileDialog.fileUrls)
}
Icon {
anchors.fill: parent
fillMode: Image.PreserveAspectFit
icon: 'chat_attachment'
}
}
// Hover style.
Rectangle {
id: hoverContent
anchors.fill: parent
color: '#FFFFFF'
visible: false
Text {
anchors.centerIn: parent
color: '#FE5E00'
font.pointSize: 11
text: qsTr('DROP YOUR ATTACHMENT')
}
}
DropArea {
anchors.fill: parent
keys: [ 'text/uri-list' ]
onDropped: {
state = ''
if (drop.hasUrls) {
_emitFiles(drop.urls)
}
}
onEntered: state = 'hover'
onExited: state = ''
states: State {
name: 'hover'
PropertyChanges { target: hoverContent; visible: true }
}
}
}

3
tests/ui/modules/Common/qmldir
View file

@ -21,9 +21,6 @@ Collapse 1.0 Collapse.qml
ConfirmDialog 1.0 Dialog/ConfirmDialog.qml
DialogPlus 1.0 Dialog/DialogPlus.qml
# DropZone
DropZone 1.0 DropZone.qml
# DroppableTextArea
DroppableTextArea 1.0 DroppableTextArea.qml