Introducción a QML – III

Veamos ahora algo más de teoría, centrémonos en el UI:

Elementos QML

Un Elemento es la base de todos los componentes del GUI

Las propiedades básicas son:

  • Coordenadas: x, y, z, width, height, anchors
  • Transformaciones: rotation, scale, translate
  • Jerarquía: children, parent
  • Visibilidad: visible, opacity
  • Estado: state y transitions

Un elemento QML por si solo no dibuja nada

Elementos básicos QML

Como elementos básicos tenemos:

  • Rectángulo (Rectangle)
  • Imagen (Image): Las Imágenes se pueden descargar de la web
  • Texto no editable (Text)
  • Texto editable de una sola línea(TextInput)
  • Texto editable multi-línea (TextEdit)
  • Otros en desarrollo…

 

image image

 

image

Rectángulo (Rectangle)

Es un elemento esencial. Como propiedades básicas del mismo tenemos:

  • Color (color): Puede ser una referencia mediante un nombre o un valor hexadecimal.
  • Gradiente (gradient): El gradiente es siempre vertical y se puede rotar.
  • Borde (border)
  • Radio (radius)
    image
Imágen (Image)

Es otro elemento esencial para representar imágenes en los estándares habituales (jpg, png, svg)…

  • Podemos asociar desde ficheros o direcciones URL
  • cachear las imágenes (cache)
  • Carga las imágenes web de forma asíncrona (asynchronous)
  • Podemos cambiar el tamaño de la imagen mediante las propiedades de sourceSize (Elemento QSize): (ancho) width y (alto) height.
  • Establecer el modo de relleno (fillMode): Image.Stretch, Image.PreserveAspectFit, Image.PreserveAspectCrop, Image.Tile, Image.TileVertically, Image.TileHorizontally
  • Hereda de AnimatedImage

image image

 

image

Texto no editable (Text )

Es otro de los elementos básicos. Como características destacamos:

  • Soporte para textos planos y ricos
  • Soporte para marcas HTML
  • Soporte para fuentes y estilos de la plataforma donde se ejecuta
  • Alineación de texto: verticalAlignment, horizontalAlignment
  • Multilínea

 

Texto editable de una sola línea (TextInput)

Entrada de texto de una solo línea. Como características destacamos:

  • Soporte para fuentes y estilos de la plataforma donde se ejecuta
  • Soporte para selección de texto
  • Integración con el portapapeles
  • Modo Echo para entrada de passwords
  • Soporte para validadores de entrada: IntValidator, DoubleValidator, RegExpValidator

image

Texto editable multi-línea (TextEdit)

Entrada de texto de varias líneas. Como características destacamos:

Soporte para textos planos y ricos

  • Muy similar a Text y TextInput
  • Soporte para modo lectura (readOnly) y selección desde ratón (selectByMouse)
  • Integración con el portapapeles

image

Otras lecturas relacionadas recomendadas:

Descargar en formato PDFDescargar en PDF
1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (1 votes, average: 4,00 out of 5)
Loading...

Seguir Jorge Hontoria Jiménez:

Gerente de TipeSoft

Dirección de proyectos de integración de software y aplicaciones orientadas a servicios. Implantación de soluciones de integración basadas en SharePoint Portal.

Últimas publicaciones de

Dejar una opinión