Qt Quick设置父子的操作不简单



  • 题图送给论坛大大。post_cover
    今天我告诉大家一个事儿,Qt Quick设置父子操作不简单!😲
    比如这段代码:

            function insertItem_impl( item, splitIndex )
            {
                // 尝试在某个项目之前插入项目
                fillIndex = splitIndex;
    
    // 注意这段Start
                var handlesToResetIndex = [ ];
                print( "previous it has: " + splitterHandles.children.length + " splitters." );
                var i = 0;
                for ( i = splitIndex; i < splitterHandles.children.length; ++i )
                {
                    var handle = splitterHandles.children[i];
                    print( "[][] the previous handle(" + handle.__handleIndex + ") will be set to: " + ( i + 1 ) );
                    handle.__handleIndex = i + 1;
                    handle.parent = null;
                    handlesToResetIndex.push( handle );
                }
    
                var newHandle = handleLoader.createObject( splitterHandles, {"__handleIndex": splitIndex } );
                newHandle.parent = splitterHandles;
    
                for ( i in handlesToResetIndex )
                {
                    handlesToResetIndex[i].parent = splitterHandles;
                }
    // 注意这段End
    
                print( "insertItem_impl: Finally, inserting item ( objectName: " + item.objectName +
                      " ) at splitIndex: " + splitIndex );
                var childrenToRestore = [ ];            
                for ( i = splitIndex; i < splitterItems.children.length; ++i )
                {
                    var child = splitterItems.children[i];
                    child.objectName = i + 1;
                    childrenToRestore.push( child );
                    child.parent = null;
                }
    
                // 新增该item为孩子
                item.parent = splitterItems;
    
                // 把其余的补充进来
                for ( i in childrenToRestore )
                {
                    childrenToRestore[i].parent = splitterItems;
                }
    
    
                //splitterItems.children
                //item.parent = splitterItems
                d.initItemConnections(item)
            }
    

    本来我想通过handle拉出界面的。像Blender这样的。
    0_1499333766101_bff2255b-e14e-4580-8a0e-67bf83b7d05a-image.png
    但是……
    0_1499333781416_070450ee-d392-4f1c-a74b-40a2e8d5d55d-image.png
    OK
    0_1499333801993_7fd1c332-d0e2-41ba-a93b-a2509b0494fb-image.png
    OK
    0_1499333833534_d9962576-ee02-42b8-987b-4eb4a65432ca-image.png
    OK
    0_1499333849468_6224144e-7a82-4900-ab94-f68639903233-image.png
    Error

    为什么会这样呢?查了好多的代码,最后我终于理解了其中的奥秘。为了以后不再犯错误,我记录一下。



  • 上面的截图表示,本来按照0、1、2、3的顺序一次排列的handle(抓手),但是错乱了。原来是Qt Quick的item设置父子关系的问题。

    好了,为了阐述问题,你需要明白两点。

    1. 如何在运行期创建新的item呢?答案是Component.createObject()函数,就像这样写的:
    var newHandle = handleLoader.createObject( splitterHandles, {"__handleIndex": splitIndex } );
    
    1. 如何在运行期将item从它的父亲中移除吗?因为Item没有remove这样操作,所以想从Item中找到答案是很难的。但是其实方法相当简单:
    handle.parent = null;
    

    这样就可以将Item和它的父亲解除关系。

    好了,有了这些知识,再看看我原来的代码有哪些问题呢?

                for ( i = splitIndex; i < splitterHandles.children.length; ++i )
                {
                    var handle = splitterHandles.children[i];
                    print( "[][] the previous handle(" + handle.__handleIndex + ") will be set to: " + ( i + 1 ) );
                    handle.__handleIndex = i + 1;
                    handle.parent = null;
                    handlesToResetIndex.push( handle );
                }
    

    看出来了没有?问题在于for循环中设置结束条件是需要对splitterHandles.children.length求值,但是在循环体中却对每一个handle都解除了父子关系,结果导致循环过早结束。导致程序出现了大的BUG。

    知道问题所在了,解决起来就方便了。下面是我解决后的代码(请忽视一些输出语句和注释,会优化的……)

    function insertItem_impl( item, splitIndex )
            {
                // 尝试在某个项目之前插入项目
                fillIndex = splitIndex;
    // 注意这段Start
                var handlesToResetIndex = [ ];
                print( "previous it has: " + splitterHandles.children.length + " splitters." );
                var i = 0;
                for ( i = splitIndex; i < splitterHandles.children.length; ++i )
                {
                    var handle = splitterHandles.children[i];
                    print( "[][] the previous handle(" + handle.__handleIndex + ") will be set to: " + ( i + 1 ) );
                    handle.__handleIndex = i + 1;
                    //handle.parent = null;
                    handlesToResetIndex.push( handle );
                }
                for ( i in handlesToResetIndex )
                {
                    handlesToResetIndex[i].parent = null;
                }
    
                var newHandle = handleLoader.createObject( splitterHandles, {"__handleIndex": splitIndex } );
                newHandle.parent = splitterHandles;
    
                for ( i in handlesToResetIndex )
                {
                    handlesToResetIndex[i].parent = splitterHandles;
                }
    // 注意这段End
                print( "insertItem_impl: Finally, inserting item ( objectName: " + item.objectName +
                      " ) at splitIndex: " + splitIndex );
                var childrenToRestore = [ ];            
                for ( i = splitIndex; i < splitterItems.children.length; ++i )
                {
                    var child = splitterItems.children[i];
                    child.objectName = i + 1;
                    childrenToRestore.push( child );
                    //child.parent = null;
                }
                for ( i in childrenToRestore )
                {
                    childrenToRestore[i].parent = null;
                }
    
                // 新增该item为孩子
                item.parent = splitterItems;
    
                // 把其余的补充进来
                for ( i in childrenToRestore )
                {
                    childrenToRestore[i].parent = splitterItems;
                }
    
    
                //splitterItems.children
                //item.parent = splitterItems
                d.initItemConnections(item)
            }
    

    希望遇到的这些问题给大家提供一些有益的启示,以后可不要犯我同样的错误了哦。学到了没有学过的操作,真好。



  • 我好像看到有人点赞我~😲


 

