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

fix(app): refactoring

Browse source
This commit is contained in:
Ronan Abhamon 2016-09-14 14:10:55 +02:00
parent 1832297fa6
commit a2efc6fa55
26 changed files with 229 additions and 213 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

0
tests/imgs/phone.svg → tests/imgs/call.svg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

0
tests/imgs/camera.svg → tests/imgs/cam.svg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

0
tests/imgs/start_conference.svg → tests/imgs/conference.svg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.1 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

0
tests/imgs/avatar.svg → tests/imgs/contact.svg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 KiB

After

Width:  |  Height:  |  Size: 1.8 KiB

17
tests/imgs/delete.svg Normal file
View file

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="63px" height="82px" viewBox="0 0 63 82" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.3.3 (12081) - http://www.bohemiancoding.com/sketch -->
<title>delete</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="OUTILS" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="linphone_v2.0_icones_buttons" sketch:type="MSArtboardGroup" transform="translate(-1451.000000, -7131.000000)">
<g id="delete" sketch:type="MSLayerGroup" transform="translate(1426.000000, 7115.000000)">
<g transform="translate(27.000000, 19.000000)" stroke="#444444" id="Delete-icon" stroke-width="5" sketch:type="MSShapeGroup" stroke-linecap="round" stroke-linejoin="round">
<path d="M29.5231579,75.5263158 L34.8768421,75.5263158 C46.4010526,75.5263158 48.46,64.9796053 48.46,64.9796053 L58.3389474,10.9707368 L0.5,10.9707368 L10.38,64.9796053 C10.38,64.9796053 12.4410526,75.5263158 23.9652632,75.5263158 L29.5231579,75.5263158 L29.5231579,75.5263158 Z M22.7305263,24.4726842 L22.7305263,75.5263158 L22.7305263,24.4726842 Z M36.1094737,24.4726842 L36.1094737,75.5263158 L36.1094737,24.4726842 Z M17.5852632,9.09494702e-13 L41.2568421,9.09494702e-13 L17.5852632,9.09494702e-13 Z"></path>
</g>
<rect id="Rectangle-232-Copy-27" opacity="0" fill-opacity="0.7" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="120" height="120"></rect>
</g>
</g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.7 KiB

85
tests/resources.qrc
View file

