Herramientas de usuario

Herramientas del sitio


wiki:2.-desarrollo-app:2.1.-ide-desarrollo:cloudstudio:ventanas:start



Ventanas

Opción que se encuentra en el menú superior del XoneCloud Studio que nos permite movernos a través de las ventanas que conforman la estructura del Xone Cloud Studio, y al seleccionarla muestra el siguiente submenú:

Las opciones a las que podemos acceder son:

Opciones Menú Ventanas Descripción
Inicio Activa el panel central y principal del Xone Cloud Studio, que contiene el editor del código XML.
Solución Activa y posiciona el cursor en el panel del Cloud Studio en la pestaña Solution y ficheros del proyecto, ubicados en forma de explorador de ficheros.
Archivos Activa y nos posiciona el cursor en el panel del Cloud Studio que contiene la pestaña File System del proyecto, ubicados en forma de explorador de ficheros.
Propiedades Activa y nos posiciona en el panel de diseño de propiedades Properties que conforman el proyecto.
Caja de Herramientas Activa y nos posiciona en el panel que contiene la caja de herramientas Toolbox del Xone Cloud Studio.
Estructura del proyecto Activa y posiciona en el panel que contiene la pestaña Structure del Xone Cloud Studio.
Eventos Activa y posiciona en el panel que contiene la pestaña Events.
Restaurar Configuración Restaura la configuración por defecto de las distintas ventanas que conforman el Xone Cloud Studio.
Info Xone Studio Muestra la versión actual del Xone Cloud Studio con el que estamos trabajando.

A continuación detallaremos cada una de las distintas ventanas que conforman la estructura del Xone CloudStudio y sus características principales:

Inicio

Ventana central y principal de edición del Xone Cloud Studio, donde se muestra el proyecto abierto en cuestión, no es más que el editor de texto donde se pueden ver los códigos XML. A medida que nos movemos por el árbol del panel izquierdo Solution y File System, se irán creando pestañas en la parte superior. Esta distribución de pestañas se guardará siempre cuando cerremos el proyecto, lo cual al volver a abrirlo se nos ha guardado la última distibución que dejamos.

Solución

En esta ventana encontraremos la distribución en forma de explorador de archivos de todos los ficheros,archivos, colecciones que conforman nuestro proyecto. Colecciones como Empresas, Entrada App, Usuarios, las propias colecciones definidas por el desarrollador, los cssstyles, imagenes, base de datos, etc.

En la parte superior de la misma aparece una pequeña ventana de búsqueda que nos permite buscar cualquier elemento contenido en la misma.

En la parte derecha de cada uno de los ficheros o colecciones podemos encontrar los siguientes íconos cuyas funciones son:

Renombra fichero o colección
Copiar fichero o colección
Eliminar archivo o Colección
Descargar fichero o colección

Archivos

Ventana Archivos o File System, situada en el panel de la izquierda, pestaña a la derecha de la ventana Solution. La ventana de Archivos es la que contiene todos los elementos de nuestro proyecto en formato de carpetas, contiene los ficheros .xml y .xne por cada colección creada. Aquí es donde está la distribución de nuestro proyecto de forma unificada. Es la visualización de cada fichero y carpeta de nuestro proyecto.

En la parte superior de la misma aparece una pequeña ventana de búsqueda que nos permite buscar cualquier elemento contenido en la misma.

En la parte derecha de cada uno de los ficheros o colecciones podemos encontrar de forma similar a la ventana de Solution, diferentes íconos con las siguientes funciones:
Renombra fichero o colección
Copiar fichero o colección
Eliminar archivo o Colección
Descargar fichero o Colección
Igualmente encontramos el siguiente botón que nos permite adicionar cualquier fichero que nos interese incluir y se encuentre en cualquier fuente externa al proyecto. Al seleccionar, se visualiza la siguiente pantalla:


Definiremos en esta pantalla los elementos siguientes: Nuevo Fichero: Nombre que daremos al nuevo fichero a incluir en el proyecto. Crear como carpeta: Nos permite adicionar el elemento en forma de carpeta. Browse: Nos remite a la ventana de selección habitual de ficheros, lo cual también puede hacerse arrastrando dicho fichero a la ventana central.

Finaliza la operación y abandona la pantalla.

Propiedades

Muestra la ventana del mismo nombre, situada en panel derecho inferior.


Esta función nos muestra el nombre y tipo de propiedades que contienen los elementos visuales.

Para ello, si nos colocamos encima de un prop, por ejemplo, como en la siguiente imagen, en la pantalla de propiedades nos mostrará todas las propiedades de ese prop que hayamos señalado, como descripción, color, tamaño, anchura, alineación, márgenes, tipo de letra…etc:

Ejemplo propiedades de un prop tipo B:



Tributos visuales

  • Título Imagen
  • Bordes de Etiqueta
  • Alineación de texto