最近的回复

  • 大家好!最近应该很好吧。世界杯来了,有没有喝一杯呢?
    我很高兴地告诉大家,我们在上周末的时候完成了Live2D的改造,将我们的看板娘换了哦。原先是蕾姆。
    0_1529471654453_dfe4b40e-ad64-4b7a-9d58-5c48609ea3e2-image.png
    同时我对样式也做了一些微调,比如说这里:
    0_1529471386270_828e7fbb-fe0c-4f6b-bb52-03938ac7e19f-image.png
    看起来稍微好了一些。

    随后论坛进行升级了哦,升级到了最新1.9.2版本了,各种功能应该得到优化了吧。
    最后欢迎大家继续来玩~

    阅读更多
  • Qt for Python终于发布了!
    以前的我,可能接触了一点Python,但是都没有坚持下来,现在Python水平还很弱呢。不过我基本语法还是了解一点的。所以我打算借着Qt for Python的东风,来尝试一下Python的开发。

    1、去Python 官网安装Python。地址是:

    https://www.python.org/downloads/mac-osx
    0_1529422911935_1.png
    我下载的版本是3.6.5

    2、双击pkg安装包进行安装,按照提示安装即可,不必做什么设置。
    0_1529422932496_2.png
    3、安装pip。pip是一个类似npm的快速安装器,非常适合python安装。由于Mac的安全策略,这个时候要输入的命令以sudo开始:

    sudo python get-pip.py

    4、需要安装Qt官网提供的python安装包。Qt的Python安装包并没有放入Pypi的地址,因为Qt库本身就偏大。
    但是依然能够通过pip安装。只是安装的命令稍微长:

    sudo pip install --index-url=https://download.qt.io/official_releases/QtForPython/ pyside2

    然后输出的结果是:
    daxiongtekiMacBook-Air:~ jiangcaiyang$ sudo pip install --index-url=https://download.qt.io/official_releases/QtForPython/ pyside2
    Password:
    The directory '/Users/jiangcaiyang/Library/Caches/pip/http' or its parent directory is not owned by the current user and the cache has been disabled. Please check the permissions and owner of that directory. If executing pip with sudo, you may want sudo's -H flag.
    The directory '/Users/jiangcaiyang/Library/Caches/pip' or its parent directory is not owned by the current user and caching wheels has been disabled. check the permissions and owner of that directory. If executing pip with sudo, you may want sudo's -H flag.
    Looking in indexes: https://download.qt.io/official_releases/QtForPython/
    Collecting pyside2
    Downloading https://download.qt.io/official_releases/QtForPython/pyside2/PySide2-5.11.0-5.11.0-cp27-cp27m-macosx_10_11_intel.whl (125.7MB)
    100% |████████████████████████████████| 125.7MB 1.0MB/s
    matplotlib 1.3.1 requires nose, which is not installed.
    matplotlib 1.3.1 requires tornado, which is not installed.
    Installing collected packages: pyside2
    Successfully installed pyside2-5.11.0
    安装成功。

    5、安装成功了,开始写一个测试的程序吧!
    最简单的,当然是Hello Qt for Python啦。很简单,使用Qt Creator,很方便地可以创建这样的Python脚本,使用方法也和C++版本的Qt应用相同:

    #!/usr/bin/env python # -*- coding: utf-8 -*- from PySide2.QtWidgets import QApplication, QLabel app = QApplication( [ ] ) label = QLabel( "您好 Qt for Python!" ) label.show( ) app.exec_( )

    0_1529422962008_4.jpg
    其中第一行表示用/usr/bin/python 来解析,大家可以在命令提示符输入“which python”来看结果:
    第二行则是在Python 3.x下不用写了,设定的是utf-8编码格式。大家最好也是使用这样的格式,因为这样遇到编码的坑最少。
    因为Python没有main()函数的说法,所以直接从上往下运行就可以了。Python是弱语言,所以不用声明类型,这里还有一点不一样,就是
    app.exec_( ),和C++版本不同的是,添加上了一个下划线。可能和Python内置的函数冲突了?我还需要再调查一下。

    接下来我就仿照例子写了一个更加复杂的Python程序,大致是这样的:

    #!/usr/bin/env python # -*- coding: utf-8 -*- import sys import random from PySide2.QtCore import Qt from PySide2.QtWidgets import (QApplication, QWidget, QPushButton, QLabel, QVBoxLayout ) class MyWidget( QWidget ): def __init__( self ): QWidget.__init__( self ) self.hello = [ "Hallo welt!", "Ciao mondo", "Hei maailma", "Hola mundo", "Hei verden!" ] self.button = QPushButton( "Click me!" ) self.text = QLabel( "Hello World" ) self.text.setAlignment( Qt.AlignCenter ) self.layout = QVBoxLayout( ) self.layout.addWidget( self.text ) self.layout.addWidget( self.button ) self.setLayout( self.layout ) self.button.clicked.connect( self.magic ) def magic( self ): self.text.setText( random.choice( self.hello ) ) if __name__ == "__main__": app = QApplication( sys.argv ) widget = MyWidget( ) widget.resize( 640, 480 ) widget.show( ) sys.exit( app.exec_( ) )

    程序运行起来还行吧!
    0_1529422988117_5.png

    阅读更多
  • @jiangcaiyang 如果需要自动化测试,也用的上

    阅读更多
  • @青山白云 这个可能有点用,但是可能更多局限于爬虫领域吧。

    阅读更多

关注我们

微博
QQ群











召唤伊斯特瓦尔