sample/app/main.qml

   1 import QtQuick 2.7
   2 import QtQuick.Window 2.2
   3 import QtQuick.Controls 2.0
   4 import QtQuick.Layouts 1.0
   5 import AGL.Demo.Controls 1.0
   6
   7 ApplicationWindow {
   8     id: root
   9     visible: true
  10     width: Screen.width
  11     height: Screen.height
  12
  13     property string onsId: qsTr("onscreenapp")
  14     property string onsTitle: qsTr("One Button title")
  15     property string onsType: "critical"
  16     property string onsContents: qsTr("An operating system is a program that manages a computer’s hardware.")
  17     property string onsButton1: qsTr("Yes")
  18     property string onsButton2: qsTr("")
  19     property string onsButton3: qsTr("")
  20     property string postmsg: qsTr("")
  21     property string btndata: qsTr("")
  22     property int pid: -1
  23     property bool onscreen_role_set: false
  24
  25     property string mapp_id: ''
  26     property string mapp_data_msg: ''
  27
  28     Label {
  29         id: title
  30         width: parent.width
  31         height: 40
  32         text: "OnScreen Test App"
  33         font.pixelSize: 40
  34         font.bold: true
  35         color: "white"
  36     }
  37
  38     ColumnLayout {
  39         spacing: 20
  40         anchors.top: title.bottom
  41         anchors.topMargin: 40
  42         anchors.horizontalCenter: title.horizontalCenter
  43
  44         // show received reply information area
  45         Flickable {
  46              id: flickable
  47              width: 800
  48              height: 320
  49              Layout.alignment: Qt.AlignCenter
  50              flickableDirection: Flickable.VerticalFlick
  51              boundsBehavior: Flickable.StopAtBounds
  52
  53              TextArea.flickable: TextArea {
  54                  id: output
  55                  text: "show received reply information area\n...\n...\n...\n...\n"
  56                  font.pixelSize: 24
  57                  wrapMode: TextArea.Wrap
  58                  color: '#00ADDC'
  59              }
  60
  61              ScrollBar.vertical: ScrollBar { }
  62          }
  63
  64         // select onscreen type area
  65         GroupBox {
  66             label: Label {
  67                 text: qsTr("Please select send OnScreen Message")
  68                 font.pixelSize: 32
  69                 font.bold: true
  70                 color: "white"
  71             }
  72
  73             width: 800
  74             height: 100
  75             Layout.alignment: Qt.AlignLeft
  76
  77             RowLayout {
  78                 anchors.fill: parent
  79                 RadioButton {
  80                     text: qsTr("One Button")
  81                     font.pixelSize: 20
  82                     checked: true
  83                     onClicked: {
  84                         selectOneButton();
  85                     }
  86                 }
  87                 RadioButton {
  88                     text: qsTr("Two Buttons")
  89                     font.pixelSize: 20
  90                     onClicked: {
  91                         selectTwoButtons();
  92                     }
  93                 }
  94                 RadioButton {
  95                     text: qsTr("Three Buttons")
  96                     font.pixelSize: 20
  97                     onClicked: {
  98                         selectThreeButtons();
  99                     }
 100                 }
 101                 RadioButton {
 102                     text: qsTr("No Button")
 103                     font.pixelSize: 20
 104                     onClicked: {
 105                         selectNoButton();
 106                     }
 107                 }
 108             }
 109         }
 110
 111         // edit post message area
 112         GroupBox {
 113             label: Label {
 114                 text: qsTr("Post Infomations")
 115                 font.pixelSize: 32
 116                 font.bold: true
 117                 color: "white"
 118             }
 119             width: 800
 120             height: 400
 121             Layout.alignment: Qt.AlignLeft
 122             Layout.maximumWidth: 800
 123             Layout.maximumHeight: 400
 124
 125             ColumnLayout {
 126                 spacing:  20
 127                 RowLayout {
 128                     spacing: 20
 129                     Label {
 130                         id: ons_title
 131                         anchors.left: parent.left
 132                         anchors.leftMargin: 30
 133                         text: qsTr("ons_title:")
 134                         font.pixelSize: 20
 135                         font.italic: true
 136                         color: '#00ADDC'
 137                     }
 138
 139                     Label {
 140                         id: ons_title_data
 141                         text: onsTitle
 142                         font.pixelSize: 20
 143                         font.italic: true
 144                         anchors.left: ons_title.right
 145                         anchors.leftMargin: 20
 146                         color: '#00ADDC'
 147                         Layout.maximumWidth: 600
 148                         Layout.maximumHeight: 40
 149                         maximumLineCount: 1
 150                         wrapMode: Text.Wrap
 151                         elide: Text.ElideRight
 152                         horizontalAlignment: Label.AlignHCenter
 153                         verticalAlignment: Label.AlignVCenter
 154                     }
 155                 }
 156                 RowLayout {
 157                     spacing: 20
 158                     Label {
 159                         id: ons_type
 160                         anchors.left: parent.left
 161                         anchors.leftMargin: 30
 162                         text: qsTr("type:")
 163                         font.pixelSize: 20
 164                         font.italic: true
 165                         color: '#00ADDC'
 166                     }
 167
 168                     Label {
 169                         id: ons_type_data
 170                         text: onsType
 171                         font.pixelSize: 20
 172                         font.italic: true
 173                         anchors.left: ons_type.right
 174                         anchors.leftMargin: 20
 175                         color: '#00ADDC'
 176                     }
 177                 }
 178                 RowLayout {
 179                     spacing: 20
 180                     Label {
 181                         id: ons_contents
 182                         anchors.left: parent.left
 183                         anchors.leftMargin: 30
 184                         text: qsTr("contents:")
 185                         font.pixelSize: 20
 186                         font.italic: true
 187                         color: '#00ADDC'
 188                     }
 189                     Label {
 190                         id: ons_contents_data
 191                         text: onsContents
 192                         font.pixelSize: 20
 193                         font.italic: true
 194                         anchors.left: ons_contents.right
 195                         anchors.leftMargin: 20
 196                         color: '#00ADDC'
 197                         Layout.maximumWidth: 600
 198                         Layout.maximumHeight: 200
 199                         maximumLineCount: 4
 200                         wrapMode: Text.Wrap
 201                         elide: Text.ElideRight
 202                         horizontalAlignment: Label.AlignLeft
 203                         verticalAlignment: Label.AlignVCenter
 204                     }
 205                 }
 206                 RowLayout {
 207                     spacing: 20
 208                     Label {
 209                         id: btn1
 210                         anchors.left: parent.left
 211                         anchors.leftMargin: 30
 212                         text: qsTr("Button1")
 213                         font.pixelSize: 20
 214                         font.italic: true
 215                         color: '#00ADDC'
 216                     }
 217
 218                     Label {
 219                         id: btn1_data
 220                         text: onsButton1
 221                         font.pixelSize: 20
 222                         font.italic: true
 223                         anchors.left: btn1.right
 224                         anchors.leftMargin: 20
 225                         color: '#00ADDC'
 226                     }
 227                 }
 228                 RowLayout {
 229                     spacing: 20
 230                     Label {
 231                         id: btn2
 232                         anchors.left: parent.left
 233                         anchors.leftMargin: 30
 234                         text: qsTr("Button2")
 235                         font.pixelSize: 20
 236                         font.italic: true
 237                         color: '#00ADDC'
 238                     }
 239                     Label {
 240                         id: btn2_data
 241                         text: onsButton2
 242                         font.pixelSize: 20
 243                         font.italic: true
 244                         anchors.left: btn2.right
 245                         anchors.leftMargin: 20
 246                         color: '#00ADDC'
 247                     }
 248                 }
 249                 RowLayout {
 250                     spacing: 20
 251                     Label {
 252                         id: btn3
 253                         anchors.left: parent.left
 254                         anchors.leftMargin: 30
 255                         text: qsTr("Button3")
 256                         font.pixelSize: 20
 257                         font.italic: true
 258                         color: '#00ADDC'
 259                     }
 260                     Label {
 261                         id: btn3_data
 262                         text: onsButton3
 263                         font.pixelSize: 20
 264                         font.italic: true
 265                         anchors.left: btn3.right
 266                         anchors.leftMargin: 20
 267                         color: '#00ADDC'
 268                     }
 269                 }
 270             }
 271         }
 272
 273         // post button
 274         Button {
 275             id: poster
 276             text: "Post"
 277             Layout.alignment: Qt.AlignCenter
 278             onClicked: {
 279                 postMessage();
 280             }
 281         }
 282     }
 283
 284     function selectOneButton() {
 285         console.log("select one button!")
 286         onsTitle = qsTr("One Button title")
 287         onsType = qsTr("critical")
 288         onsContents = qsTr("An operating system is a program that manages a computer’s hardware.")
 289         onsButton1 = qsTr("Yes")
 290         onsButton2 = qsTr("")
 291         onsButton3 = qsTr("")
 292     }
 293
 294     function selectTwoButtons() {
 295         console.log("select two buttons!")
 296         onsTitle = qsTr("Two Buttons title")
 297         onsType = qsTr("exclamation")
 298         onsContents = qsTr("Beforewe can explore the details of computer system operation, we need to know something about system structure. We thus discuss the basic functions of system startup, I/O, and storage early in this chapter. We also describe the basic computer architecture that makes it possible to write a functional operating system.")
 299         onsButton1 = qsTr("Yes")
 300         onsButton2 = qsTr("No")
 301         onsButton3 = qsTr("")
 302     }
 303
 304     function selectThreeButtons() {
 305         console.log("select three buttons!")
 306         onsTitle = qsTr("Three Buttons title")
 307         onsType = qsTr("information")
 308         onsContents = qsTr("We can also view a computer system as consisting of hardware, software,and data. The operating system provides the means for proper use of these resources in the operation of the computer system.")
 309         onsButton1 = qsTr("Yes")
 310         onsButton2 = qsTr("Abort")
 311         onsButton3 = qsTr("No")
 312     }
 313
 314     function selectNoButton() {
 315         console.log("select no button!")
 316         onsTitle = qsTr("No Button title,very long title beyond screen wide which will show ellipsis at the end")
 317         onsType = qsTr("question")
 318         onsContents = qsTr("Recently, many varieties of mobile computers, such as smartphones and tablets, have come into fashion. Most mobile computers are standalone units for individual users. Quite often, they are connected to networks through cellular or other wireless technologies. Increasingly, these mobile devices are replacing desktop and laptop computers for people who are primarily interested in using computers for e-mail and web browsing. The user interface for mobile computers generally features a touch screen, where the user interacts with the system by pressing and swiping fingers across the screen rather than using a physical keyboard and mouse.")
 319         onsButton1 = qsTr("")
 320         onsButton2 = qsTr("")
 321         onsButton3 = qsTr("")
 322     }
 323
 324     Timer {
 325                 id: activate_timer
 326                 interval: 500
 327                 running: false
 328                 repeat: false
 329                 onTriggered: {
 330                         console.log("calling eventHandler.showWindow for " + mapp_id + " and data msg " + mapp_data_msg)
 331                         eventHandler.showWindow(mapp_id, mapp_data_msg)
 332                         mapp_id = ''
 333                         mapp_data_msg = ''
 334                 }
 335     }
 336
 337
 338     function armTimer(app_id, msg) {
 339         mapp_id = app_id
 340         mapp_data_msg = msg
 341         activate_timer.running = true
 342     }
 343
 344     function postMessage() {
 345         console.log("poster pressed")
 346         btndata = ""
 347         postmsg = "{\"title\": \"" + onsTitle + "\"," + "\"type\": \"" + onsType + "\"," + "\"contents\": \"" + onsContents + "\"";
 348         if (onsButton1 != "") {
 349             btndata = "\"" + onsButton1 + "\"";
 350         }
 351         if (onsButton2 != "") {
 352             if (btndata != "")
 353                 btndata += ",";
 354             btndata += "\"" + onsButton2 + "\"";
 355         }
 356         if (onsButton3 != "") {
 357             if (btndata != "")
 358                 btndata += ",";
 359             btndata += "\"" + onsButton3 + "\"";
 360         }
 361
 362         if(btndata != "")
 363             postmsg += ",\"buttons\":[" + btndata + "]}"
 364         else
 365             postmsg += "}"
 366
 367         if (!onscreen_role_set) {
 368                 console.log("onscreen_role_set is not set")
 369                 eventHandler.set_window_popup(onsId, 0, 218)
 370                 console.log("setting for popup for " + onsId)
 371                 onscreen_role_set = true
 372         }
 373
 374         // if the application is not already started, start it
 375         if (pid === -1) {
 376                 // if the application is not started, then the first time
 377                 // we start we also display it using the default policy engine
 378                 pid = eventHandler.start(onsId, postmsg)
 379                 console.log("calling eventHandler.start for " + onsId + " with pid " + pid)
 380
 381                 // this is necessary jus the first time as we don't queue the
 382                 // 'activate_app' event and pass it over once onscreenapp is
 383                 // started. It is implementation detail in case it is required
 384                 console.log("calling armTimer for " + onsId)
 385                 armTimer(onsId, postmsg)
 386         } else {
 387                 // onscreenapp is already start we just need to activate + pass the data
 388                 eventHandler.showWindow(mapp_id, mapp_data_msg)
 389         }
 390
 391     }
 392
 393     function qmlOnReplyShowWindow(text) {
 394         console.log("onstestapp received:",text);
 395         output.text = text;
 396     }
 397 }