Filter Editor within ADTF Configuration Editor

Basic Information

The ADTF Configuration Editor provides the possibility to extend the filter functionality with your own custom filter editor written in QML/QtQuick. This Method is for example used by the Qt5 JavaScript Filter. In order for the Configuration Editor to recognize your own editor you should derive your editor class from our internal base class EditorPluginBase. Within your implementation you have access to the complete QtQuick Framework and our provided API and some attached properties.

import EditorPlugin 1.0
import QtQuick 2.7
import QtQuick.Window 2.12
import QtQuick.Controls 2.5
 
EditorPluginBase 
{
 
    id: root
 
    /* Your Logic */
 
    onExecute: 
    {
 
        /* This is called when the editor is opened from the filter context menu*/
 
        /* targetModel is the property representing the filter whom this editor is attached to 
         * findProperty is a provided API function to get a property of any component by name
         */
        const myProp = root.findProperty(targetModel, "myProp")
    }
}

More advanced example

The example below shows a way of creating new properties within the editor attached to a filter for example.

import QtQuick 2.7
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.1
import QtGraphicalEffects 1.0
import QtQuick.Dialogs 1.2
 
import EditorPlugin 1.0
 
EditorPluginBase
{
    id: root
 
    Dialog
    {
        id: dialog
        visible: true
 
        width: 350
        height: 220
 
        contentItem: Item
        {
            ColumnLayout{
                anchors.fill: parent
 
                TextField {
                    Layout.fillWidth: true
                    id: propertyName
                    placeholderText: qsTr("Property name")
                }
 
                TextField {
                    Layout.fillWidth: true
                    id: propertyValue
                    placeholderText: qsTr("Property value")
                }
 
                ComboBox {
                    Layout.fillWidth: true
                    id: propertyType
                    width: 200
                    model: ["tBool", "cString", "tInt", "tInt8", "tInt16", "tInt32", "tInt64", "tFloat", "tFloat32", "tFloat64", "tFilename", "cFilename", "cFilenameList", "cFilepath", "tComplex"]
                }
 
                Button {
                    id: test_button
                    text: qsTr("Create")
                    width: 150
 
                    onClicked: {
                        var propName = propertyName.text
                        var propValue = propertyValue.text
                        var propType = propertyType.currentText
                        console.log("Create property: " + propName + " with value " + propValue + " and type " + propType)
                        createProperty(targetModel, propName, propValue, propType)
                        dialog.close()
                    }
                }
 
            }
        }
    }
}

Provided QtQuick API

see the base class implementation EditorPluginBase for details