VInstances

Esta clase representa la selección de instancias de Velneo vClient y dispone de las funciones necesarias para realizar la selección y ejecución de la aplicación seleccionada.

Es una clase específica para personalizar la ventana de conexión de Velneo vClient con QML.

El objeto theInstances

El script QML está conectado al objeto theInstances que representa la ventana de selección de instancia en curso.

Indice de funciones

De información

model instancesModel( void )

De selección

void setInstance( Number index )

void accept( void )

void reject( void )

De marco

void setWindowTitle( String szTitle )

void setWindowIcon( String szPath )

Documentación de funciones

Funciones de información

model instancesModel( void )

Devuelve un modelo con la lista de instancias a las que tiene acceso el usuario en el servidor.

Por cada item del modelo dispondremos de las propiedades display y decoration. La propiedad display nos devolverá el nombre de la instancia y la propiedad decoration contendrá el icono que tiene asociado la instancia. Podremos usar ambos para presentar la información necesaria al usuario para que seleccione la instancia.

Funciones de selección

void setInstance( number index )

Establece la instancia que será ejecutada. Usaremos como parámetro el index o posición en la lista devuelta en el modelo (comienza a contar desde 0).

void accept( void )

Ejecuta la instancia seleccionada.

void reject( void )

Cancela la selección de instancia.

Funciones de marco

void setWindowTitle( String szTitle )

Establece el título que aparece en el marco. Para que se muestre el marco, hemos de establecer el título o una imagen como icono.

void setWindowIcon( String szPath )

Establece el título que aparece en el marco. Para que se muestre el marco, hemos de establecer el título o una imagen como icono.

Establece la senda en disco de la imagen que aparecerá como icono en el marco. Para que se muestre el marco, hemos de establecer el título o una imagen como icono.

Ejemplo

Ejemlpo de QML para la lista de instancias en Velneo

///////////////////////////////////////////////////////////////////////////////////////////////////
//
// Instances.qml
//
// Ejemplo de Qml para la lista de instancias en Velneo.
//
// En el ejemplo se carga la lista de instancias y se muestra al usuario para que seleccione. Si únicamente
// hay una instancia, se carga ésta de forma automática.
//

import QtQuick 2.15

Rectangle
{
    width: 480
    height: 460

    Component.onCompleted:
    {
        // Indicamos el título y el icono de la ventana
        theInstances.setWindowTitle("Selecciona la aplicación");  
        theInstances.setWindowIcon("icono.png");
    }

    Item
    {
        x: 10
        y: 5

        Image
        {        
            width: 60
            height: 30
            source: "logo.png"

            fillMode: Image.PreserveAspectFit
            smooth: true
            asynchronous: true
        }
    }

    Item
    {
        width: parent.width - 20
        height: parent.height - 100
        anchors.horizontalCenter: parent.horizontalCenter
        y: 40

        Column 
        {
            // Lista de instancias
            id: instancesList

            anchors.top: parent.top
            width: parent.width
            height: parent.height
            spacing: 10

            Text
            { 
                text: "Lista de aplicaciones"
                font.bold: true
            }    

            Rectangle
            {
                id: instancesListRec

                width: parent.width
                height: parent.height - 20
                border.color: "lightgrey"
                border.width: 2
                radius: 10

                ListView 
                {
                    id: instanciasListView
                    anchors.fill: parent

                    signal clicked

                    clip: true
                    focus: true                    

                    Keys.onReturnPressed:
                    {
                        aceptarBoton.clicked(Qt.LeftButton);
                    }

                    highlight:
                    Rectangle
                    {
                        width: parent.width;
                        height: 40;
                        anchors.horizontalCenter: parent.horizontalCenter;
                        color: "#E30B0B";
                        radius: 10;

                        y: instanciasListView.currentItem.y
                        Behavior on y {
                            SpringAnimation {
                                spring: 3
                                damping: 0.2
                            }
                        }
                    }

                    highlightFollowsCurrentItem: false;

                    model: theInstances.instancesModel()

                    delegate:
                    Row
                    {
                        id: intanciaRow

                        width: parent.width -10;
                        height: 40;
                        anchors.horizontalCenter: parent.horizontalCenter;

                        Rectangle
                        {
                            id: iconoRec
                            width: 80;
                            anchors.verticalCenter: parent.verticalCenter;

                            Image
                            {
                                id: icono
                                source: decoration
                                smooth: true
                                anchors.verticalCenter: parent.verticalCenter;
                                anchors.horizontalCenter: parent.horizontalCenter;
                                fillMode: Image.PreserveAspectFit
                            }
                        }

                        Text
                        {
                            anchors {left: iconoRec.right;    verticalCenter: parent.verticalCenter }
                            text: display;
                            color: intanciaRow.ListView.isCurrentItem ? "white" : "#E30B0B";
                            font.pointSize: 10;
                            font.bold: true;
                        }

                        MouseArea
                        {
                            id: instanciasListViewMouseArea
                            anchors.fill: parent

                            // En caso de hacer clic, se guarda la información correspondiente al servidor
                            onClicked:
                            {
                                instanciasListView.currentIndex = index;
                            }

                            // En caso de doble clic, hacemos lo mismo y además lanzamos la conexión
                            onDoubleClicked:
                            {
                                instanciasListView.currentIndex = index;
                                aceptarBoton.clicked();
                            }
                        }
                    }

                    Component.onCompleted:
                    {
                        instanciasListView.currentIndex = 0;
                        positionViewAtIndex( instanciasListView.currentIndex, ListView.Center);
                    }                    

                    Timer
                    {
                        interval: 500; running: true; repeat: false
                        onTriggered:
                        {
                            if ( 1 == instanciasListView.count )
                                aceptarBoton.clicked();
                        }
                    }
                }
            }
        }
    }

    Column
    {
        id: botones
        // Botones Aceptar y Cancelar
        width: parent.width - 20
        spacing: 10;
        anchors.horizontalCenter: parent.horizontalCenter;
        anchors.bottom: parent.bottom
        anchors.margins: 50

        Row
        {
            id: botonesRow

            width: parent.width
            anchors.horizontalCenter: parent.horizontalCenter

            Rectangle
            {
                id: aceptarBoton
                width: 90
                height: conectarAceptarLabel.height + 8
                anchors.left: parent.left
                border.width: 2
                border.color: "lightgrey"
                radius: 10

                signal clicked        

                Text {
                    id: conectarAceptarLabel
                    text: "Aceptar"
                    color: aceptarRegion.pressed? "grey" : "#E30B0B"
                    anchors.centerIn: aceptarBoton
                    font.bold: true
                }

                MouseArea {
                    id: aceptarRegion
                    anchors.fill: aceptarBoton
                    onClicked: aceptarBoton.clicked()
                }

                onClicked: 
                {
                    // Nos conectamos                
                    theInstances.setInstance( instanciasListView.currentIndex );
                    theInstances.accept();
                }
            }

            Rectangle {
                id: cancelarBoton
                width: 90
                height: conectarAceptarLabel.height + 8
                border.width: 2
                border.color: "lightgrey"
                radius: 10
                anchors.right: parent.right                

                Text {
                    id: cancelLabel
                    text: "Cancelar"
                    color: cancelRegion.pressed? "grey" : "#E30B0B"
                    anchors.centerIn: cancelarBoton
                    font.bold: true
                }
                MouseArea {
                    id: cancelRegion
                    anchors.fill: cancelarBoton
                    onClicked: theInstances.reject()
                }
            }
        }
    }        
}

Última actualización