BusyIndicator and function JS

[felipefontes]

how do I make a busyindicator active and running while running a function in javascript?

[ODБOï]

hi
@felipefontes said in BusyIndicator and funtion JS:

how do I make a busyindicator active

set running property to true.

what do you mean by ?
@felipefontes said in BusyIndicator and funtion JS:

while running a function in javascript

can you show that function?

[felipefontes]

@LeLev I'm going to make an insert in sqlite. While doing the insert I want to show a loading for the user

[Shrinidhi Upadhyaya]

@felipefontes , you can just set the running property to true at the start of JS function and you can set it to false once it ends.

For example:-

BusyIndicator {
 id: loadingIndicator
 running: false
}

[..]
[..]

function insertData() {
  loadingIndicator.running = true
  //inserting in sqlite
  [..]
  [..]
  loadingIndicator.running = false
}

[felipefontes]

@Shrinidhi-Upadhyaya , does not work. It performs the function and locks the rest of the application

[Shrinidhi Upadhyaya]

Hi @felipefontes , can show me the code once?

[felipefontes]

@Shrinidhi-Upadhyaya

                onPressed: {

                    //adjust position on the screen
                    var _height = flickable.contentHeight / 2 - 350;
                    flickable.contentY = _height;

                    //visible loading
                    loading.visible = true

                    
                    //insert simulation
                    var i = 0
                    while (i<= 10000){
                        console.log(i)
                        i++
                    }

                    //disable loading
                    loading.visible = false

                }

BusyIndicator {
        id: loading
        running: true
        visible: false
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.verticalCenter: parent.verticalCenter
        Material.accent: app.accentColor


        background: Rectangle {
            id: syncWindow
            //color: "transparent"
            //clip: true
            visible: true


            Rectangle {
                anchors.centerIn: parent
                width: 125 * scaleFactor
                height: 100 * scaleFactor
                color: "lightgrey"
                opacity: 0.8
                radius: 5
                border {
                    color: "#4D4D4D"
                    width: 1 * scaleFactor
                }

                Column {
                    anchors {
                        fill: parent
                        margins: 10 * scaleFactor
                    }
                    spacing: 10


                    Text {
                        id:txt_loading
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.bottom: parent.bottom
                        text: "Carregando..."
                        font.pixelSize: 16 * scaleFactor
                    }
                }
            }

        }

    }