# 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](https://doc.velneo.com/velneo-vclient/funcionalidades-especificas/personalizacion-de-la-ventana-de-conexion-de-velneo-vclient#personalizacion-mediante-ficheros-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](#instancesmodel)( void )
### **De selección**
void [setInstance](#setinstance)( Number index )
void [accept](#accept)( void )
void [reject](#reject)( void )
### **De marco**
void [setWindowTitle](#setwindowtitle)( String szTitle )
void [setWindowIcon](#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
```qml
///////////////////////////////////////////////////////////////////////////////////////////////////
//
// 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()
}
}
}
}
}
```
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://doc.velneo.com/velneo-vdevelop/scripts/lenguajes/javascript/clases/vinstances.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.