import QtQuick 2.0 import QtQuick.Controls 2.9 import QtQuick.Layouts 1.0 import de.itsblue.omobidisplayapp 1.0 import de.itsblue.bluetoothleuart 1.0 import QtQuick.Controls.Material 2.0 Page { id: root property string statusText property bool working ColumnLayout { anchors { fill: parent margins: parent.height * 0.01 topMargin: 0 } Text { Layout.preferredWidth: parent.width * 0.6 Layout.preferredHeight: parent.height * 0.1 Layout.alignment: Layout.Center verticalAlignment: Text.AlignVCenter horizontalAlignment: Text.AlignHCenter fontSizeMode: Text.Fit font.pixelSize: 500 minimumPixelSize: 1 text: qsTr("Available devices") } ListView { id: availableDevicesListView Layout.preferredWidth: parent.width Layout.fillHeight: true Layout.alignment: Layout.Center clip: true boundsBehavior: Flickable.OvershootBounds model: backend.bleController.availableDevicesModel add: Transition { NumberAnimation { property: "opacity"; from: 0; to: 1; duration: 200 } NumberAnimation { property: "scale"; from: 0.9; to: 1; duration: 200 } } remove: Transition { NumberAnimation { property: "opacity"; from: 1; to: 0; duration: 200 } NumberAnimation { property: "scale"; from: 1; to: 0.9; duration: 200 } } spacing: 5 header: ItemDelegate { id: headerDelegate width: parent.width height: implicitHeight * 0.8 topInset: 10 bottomInset: 10 text: root.statusText onClicked: backend.bleController.startScanningForDevices() Rectangle { anchors.fill: parent anchors.topMargin: 10 anchors.bottomMargin: 10 color: "transparent" border.color: "lightgrey" border.width: 3 } Item { anchors { right: parent.right rightMargin: parent.height * 0.15 verticalCenter: parent.verticalCenter } height: (parent.height - 20) * 0.7 width: height BusyIndicator { id: busyIndicator anchors.centerIn: parent width: parent.width height: parent.height opacity: root.working ? 1:0 } } } delegate: ItemDelegate { width: parent.width text: name onClicked: backend.bleController.connectToDevice(device) Rectangle { anchors { top: parent.top left: parent.left right: parent.right topMargin: - availableDevicesListView.spacing * 0.5 } color: "lightgrey" height: 1 visible: index !== 0 } } } } states: [ State { name: OmobiDisplayBackend.Idle PropertyChanges { target: root statusText: "Tap here to scan" working: false } }, State { name: OmobiDisplayBackend.Scanning PropertyChanges { target: root statusText: "Scanning..." working: true } }, State { name: OmobiDisplayBackend.ReadyToConnect PropertyChanges { target: root statusText: availableDevicesListView.model.rowCount() > 0 ? "Please select a device or tap to scan again":"No devices found. Tap to scan again" working: false } }, State { name: OmobiDisplayBackend.Connecting PropertyChanges { target: availableDevicesListView enabled: false } PropertyChanges { target: root statusText: "trying to connect..." working: true } }, State { name: OmobiDisplayBackend.Initing PropertyChanges { target: availableDevicesListView enabled: false } PropertyChanges { target: root statusText: "loading data..." working: true } } ] }