main.qml Example File | Qt Data Visualization 5.12.8

Qt 5.12 | Qt Data Visualization | Qt Quick 2 Oscilloscope Example | main.qml Example File

Qt Data Visualization | Commercial or GPLv3

# main.qml Example File

qmloscilloscope/qml/qmloscilloscope/main.qml

      /****************************************************************************
      **
      ** Copyright (C) 2016 The Qt Company Ltd.
      ** Contact: https://www.qt.io/licensing/
      **
      ** This file is part of the Qt Data Visualization module of the Qt Toolkit.
      **
      ** $QT_BEGIN_LICENSE:GPL$
      ** Commercial License Usage
      ** Licensees holding valid commercial Qt licenses may use this file in
      ** accordance with the commercial license agreement provided with the
      ** Software or, alternatively, in accordance with the terms contained in
      ** a written agreement between you and The Qt Company. For licensing terms
      ** and conditions see https://www.qt.io/terms-conditions. For further
      ** information use the contact form at https://www.qt.io/contact-us.
      **
      ** GNU General Public License Usage
      ** Alternatively, this file may be used under the terms of the GNU
      ** General Public License version 3 or (at your option) any later version
      ** approved by the KDE Free Qt Foundation. The licenses are as published by
      ** the Free Software Foundation and appearing in the file LICENSE.GPL3
      ** included in the packaging of this file. Please review the following
      ** information to ensure the GNU General Public License requirements will
      ** be met: https://www.gnu.org/licenses/gpl-3.0.html.
      **
      ** $QT_END_LICENSE$
      **
      ****************************************************************************/

      import QtQuick 2.1
      import QtQuick.Layouts 1.0
      import QtQuick.Controls 1.0
      import QtDataVisualization 1.1
      import "."

      Item {
          id: mainView
          width: 1280
          height: 1024

          property int sampleColumns: sampleSlider.value
          property int sampleRows: sampleColumns / 2
          property int sampleCache: 24

          onSampleRowsChanged: {
              surfaceSeries.selectedPoint = surfaceSeries.invalidSelectionPosition
              generateData()
          }

          Item {
              id: dataView
              anchors.bottom: parent.bottom
              width: parent.width
              height: parent.height - buttonLayout.height

              Surface3D {
                  id: surfaceGraph

                  width: dataView.width
                  height: dataView.height
                  shadowQuality: AbstractGraph3D.ShadowQualityNone
                  selectionMode: AbstractGraph3D.SelectionSlice | AbstractGraph3D.SelectionItemAndRow
                  renderingMode: AbstractGraph3D.RenderDirectToBackground

                  axisX.labelFormat: "%d ms"
                  axisY.labelFormat: "%d W"
                  axisZ.labelFormat: "%d mV"
                  axisX.min: 0
                  axisY.min: 0
                  axisZ.min: 0
                  axisX.max: 1000
                  axisY.max: 100
                  axisZ.max: 800
                  axisX.segmentCount: 4
                  axisY.segmentCount: 4
                  axisZ.segmentCount: 4
                  measureFps: true

                  onCurrentFpsChanged: {
                      if (fps > 10)
                          fpsText.text = "FPS: " + Math.round(surfaceGraph.currentFps)
                      else
                          fpsText.text = "FPS: " + Math.round(surfaceGraph.currentFps * 10.0) / 10.0
                  }

                  Surface3DSeries {
                      id: surfaceSeries
                      drawMode: Surface3DSeries.DrawSurface;
                      flatShadingEnabled: false;
                      meshSmooth: true
                      itemLabelFormat: "@xLabel, @zLabel: @yLabel"
                      itemLabelVisible: false

                      onItemLabelChanged: {
                          if (surfaceSeries.selectedPoint === surfaceSeries.invalidSelectionPosition)
                              selectionText.text = "No selection"
                          else
                              selectionText.text = surfaceSeries.itemLabel
                      }
                  }

                  Component.onCompleted: mainView.generateData()
              }
          }

          Timer {
              id: refreshTimer
              interval: 1000 / frequencySlider.value
              running: true
              repeat: true
              onTriggered: dataSource.update(surfaceSeries)
          }

          Rectangle {
              width: parent.width
              height: flatShadingToggle.height * 2
              anchors.left: parent.left
              anchors.top: parent.top
              color: surfaceGraph.theme.backgroundColor

              ColumnLayout {
                  anchors.fill: parent
                  RowLayout {
                      id: sliderLayout
                      anchors.top: parent.top
                      Layout.fillHeight: true
                      Layout.fillWidth: true
                      Layout.minimumHeight: flatShadingToggle.height
                      spacing: 0

                      Rectangle {
                          Layout.fillHeight: true
                          Layout.fillWidth: true
                          Layout.minimumWidth: samplesText.implicitWidth + 120
                          Layout.maximumWidth: samplesText.implicitWidth + 120
                          Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

                          border.color: "gray"
                          border.width: 1
                          radius: 4

                          RowLayout {
                              anchors.fill: parent
                              anchors.margins: parent.border.width + 1

                              Slider {
                                  id: sampleSlider
                                  Layout.fillHeight: true
                                  Layout.fillWidth: true
                                  Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
                                  Layout.minimumWidth: 80
                                  minimumValue: mainView.sampleCache * 2
                                  maximumValue: minimumValue * 10
                                  stepSize: mainView.sampleCache
                                  updateValueWhileDragging: false
                                  Component.onCompleted: value = minimumValue * 2
                              }

                              Rectangle {
                                  Layout.fillHeight: true
                                  Layout.fillWidth: true
                                  Layout.minimumWidth: samplesText.implicitWidth + 10
                                  Layout.maximumWidth: samplesText.implicitWidth + 10
                                  Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

                                  Text {
                                      id: samplesText
                                      text: "Samples: " + (mainView.sampleRows * mainView.sampleColumns)
                                      anchors.fill: parent
                                      verticalAlignment: Text.AlignVCenter
                                      horizontalAlignment: Text.AlignHCenter
                                  }
                              }
                          }
                      }

                      Rectangle {
                          Layout.fillHeight: true
                          Layout.fillWidth: true
                          Layout.minimumWidth: frequencyText.implicitWidth + 120
                          Layout.maximumWidth: frequencyText.implicitWidth + 120
                          Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

                          border.color: "gray"
                          border.width: 1
                          radius: 4

                          RowLayout {
                              anchors.fill: parent
                              anchors.margins: parent.border.width + 1

                              Slider {
                                  id: frequencySlider
                                  Layout.fillHeight: true
                                  Layout.fillWidth: true
                                  Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
                                  Layout.minimumWidth: 80
                                  minimumValue: 2
                                  maximumValue: 60
                                  stepSize: 2
                                  updateValueWhileDragging: true
                                  value: 30
                              }

                              Rectangle {
                                  Layout.fillHeight: true
                                  Layout.fillWidth: true
                                  Layout.minimumWidth: frequencyText.implicitWidth + 10
                                  Layout.maximumWidth: frequencyText.implicitWidth + 10
                                  Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

                                  Text {
                                      id: frequencyText
                                      text: "Freq: " + frequencySlider.value + " Hz"
                                      anchors.fill: parent
                                      verticalAlignment: Text.AlignVCenter
                                      horizontalAlignment: Text.AlignHCenter
                                  }
                              }
                          }
                      }

                      Rectangle {
                          Layout.fillHeight: true
                          Layout.fillWidth: true
                          Layout.minimumWidth: fpsText.implicitWidth + 10
                          Layout.maximumWidth: fpsText.implicitWidth + 10
                          Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

                          border.color: "gray"
                          border.width: 1
                          radius: 4

                          Text {
                              id: fpsText
                              anchors.fill: parent
                              verticalAlignment: Text.AlignVCenter
                              horizontalAlignment: Text.AlignHCenter
                          }
                      }

                      Rectangle {
                          Layout.fillHeight: true
                          Layout.fillWidth: true
                          Layout.minimumWidth: selectionText.implicitWidth + 10
                          Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter

                          border.color: "gray"
                          border.width: 1
                          radius: 4

                          Text {
                              id: selectionText
                              anchors.fill: parent
                              verticalAlignment: Text.AlignVCenter
                              horizontalAlignment: Text.AlignHCenter
                              text: "No selection"
                          }
                      }
                  }

                  RowLayout {
                      id: buttonLayout
                      Layout.fillHeight: true
                      Layout.fillWidth: true
                      Layout.minimumHeight: flatShadingToggle.height
                      anchors.bottom: parent.bottom
                      spacing: 0

                      NewButton {
                          id: flatShadingToggle
                          Layout.fillHeight: true
                          Layout.fillWidth: true

                          text: surfaceSeries.flatShadingSupported ? "Show Flat" : "Flat not supported"
                          enabled: surfaceSeries.flatShadingSupported

                          onClicked: {
                              if (surfaceSeries.flatShadingEnabled === true) {
                                  surfaceSeries.flatShadingEnabled = false;
                                  text = "Show Flat"
                              } else {
                                  surfaceSeries.flatShadingEnabled = true;
                                  text = "Show Smooth"
                              }
                          }
                      }

                      NewButton {
                          id: surfaceGridToggle
                          Layout.fillHeight: true
                          Layout.fillWidth: true

                          text: "Show Surface Grid"

                          onClicked: {
                              if (surfaceSeries.drawMode & Surface3DSeries.DrawWireframe) {
                                  surfaceSeries.drawMode &= ~Surface3DSeries.DrawWireframe;
                                  text = "Show Surface Grid"
                              } else {
                                  surfaceSeries.drawMode |= Surface3DSeries.DrawWireframe;
                                  text = "Hide Surface Grid"
                              }
                          }
                      }

                      NewButton {
                          id: exitButton
                          Layout.fillHeight: true
                          Layout.fillWidth: true

                          text: "Quit"

                          onClicked: Qt.quit(0);
                      }
                  }
              }

          }

          function generateData() {
              dataSource.generateData(mainView.sampleCache, mainView.sampleRows,
                                      mainView.sampleColumns, surfaceGraph.axisX.min,
                                      surfaceGraph.axisX.max, surfaceGraph.axisY.min,
                                      surfaceGraph.axisY.max, surfaceGraph.axisZ.min,
                                      surfaceGraph.axisZ.max)
          }
      }