QML UI: add button to show the preferences window

Add a button in the main qml file to show the preferences window. This
window is linked to the QMLManager class, so any changes made will be
saved to the user's settings file.

Signed-off-by: Grace Karanja <gracie.karanja89@gmail.com>

qt-mobile/main.qml

@@ -2,12 +2,12 @@ import QtQuick 2.3
 import QtQuick.Controls 1.2
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
+import QtQuick.Layouts 1.1
 import org.subsurfacedivelog.mobile 1.0
 
 ApplicationWindow {
 	title: qsTr("Subsurface")
 	width: 500;
-	height: 700
 
 	FileDialog {
 		id: fileOpen
@@ -23,24 +23,45 @@ ApplicationWindow {
 		id: manager
 	}
 
-	menuBar: MenuBar {
+	Preferences {
-		Menu {
+		id: prefsWindow
-			title: qsTr("File")
-			MenuItem {
-				text: qsTr("Open")
-				onTriggered: fileOpen.open()
 	}
 
-			MenuItem {
+	ColumnLayout {
-				text: qsTr("Exit")
+		id: layout
-				onTriggered: Qt.quit();
+		anchors.fill: parent
+		spacing: 4
+
+		Rectangle {
+			id: topPart
+			height: 35
+			Layout.fillWidth: true
+			Layout.maximumHeight: 35
+
+			RowLayout {
+				Button {
+					id: prefsButton
+					text: "Preferences"
+					onClicked: {
+						prefsWindow.show()
 					}
 				}
+
+				Button {
+					id: openFile
+					text: "Open File"
+					onClicked: {
+						fileOpen.open();
+					}
+				}
+			}
+
 		}
 
 		Rectangle {
 			id: page
-		width: parent.width; height: parent.height
+			Layout.fillHeight: true
+			Layout.fillWidth: true
 
 			Component {
 				id: diveDelegate
@@ -198,4 +219,5 @@ ApplicationWindow {
 				section.delegate: tripHeading
 			}
 		}
+	}
 }