Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt
  • Unsolved
Collapse
qtws26_logo

The Qt Event of the Year: Qt World Summit 2026

Save Your Spot >
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Change component's child propery from javascript file
Qt 6.12 LTS is out! See what's new in the release blog

Change component's child propery from javascript file

Scheduled Pinned Locked Moved Solved QML and Qt Quick
21 Posts 3 Posters 6.2k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • behruz montazeriB behruz montazeri

    @Diracsbracket
    I did one. I changed my function. But here's another problem it work for only one qml file and if we call it from another qml file counter is Zero.

    function changeColor(rectId, param1) {
        if( typeof changeColor.counter == 'undefined' ) {
            changeColor.counter  = 0;
        }
        changeColor.counter++
    }
    
    DiracsbracketD Offline
    DiracsbracketD Offline
    Diracsbracket
    wrote on last edited by
    #12

    @behruz-montazeri
    Then use a global JS variable.

    behruz montazeriB 1 Reply Last reply
    1
    • DiracsbracketD Diracsbracket

      @behruz-montazeri
      Then use a global JS variable.

      behruz montazeriB Offline
      behruz montazeriB Offline
      behruz montazeri
      wrote on last edited by
      #13

      @Diracsbracket
      Yes that's the case.

       property int counter: 0
      
      DiracsbracketD 1 Reply Last reply
      0
      • behruz montazeriB behruz montazeri

        @Diracsbracket
        Yes that's the case.

         property int counter: 0
        
        DiracsbracketD Offline
        DiracsbracketD Offline
        Diracsbracket
        wrote on last edited by
        #14

        @behruz-montazeri
        that's not a JS variable. That's a QML object property.

        behruz montazeriB 1 Reply Last reply
        0
        • DiracsbracketD Diracsbracket

          @behruz-montazeri
          that's not a JS variable. That's a QML object property.

          behruz montazeriB Offline
          behruz montazeriB Offline
          behruz montazeri
          wrote on last edited by
          #15

          @Diracsbracket
          Where can i declare a javascript global variable ?

          DiracsbracketD 1 Reply Last reply
          0
          • behruz montazeriB behruz montazeri

            @Diracsbracket
            Where can i declare a javascript global variable ?

            DiracsbracketD Offline
            DiracsbracketD Offline
            Diracsbracket
            wrote on last edited by Diracsbracket
            #16

            @behruz-montazeri said in Change component's child propery from javascript file:

            @Diracsbracket
            Where can i declare a javascript global variable ?

            In a javascript file. Otherwise create a property at a top-level QML object, e.g. your main window, which exists for the duration of your app.

            behruz montazeriB 1 Reply Last reply
            0
            • DiracsbracketD Diracsbracket

              @behruz-montazeri said in Change component's child propery from javascript file:

              @Diracsbracket
              Where can i declare a javascript global variable ?

              In a javascript file. Otherwise create a property at a top-level QML object, e.g. your main window, which exists for the duration of your app.

              behruz montazeriB Offline
              behruz montazeriB Offline
              behruz montazeri
              wrote on last edited by behruz montazeri
              #17

              @Diracsbracket
              I guess creating property make seance in my situation. making a Javascript file variable doesn't keep track of increasing despite the several calls from different QML files.

              DiracsbracketD 1 Reply Last reply
              0
              • behruz montazeriB behruz montazeri

                @Diracsbracket
                I guess creating property make seance in my situation. making a Javascript file variable doesn't keep track of increasing despite the several calls from different QML files.

                DiracsbracketD Offline
                DiracsbracketD Offline
                Diracsbracket
                wrote on last edited by Diracsbracket
                #18

                @behruz-montazeri said in Change component's child propery from javascript file:

                I guess creating property make seance in my situation.

                That's usually the best way indeed.

                making a Javascript file variable doesn't keep track of increasing despite the several calls from different QML files.

                You can do it, if you really need it:
                http://doc.qt.io/qt-5/qtqml-javascript-resources.html#shared-javascript-resources-libraries

                behruz montazeriB 1 Reply Last reply
                0
                • DiracsbracketD Diracsbracket

                  @behruz-montazeri said in Change component's child propery from javascript file:

                  I guess creating property make seance in my situation.

                  That's usually the best way indeed.

                  making a Javascript file variable doesn't keep track of increasing despite the several calls from different QML files.

                  You can do it, if you really need it:
                  http://doc.qt.io/qt-5/qtqml-javascript-resources.html#shared-javascript-resources-libraries

                  behruz montazeriB Offline
                  behruz montazeriB Offline
                  behruz montazeri
                  wrote on last edited by behruz montazeri
                  #19

                  @Diracsbracket

                  I have a list view i want to change the color of all rectangle inside of component with Javascript.

                      ListView{
                          id:fruitList
                          anchors.fill: parent
                          model: mModel
                          delegate: mComponent
                          highlight: Rectangle{
                              width: parent.width
                              color: "red"
                          }
                          Component{
                              id:mComponent
                             Item {
                                  width:parent.width
                                  height: rectId.height
                                  Rectangle{
                                      id:rectId
                                      width: parent.width
                                      height: 80
                                      border.width: 6
                                      border.color: "black"
                  
                                      Image {
                                          anchors.centerIn: parent
                                          width:70
                                          height: width
                                          id: mPic
                                          source: msource
                                      }
                                      ItemDelegate{
                                          anchors.fill: parent
                                          onClicked: {
                                              MyColor.changeColor(rectId,colorM)
                                              mText =  MyColor.textReturn("page1")
                                         } 
                  
                                      }
                                  }
                  
                              }
                          }
                  

                  in Javascript :

                  function resetList()
                  {
                      for (var entry = 0; entry < fruitList.count; ++entry) {
                          
                           // rectId.color = "white'
                      }
                  }
                  
                  DiracsbracketD 1 Reply Last reply
                  0
                  • behruz montazeriB behruz montazeri

                    @Diracsbracket

                    I have a list view i want to change the color of all rectangle inside of component with Javascript.

                        ListView{
                            id:fruitList
                            anchors.fill: parent
                            model: mModel
                            delegate: mComponent
                            highlight: Rectangle{
                                width: parent.width
                                color: "red"
                            }
                            Component{
                                id:mComponent
                               Item {
                                    width:parent.width
                                    height: rectId.height
                                    Rectangle{
                                        id:rectId
                                        width: parent.width
                                        height: 80
                                        border.width: 6
                                        border.color: "black"
                    
                                        Image {
                                            anchors.centerIn: parent
                                            width:70
                                            height: width
                                            id: mPic
                                            source: msource
                                        }
                                        ItemDelegate{
                                            anchors.fill: parent
                                            onClicked: {
                                                MyColor.changeColor(rectId,colorM)
                                                mText =  MyColor.textReturn("page1")
                                           } 
                    
                                        }
                                    }
                    
                                }
                            }
                    

                    in Javascript :

                    function resetList()
                    {
                        for (var entry = 0; entry < fruitList.count; ++entry) {
                            
                             // rectId.color = "white'
                        }
                    }
                    
                    DiracsbracketD Offline
                    DiracsbracketD Offline
                    Diracsbracket
                    wrote on last edited by
                    #20

                    @behruz-montazeri
                    I think this thread is closed. Thanks.

                    behruz montazeriB 1 Reply Last reply
                    0
                    • DiracsbracketD Diracsbracket

                      @behruz-montazeri
                      I think this thread is closed. Thanks.

                      behruz montazeriB Offline
                      behruz montazeriB Offline
                      behruz montazeri
                      wrote on last edited by
                      #21

                      @Diracsbracket
                      Is it possible to ask in new topic ?

                      1 Reply Last reply
                      0

                      • Login

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Categories
                      • Recent
                      • Tags
                      • Popular
                      • Users
                      • Groups
                      • Search
                      • Get Qt
                      • Unsolved