@ -1,47 +1,42 @@
<!DOCTYPE RCC><RCC version="1.0">
<qresource prefix="/">
<!-- Languages. -->
<file>languages/en.qm</file>
<file>languages/fr.qm</file>
<!-- UI: Components. -->
<file>ui/components/collapse/Collapse.qml</file>
<file>ui/components/contact/Avatar.qml</file>
<file>ui/components/contact/ShortContactDescription.qml</file>
<file>ui/components/dialog/DialogDescription.qml</file>
<file>ui/components/dialog/DialogPlus.qml</file>
<file>ui/components/form/DarkButton.qml</file>
<file>ui/components/form/CheckBoxText.qml</file>
<file>ui/components/form/DropZone.qml</file>
<file>ui/components/form/ExclusiveButtons.qml</file>
<file>ui/components/form/LightButton.qml</file>
<file>ui/components/form/SmallButton.qml</file>
<file>ui/components/form/ToolBarButton.qml</file>
<file>ui/components/form/TransparentComboBox.qml</file>
<file>ui/components/misc/Contact.qml</file>
<file>ui/components/misc/MenuEntry.qml</file>
<file>ui/components/scrollBar/ForceScrollBar.qml</file>
<file>ui/components/select/SelectContact.qml</file>
<!-- UI: Views. -->
<file>ui/views/mainWindow/contacts.qml</file>
<file>ui/views/mainWindow/conversation.qml</file>
<file>ui/views/mainWindow/home.qml</file>
<file>ui/views/mainWindow/mainWindow.qml</file>
<file>ui/views/manageAccounts.qml</file>
<file>ui/views/newCall.qml</file>
<!-- Images. -->
<file>imgs/avatar.svg</file>
<file>imgs/camera.svg</file>
<file>imgs/chat_attachment.svg</file>
<file>imgs/collapse.svg</file>
<file>imgs/led_absent.svg</file>
<file>imgs/led_connected.svg</file>
<file>imgs/led_disconnected.svg</file>
<file>imgs/led_do_not_disturb.svg</file>
<file>imgs/phone.svg</file>
<file>imgs/start_conference.svg</file>
<file>imgs/valid.svg</file>
</qresource>
<qresource prefix="/">
<file>languages/fr.qm</file>
<file>languages/en.qm</file>
<file>ui/components/scrollBar/ForceScrollBar.qml</file>
<file>ui/components/misc/MenuEntry.qml</file>
<file>ui/components/select/SelectContact.qml</file>
<file>ui/components/collapse/Collapse.qml</file>
<file>ui/components/contact/Contact.qml</file>
<file>ui/components/contact/ShortContactDescription.qml</file>
<file>ui/components/contact/Avatar.qml</file>
<file>ui/components/dialog/DialogDescription.qml</file>
<file>ui/components/dialog/DialogPlus.qml</file>
<file>ui/components/form/CheckBoxText.qml</file>
<file>ui/components/form/DropZone.qml</file>
<file>ui/components/form/LightButton.qml</file>
<file>ui/components/form/ExclusiveButtons.qml</file>
<file>ui/components/form/ActionBar.qml</file>
<file>ui/components/form/ActionButton.qml</file>
<file>ui/components/form/TransparentComboBox.qml</file>
<file>ui/components/form/SmallButton.qml</file>
<file>ui/components/form/DarkButton.qml</file>
<file>ui/views/newCall.qml</file>
<file>ui/views/manageAccounts.qml</file>
<file>ui/views/mainWindow/mainWindow.qml</file>
<file>ui/views/mainWindow/contacts.qml</file>
<file>ui/views/mainWindow/home.qml</file>
<file>ui/views/mainWindow/conversation.qml</file>
<file>imgs/led_disconnected.svg</file>
<file>imgs/valid.svg</file>
<file>imgs/led_do_not_disturb.svg</file>
<file>imgs/conference.svg</file>
<file>imgs/cam.svg</file>
<file>imgs/chat_attachment.svg</file>
<file>imgs/led_connected.svg</file>
<file>imgs/led_absent.svg</file>
<file>imgs/call.svg</file>
<file>imgs/collapse.svg</file>
<file>imgs/delete.svg</file>
<file>imgs/contact.svg</file>
</qresource>
</RCC>

2
tests/ui/components/collapse/Collapse.qml
View file

