Commit 63cb3341 authored by Sandro Andrade's avatar Sandro Andrade
Browse files

Major refactoring in QML modules

parent a58d3b38
......@@ -5,11 +5,15 @@
<file alias="BlackKey.qml">qml/BlackKey.qml</file>
<file alias="Octave.qml">qml/Octave.qml</file>
<file alias="PianoView.qml">qml/PianoView.qml</file>
<file alias="MultimediaButton.qml">qml/MultimediaButton.qml</file>
<file alias="MultimediaSlider.qml">qml/MultimediaSlider.qml</file>
<file alias="MidiPlayer.qml">qml/MidiPlayer.qml</file>
<file alias="images/minuet-background.png">qml/images/minuet-background.png</file>
<file alias="images/navigate-next.png">qml/images/navigate-next.png</file>
<file alias="images/multimedia-pause.png">qml/images/multimedia-pause.png</file>
<file alias="images/multimedia-play.png">qml/images/multimedia-play.png</file>
<file alias="images/multimedia-stop.png">qml/images/multimedia-stop.png</file>
<file alias="images/multimedia-volume.png">qml/images/multimedia-volume.png</file>
<file alias="images/multimedia-speed.png">qml/images/multimedia-speed.png</file>
</qresource>
</RCC>
......@@ -4,9 +4,13 @@ Rectangle {
property Item anchor;
width: 0.6*keyWidth; height: 0.6*keyHeight
anchors { left: anchor.right; leftMargin: -(0.6*keyWidth)/2; top: anchor.top }
border { width: 1; color: "black" }
color: mouseArea.pressed ? "#475057" : "black"
MouseArea { id: mouseArea; anchors.fill: parent }
anchors { left: anchor.right; leftMargin: -(0.6*keyWidth)/2; top: anchor.top }
z: 1
MouseArea {
id: mouseArea
anchors.fill: parent
}
}
\ No newline at end of file
......@@ -3,69 +3,61 @@ import QtQuick.Controls 1.4
Rectangle {
width: menuBarWidth; height: 100
color: "black"
anchors { left: parent.left; bottom: parent.bottom }
color: "black"
Item {
id: item1
width: parent.width / 2; height: parent.height
anchors { left: parent.left; bottom: parent.bottom }
width: parent.width / 2 - 8; height: childrenRect.height
anchors { left: parent.left; leftMargin: 8; verticalCenter: parent.verticalCenter }
Text {
id: playbackTime
width: item1.width
width: item1.width;
horizontalAlignment: Text.AlignHCenter
text: "00:00:00"
font.pointSize: 24
color: "#008000"
}
Item {
id: item11
width: item1.width / 3
anchors { top: playbackTime.bottom }
Image {
id: playImage
anchors.horizontalCenter: parent.horizontalCenter
source: "qrc:/images/multimedia-play.png"
width: 24; height: 24
}
Text { id: playText; text: "Play"; color: "white"; width: item11.width; horizontalAlignment: Text.AlignHCenter; anchors.top: playImage.bottom }
}
Item {
MultimediaButton {
id: item12
width: item1.width / 3
anchors { top: playbackTime.bottom; left: item11.right }
Image {
id: pauseImage
anchors.horizontalCenter: parent.horizontalCenter
source: "qrc:/images/multimedia-pause.png"
width: 24; height: 24
}
Text { id: pauseText; text: "Pause"; color: "white"; width: item11.width; horizontalAlignment: Text.AlignHCenter; anchors.top: pauseImage.bottom }
anchors { top: playbackTime.bottom; horizontalCenter: playbackTime.horizontalCenter }
source: "qrc:/images/multimedia-pause.png"
text: "Pause"
}
MultimediaButton {
anchors { top: playbackTime.bottom; right: item12.left; rightMargin: -2 }
source: "qrc:/images/multimedia-play.png"
text: "Play"
}
Item {
id: item13
width: item1.width / 3
anchors { top: playbackTime.bottom; left: item12.right }
Image {
id: stopImage
anchors.horizontalCenter: parent.horizontalCenter
source: "qrc:/images/multimedia-stop.png"
width: 24; height: 24
}
Text { id: stopText; text: "Stop"; color: "white"; width: item11.width; horizontalAlignment: Text.AlignHCenter; anchors.top: stopImage.bottom }
MultimediaButton {
anchors { top: playbackTime.bottom; left: item12.right; leftMargin: -2 }
source: "qrc:/images/multimedia-stop.png"
text: "Stop"
}
}
Item {
width: parent.width / 2; height: parent.height
anchors { right: parent.right; bottom: parent.bottom }
Column {
anchors.centerIn: parent
spacing: 10
Text { text: "Tempo: 120.00 bpm"; color: "white" }
Text { text: "Volume: 100%"; color: "white" }
Row {
Text { id: pitch; text: "Pitch: "; color: "white" }
SpinBox { anchors.verticalCenter: pitch.verticalCenter; id: spinbox }
}
id: item2
width: parent.width / 2 - 15; height: item1.height
anchors { right: parent.right; rightMargin: 15; verticalCenter: parent.verticalCenter }
MultimediaSlider {
id: volumeSlider
anchors.right: parent.right
source: "qrc:/images/multimedia-volume.png"
maximumValue: 200
value: 100
}
MultimediaSlider {
anchors { right: volumeSlider.left; rightMargin: 8 }
source: "qrc:/images/multimedia-speed.png"
minimumValue: 50
maximumValue: 200
value: 100
}
}
}
\ No newline at end of file
import QtQuick 2.5
Item {
property alias source: buttonImage.source;
property alias text: buttonText.text;
width: playbackTime.contentWidth / 3; height: childrenRect.height
Image {
id: buttonImage
width: 24; height: 24
anchors.horizontalCenter: parent.horizontalCenter
}
Text {
id: buttonText
width: parent.width
anchors.top: buttonImage.bottom
font.pointSize: 8
horizontalAlignment: Text.AlignHCenter
color: "white"
}
}
\ No newline at end of file
import QtQuick 2.5
import QtQuick.Controls 1.4
Item {
property alias source: sliderImage.source;
property alias minimumValue: slider.minimumValue;
property alias maximumValue: slider.maximumValue;
property alias value: slider.value;
width: sliderImage.width; height: parent.height
Slider {
id: slider
height: parent.height - sliderImage.height - 5
orientation: Qt.Vertical
}
Image {
id: sliderImage
width: 15; height: 15
anchors { top: slider.bottom; topMargin: 5; horizontalCenter: slider.horizontalCenter }
}
}
\ No newline at end of file
......@@ -6,6 +6,22 @@ Item {
property int keyWidth: 20
property int keyHeight: 3.4*keyWidth
function noteOn(chan, pitch, vol) {
highlightKey(pitch, "#778692")
}
function noteOff(chan, pitch, vol) {
highlightKey(pitch, ([1,3,6,8,10].indexOf(pitch % 12) > -1) ? "black":"white")
}
function highlightKey(pitch, color) {
if (pitch < 24) {
keyboard.children[pitch-21].color = color
return
}
var note = (pitch - 24) % 12
var octave = (pitch - 24 - note) / 12
keyboard.children[3+octave].children[note].color = color
}
width: 2*keyWidth+7*(7*keyWidth); height: keyHeight
WhiteKey { id: whiteKeyA }
......@@ -23,19 +39,4 @@ Item {
sequencer.noteOn.connect(noteOn)
sequencer.noteOff.connect(noteOff)
}
function noteOn(chan, pitch, vol) {
highlightKey(pitch, "#778692")
}
function noteOff(chan, pitch, vol) {
highlightKey(pitch, ([1,3,6,8,10].indexOf(pitch % 12) > -1) ? "black":"white")
}
function highlightKey(pitch, color) {
if (pitch < 24) {
keyboard.children[pitch-21].color = color
return
}
var note = (pitch - 24) % 12
var octave = (pitch - 24 - note) / 12
keyboard.children[3+octave].children[note].color = color
}
}
}
\ No newline at end of file
......@@ -6,6 +6,11 @@ Rectangle {
width: keyWidth; height: keyHeight
border { width: 1; color: "black" }
color: mouseArea.pressed ? "#475057" : "white"
MouseArea { id: mouseArea; anchors.fill: parent }
MouseArea {
id: mouseArea
anchors.fill: parent
}
Component.onCompleted: if (anchor != null) anchors.left = anchor.right;
}
\ No newline at end of file
src/qml/images/multimedia-pause.png

909 Bytes | W: | H:

src/qml/images/multimedia-pause.png

538 Bytes | W: | H:

src/qml/images/multimedia-pause.png
src/qml/images/multimedia-pause.png
src/qml/images/multimedia-pause.png
src/qml/images/multimedia-pause.png
  • 2-up
  • Swipe
  • Onion skin
src/qml/images/multimedia-play.png

1.01 KB | W: | H:

src/qml/images/multimedia-play.png

583 Bytes | W: | H:

src/qml/images/multimedia-play.png
src/qml/images/multimedia-play.png
src/qml/images/multimedia-play.png
src/qml/images/multimedia-play.png
  • 2-up
  • Swipe
  • Onion skin
src/qml/images/multimedia-stop.png

887 Bytes | W: | H:

src/qml/images/multimedia-stop.png

499 Bytes | W: | H:

src/qml/images/multimedia-stop.png
src/qml/images/multimedia-stop.png
src/qml/images/multimedia-stop.png
src/qml/images/multimedia-stop.png
  • 2-up
  • Swipe
  • Onion skin
......@@ -6,6 +6,7 @@ Item {
ListModel {
id: categories
ListElement { name: "Intervals"; cost: 2.45 }
ListElement { name: "Rythm"; cost: 3.25 }
ListElement { name: "Theory"; cost: 1.95 }
......@@ -15,17 +16,19 @@ Item {
}
Component {
id: categoryDelegate
Rectangle {
width: parent.width; height: 50
color: "#475057"
Text {
text: name; color: "white"
anchors { verticalCenter: parent.verticalCenter; left: parent.left; leftMargin: 10 }
text: name; color: "white"
}
Rectangle {
width: parent.width; height: 1
color: "#181B1E"
anchors.bottom: parent.bottom
color: "#181B1E"
}
Image {
width: 24; height: 24
......@@ -36,10 +39,12 @@ Item {
}
ScrollView {
id: scrollView
width: menuBarWidth; height: parent.height - midiPlayer.height
Rectangle {
color: "#475057"
anchors.fill: parent
color: "#475057"
}
ListView {
anchors.fill: parent
......@@ -47,20 +52,20 @@ Item {
delegate: categoryDelegate
}
}
MidiPlayer {
id: midiPlayer
}
MidiPlayer { id: midiPlayer }
Image {
id: background
anchors.left: scrollView.right
width: parent.width - scrollView.width
anchors.left: scrollView.right
source: "qrc:/images/minuet-background.png"
fillMode: Image.Tile
}
Rectangle {
width: background.width; height: 100
clip: true
anchors { bottom: parent.bottom; right: parent.right }
clip: true
PianoView { anchors.centerIn: parent }
}
}
}
\ No newline at end of file
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