Colores

  • Color Etiqueta
  • Fondo Etiqueta

Fuentes

  • Tamaño de Fuente
  • Nombre de Fuente
  • Fuente BOLD

Tamaño y Posición

  • Ancho Etiqueta
  • Ancho
  • Alto
  • Margen Izquierdo
  • Margen derecho
  • Margen Superior

Caja de Herramientas

Esta opción nos permite acceder a la ventana clásica Toolbox de diseño que contiene cada uno de los controles que permite Xone usar en sus proyectos.

  • Controles Básicos como: Etiqueta, Botón, Caja de Texto, CheckBox, Foto, Numérico, Imagen, fecha, Lupa de búsqueda, etc.



  • Layout: Aquellos destinados a los tipo frames en todas sus variedades, frame flotante, frame múltiple, frame triple, frame doble derecha, frame doble izquierda, etc.



  • Controles avanzados: Campo firma, Videos, Códigos de Barras, Adjuntar archivos, etc.



  • Contenedores: Controles como drawers, Calendario, Mapas, Gráficos, etc.

Cada una de estas ventanas puede ser cerrada, minimizada y moverse, de manera similar a cuando tratamos ventanas de entorno Windows.

Estructura del Proyecto


Ventana que muestra estructura del proyecto, según la colección donde se esté posicionado. Va mostrando en forma de árbol, por ejemplo; los grupos (G), dentro de los grupos los frames (F) de ese grupo, dentro de los frames, las propiedades definidas dentro de los frames ((b)-En este ejemplo porque solo hay definido propiedades tipo botones.)

Eventos


Ventana que muestra los eventos definidos en la colección. Se aprecia de la siguiente forma:

Para añadir un nuevo evento a la colección, utilizar el ícono . Mostrará la siguiente pantalla:

En esta pantalla será necesario definir :

  • Origen de evento que queremos añadir a colección actual
  • Evento que queramos añadir

Crea evento y finaliza proceso.
Cancela añadir evento.

Restaurar configuración


Opción que permite restablecer el formato de cada una de las ventanas anteriores a su configuración por defecto.

Info XoneStudio


Opción que muestra la versión actual del XOne Studio con el que estamos trabajando.

Otras opciones disponibles en barra superior de Menú Principal


Buscar



En esta opción situada en la barra superior del Menú principal, nos permite la búsqueda de cualquier cadena de texto en nuestro proyecto, podemos seleccionar si lo queremos en el documento actual en que nos encontramos posicionado o en todo y cada uno de los documentos del proyecto.

Copiar



Opción que permite hacer copia al dispositivo de los nuevos cambios que hemos hecho en el proyecto o volver a copiar el proyecto al dispositivo en su totalidad. Esto se genera en el momento que queramos depurar o probar nuestro proyecto en el dispositivo.

Cerrar proyecto


Este ícono nos permite cerrar el proyecto fácilmente, actúa como ícono de atajo para cerrar todo.

Teclas de Controles para Acciones Rápidas

Estas acciones se podrán realizar combinando varias teclas, estas funciones son válidas utilizando el Cloud Studio en el Navegador Chrome

Teclas Acción
CONTROL + / COMENTAR LINEAS
CONTROL + W CERRAR VENTANA ACTIVA DEL NAVEGADOR
CONTROL + E LLEVA EL CURSOR A LA BARRA DEL BUSCADOR, Y TE ABRE EL BUSCADOR DE GOOGLE
CONTROL + R RECARGAR LA PAGINA
CONTROL + T ABRE UNA NUEVA PESTAÑA
CONTROL + U CONVERTIR PALABRA EN MAYUSCULAS
CONTROL + O ABRIR FICHERO
CONTROL + P IR AL FINAL DE ESE NODO
CONTROL + A SELECCIONAR TODO
CONTROL + S GUARDAR ESA PAGINA ABIERTA. NO GUARDA EN CLOUDSTUDIO, SINO PARA DESCARGAR FICHERO
CONTROL + D BORRA LA LINEA EN LA QUE ESTA EL CURSOR
CONTROL + F ABRE VENTANA PARA BUSCAR EN LA VENTANA QUE ESTES DE LA PAGINA ENTERA.
CONTROL + G ABRE VENTANA PARA BUSCAR EN TODA LA PESTAÑA
CONTROL + H ABRE VENTANA PARA REEMPLAZAR
CONTROL + J ABRE VENTANA DE DESCARGAS
CONTROL + L ABRE VENTANA PARA INDICAR A LA LINEA QUE QUIERES IR
CONTROL + Z DESHACER
CONTROL + C COPIAR LO SELECCIONADO
CONTROL + V PEGAR LO COPIADO
CONTROL + N ABRE UNA VENTANA NUEVA
wiki/2.-desarrollo-app/2.1.-ide-desarrollo/cloudstudio/ventanas/start.txt · Última modificación: 2019/12/03 17:24 por ary