@ -4,7 +4,6 @@ import QtQuick 2.7
Item {
property bool enabled: false
property alias image: backgroundImage.source
signal collapsed (bool collapsed)
@ -18,6 +17,7 @@ Item {
anchors.fill: parent
fillMode: Image.PreserveAspectFit
id: backgroundImage
source: 'qrc:/imgs/collapse.svg'
MouseArea {
anchors.fill: parent

14
tests/ui/components/contact/Avatar.qml
View file

@ -1,5 +1,5 @@
import QtQuick 2.7
import QtGraphicalEffects 1.0
import QtGraphicalEffects 1.0 // OpacityMask.
// ===================================================================
@ -44,8 +44,8 @@ Item {
// Avatar.
OpacityMask {
anchors.fill: imageToFilter
source: imageToFilter
maskSource: avatar
source: imageToFilter
}
// Presence.
@ -55,13 +55,9 @@ Item {
fillMode: Image.PreserveAspectFit
height: parent.height/ 3
id: presenceImage
source: (function () {
if (!presence) {
return ''
}
return 'qrc:/imgs/led_' + presence + '.svg'
})()
source: presence
? 'qrc:/imgs/led_' + presence + '.svg'
: ''
width: parent.width / 3
}
}

43
tests/ui/components/contact/Contact.qml Normal file
View file

@ -0,0 +1,43 @@
import QtQuick 2.7
import QtQuick.Layouts 1.3
import 'qrc:/ui/components/form'
// ===================================================================
Item {
property alias actions: actionBar.data
property alias image: avatar.image
property alias presence: avatar.presence
property alias sipAddress: contactDescription.sipAddress
property string username
id: contact
height: 50
RowLayout {
anchors.fill: parent
anchors.leftMargin: 14
anchors.rightMargin: 14
spacing: 14
Avatar {
Layout.preferredHeight: 32
Layout.preferredWidth: 32
id: avatar
username: contact.username
}
ShortContactDescription {
Layout.fillHeight: true
Layout.fillWidth: true
id: contactDescription
username: contact.username
}
ActionBar {
Layout.preferredHeight: 32
id: actionBar
}
}
}

8
tests/ui/components/contact/ShortContactDescription.qml
View file

@ -3,8 +3,8 @@ import QtQuick 2.7
// ===================================================================
Column {
property string sipAddress
property string username
property alias sipAddress: sipAddress.text
property alias username: username.text
// Username.
Text {
@ -13,7 +13,7 @@ Column {
font.pointSize: 11
font.weight: Font.DemiBold
height: parent.height / 2
text: username
id: username
verticalAlignment: Text.AlignBottom
width: parent.width
}
@ -23,7 +23,7 @@ Column {
clip: true
color: '#5A585B'
height: parent.height / 2
text: sipAddress
id: sipAddress
verticalAlignment: Text.AlignTop
width: parent.width
}

1
tests/ui/components/dialog/DialogDescription.qml
View file

@ -5,7 +5,6 @@ import QtQuick 2.7
// ===================================================================
Item {
property alias fontSize: description.font.pointSize
property alias text: description.text
height: text ? 90 : 25

2
tests/ui/components/dialog/DialogPlus.qml
View file

@ -7,7 +7,7 @@ import QtQuick.Window 2.2
// ===================================================================
Window {
default property alias contents: content.data // Required.
default property alias content: content.data // Required.
property alias buttons: buttons.data // Required.
property alias descriptionText: description.text // Optionnal.

10
tests/ui/components/form/ActionBar.qml Normal file
View file

@ -0,0 +1,10 @@
import QtQuick 2.7
// ===================================================================
// Bar which can contains ActionButton.
// ===================================================================
Row {
property int iconSize
spacing: 8
}

22
tests/ui/components/form/ActionButton.qml Normal file
View file

@ -0,0 +1,22 @@
import QtQuick 2.7
import QtQuick.Controls 2.0
// ===================================================================
// An animated small button with an image.
// ===================================================================
Button {
property int iconSize
property string icon
// Ugly hack, use current size, ActionBar size,
// or other parent height.
height: iconSize || parent.iconSize || parent.height
width: iconSize || parent.iconSize || parent.height
Image {
anchors.fill: parent
fillMode: Image.PreserveAspectFit
source: 'qrc:/imgs/' + parent.icon + '.svg'
}
}

16
tests/ui/components/form/CheckBoxText.qml
View file

@ -6,6 +6,14 @@ import QtQuick.Controls 2.0
// ===================================================================
CheckBox {
contentItem: Text {
color: checkBox.down ? '#FE5E00' : '#8E8E8E'
font: checkBox.font
horizontalAlignment: Text.AlignHCenter
leftPadding: checkBox.indicator.width + checkBox.spacing
text: checkBox.text
verticalAlignment: Text.AlignVCenter
}
id: checkBox
indicator: Rectangle {
border.color: checkBox.down ? '#FE5E00' : '#8E8E8E'
@ -25,12 +33,4 @@ CheckBox {
y: 4
}
}
contentItem: Text {
color: checkBox.down ? '#FE5E00' : '#8E8E8E'
font: checkBox.font
horizontalAlignment: Text.AlignHCenter
leftPadding: checkBox.indicator.width + checkBox.spacing
text: checkBox.text
verticalAlignment: Text.AlignVCenter
}
}

6
tests/ui/components/form/ExclusiveButtons.qml
View file

@ -12,13 +12,17 @@ Row {
Repeater {
model: texts
SmallButton {
anchors.verticalCenter: parent.verticalCenter
backgroundColor: selectedButton === index
? '#8E8E8E'
: (button.down
? '#FE5E00'
: '#D1D1D1'
: (button.hovered
? '#C0C0C0'
: '#D1D1D1'
)
)
id: button
text: modelData

1
tests/ui/components/form/LightButton.qml
View file

@ -1,5 +1,4 @@
import QtQuick 2.7
import QtQuick.Controls 2.0
// ===================================================================

8
tests/ui/components/form/SmallButton.qml
View file

@ -7,7 +7,12 @@ Button {
property alias backgroundColor: background.color
background: Rectangle {
color: button.down ? '#FE5E00' : '#8E8E8E'
color: button.down
? '#FE5E00'
: (button.hovered
? '#C0C0C0'
: '#D1D1D1'
)
id: background
implicitHeight: 22
radius: 10
@ -20,5 +25,6 @@ Button {
text: button.text
verticalAlignment: Text.AlignVCenter
}
hoverEnabled: true
id: button
}

14
tests/ui/components/form/ToolBarButton.qml
View file

@ -1,14 +0,0 @@
import QtQuick 2.7
import QtQuick.Controls 2.0
// ===================================================================
ToolButton {
property alias image: backgroundImage.source
Image {
anchors.fill: parent
fillMode: Image.PreserveAspectFit
id: backgroundImage
}
}

9
tests/ui/components/form/TransparentComboBox.qml
View file

@ -14,11 +14,10 @@ ComboBox {
background: Rectangle {
color: delegate.down
? '#FE5E00'
: (
comboBox.currentIndex === index
? '#F0F0F0'
: '#FFFFFF'
)
: (comboBox.currentIndex === index
? '#F0F0F0'
: '#FFFFFF'
)
opacity: enabled ? 1 : 0.3
}
font.weight: comboBox.currentIndex === index

75
tests/ui/components/misc/Contact.qml
View file

@ -1,75 +0,0 @@
import QtQuick 2.7
import QtQuick.Layouts 1.3
Item {
property alias sipAddress: sipAddressText.text
property alias username: usernameText.text
property string avatar: 'qrc:/imgs/avatar.svg' // Default.
id: contact
height: 50
RowLayout {
anchors.fill: parent
// Avatar.
Image {
Layout.fillHeight: parent.height
Layout.margins: 5
Layout.preferredWidth: 50
fillMode: Image.PreserveAspectFit
id: avatarImage
source: contact.avatar
}
// Sip address & username.
Column {
Layout.fillHeight: parent.height
Layout.fillWidth: true
// Username.
Text {
clip: true
color: '#5A585B'
font.weight: Font.DemiBold
height: parent.height / 2
id: usernameText
verticalAlignment: Text.AlignBottom
width: parent.width
}
// Sip address.
Text {
clip: true
color: '#5A585B'
height: parent.height / 2
id: sipAddressText
verticalAlignment: Text.AlignTop
width: parent.width
}
}
// Actions.
Row {
Layout.fillHeight: parent.height
Layout.preferredWidth: 90
Layout.margins: 10
// Call.
Image {
fillMode: Image.PreserveAspectFit
height: parent.height
source: 'qrc:/imgs/phone.svg'
width: parent.width / 2
}
// Camera.
Image {
fillMode: Image.PreserveAspectFit
height: parent.height
source: 'qrc:/imgs/camera.svg'
width: parent.width / 2
}
}
}
}

2
tests/ui/components/misc/MenuEntry.qml
View file

@ -13,6 +13,7 @@ Rectangle {
spacing: 10
Image {
fillMode: Image.PreserveAspectFit
height: parent.height
width: 30
}
@ -26,6 +27,7 @@ Rectangle {
}
Image {
fillMode: Image.PreserveAspectFit
height: parent.height
}
}

18
tests/ui/components/select/SelectContact.qml
View file

@ -2,12 +2,13 @@ import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.0
import 'qrc:/ui/components/misc'
import 'qrc:/ui/components/contact'
import 'qrc:/ui/components/form'
// TODO: Contacts list.
Item {
function setPopupVisibility (visibility) {
popup.visible = popupShadow.visible = visibility
popup.visible = true
}
function filterContacts (text) {
@ -92,9 +93,22 @@ Item {
}
delegate: Contact {
presence: $presence
sipAddress: $sipAddress
username: $username
width: parent.width
actions: [
ActionButton {
icon: 'call'
onClicked: console.log('clicked')
},
ActionButton {
icon: 'cam'
onClicked: console.log('cam clicked')
}
]
}
}
}

38
tests/ui/views/mainWindow/conversation.qml
View file

@ -48,40 +48,34 @@ ColumnLayout {
height: parent.height * 0.40
width: parent.width
Row {
height: parent.height
spacing: 10
ActionBar {
iconSize: 32
width: parent.width / 2
Rectangle {
color: 'blue'
width: 32
height: 32
ActionButton {
icon: 'cam'
onClicked: console.log('clicked!!!')
}
Rectangle {
color: 'red'
width: 32
height: 32
ActionButton {
icon: 'call'
onClicked: console.log('clicked!!!')
}
}
Row {
height: parent.height
ActionBar {
iconSize: 32
layoutDirection: Qt.RightToLeft
spacing: 10
width: parent.width / 2
Rectangle {
color: 'green'
width: 32
height: 32
ActionButton {
icon: 'delete'
onClicked: console.log('clicked!!!')
}
Rectangle {
color: 'orange'
width: 32
height: 32
ActionButton {
icon: 'contact'
onClicked: console.log('clicked!!!')
}
}
}

50
tests/ui/views/mainWindow/mainWindow.qml
View file

@ -8,6 +8,24 @@ import 'qrc:/ui/components/form'
import 'qrc:/ui/components/misc'
ApplicationWindow {
function openWindow (name) {
var component = Qt.createComponent('qrc:/ui/views/' + name + '.qml');
if (component.status !== Component.Ready) {
console.debug('Window not ready.')
if(component.status === Component.Error) {
console.debug('Error:' + component.errorString())
}
} else {
component.createObject(mainWindow).show()
}
}
id: mainWindow
minimumHeight: 70
minimumWidth: 780
title: 'Linphone'
visible: true
header: ToolBar {
background: Rectangle {
color: '#EAEAEA'
@ -24,7 +42,6 @@ ApplicationWindow {
Collapse {
Layout.preferredWidth: 25
Layout.fillHeight: parent.height
image: 'qrc:/imgs/collapse.svg'
onCollapsed: {
mainWindow.height = collapsed ? 500 : 70
}
@ -39,18 +56,12 @@ ApplicationWindow {
}
// User actions.
ToolBarButton {
onClicked: {
var component = Qt.createComponent('qrc:/ui/views/manageAccounts.qml');
if (component.status !== Component.Ready) {
console.debug('Window not ready.')
if(component.status === Component.Error) {
console.debug('Error:' + component.errorString())
}
} else {
component.createObject(mainWindow).show()
}
}
ActionButton {
onClicked: openWindow('manageAccounts')
}
ActionButton {
onClicked: openWindow('newCall')
}
// Search.
@ -68,18 +79,13 @@ ApplicationWindow {
}
// Start conference.
ToolBarButton {
Layout.fillHeight: parent.height
ActionButton {
Layout.preferredWidth: 32
image: 'qrc:/imgs/start_conference.svg'
Layout.preferredHeight: 32
icon: 'conference'
}
}
}
id: mainWindow
minimumHeight: 70
minimumWidth: 780
title: 'Linphone'
visible: true
RowLayout {
anchors.fill: parent
@ -123,7 +129,7 @@ ApplicationWindow {
Loader {
Layout.fillHeight: true
Layout.fillWidth: true
source: 'qrc:/ui/views/mainWindow/conversation.qml'
source: 'qrc:/ui/views/mainWindow/contacts.qml'
}
}
}

1
tests/ui/views/manageAccounts.qml
View file

@ -17,7 +17,6 @@ DialogPlus {
}
Item {
id: listViewContainer
anchors.fill: parent
ListView {