INTERFAZ DE USUARIO

Tabla de contenido:

• Botón

• Caja

• Progreso circular

• Selector de fechas

• Imagen

• Etiqueta

• Progreso lineal

• Selector de listas

• Vista de lista

• Notificador

• Cuadro de texto de contraseña

• Pantalla

• Control deslizante

• Hilandero

• Cambiar

• Cuadro de texto

• Selector de tiempo

• Visor web

Botón

Botón con capacidad para detectar clics. Se pueden modificar muchos aspectos de su apariencia, incluyendo si se puede hacer clic en él ( Enabled). Sus propiedades se pueden modificar en el Diseñador o en el Editor de Bloques.

Propiedades

Color de fondo

Especifica el Buttoncolor de fondo de como un entero alfa-rojo-verde-azul. Si Imagese ha definido un, el cambio de color no será visible hasta que Imagese elimine.

Activado

Especifica si Buttondebe estar activo y ser posible hacer clic.

Fuente negrita

Especifica si el texto Buttondebe estar en negrita. Algunas fuentes no admiten negrita.

Fuente itálica

Especifica si el texto Buttondebe estar en cursiva. Algunas fuentes no admiten cursiva.

Tamaño de fuente

Especifica el tamaño de fuente del texto Button, medido en sp (píxeles independientes de la escala).

FuenteTipo de letra

Especifica la fuente del texto: Buttonpredeterminada, serif, sans serif, monoespaciada o personalizada. Para añadir una fuente personalizada, suba un archivo .ttf al archivo multimedia del proyecto.

Altura

Especifica la Buttonaltura vertical de, medida en píxeles.

Porcentaje de altura

Especifica la Buttonaltura vertical de como un porcentaje de la ScreendeHeight .

Imagen

Especifica la ruta de la Buttonimagen de . Si se especifican tanto "an" Imagecomo "a" BackgroundColor, solo " Imageserá visible".

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Forma

Especifica la forma del objeto Button. Los valores válidos para esta propiedad son 0(predeterminado), 1(redondeado), 2(rectángulo) y 3(ovalado). ShapeNo será visible si Imagese utiliza un objeto .

Mostrar comentarios

Especifica si se debe mostrar una respuesta visual cuando se presiona Buttonuna tecla asignada .Image

Texto

Especifica el texto que se muestra en Button.

Alineación de texto

Especifica la alineación del Buttontexto. Los valores válidos son: 0(normal; p. ej., justificado a la izquierda si el texto se escribe de izquierda a derecha), 1(centrado) u 2(opuesto; p. ej., justificado a la derecha si el texto se escribe de izquierda a derecha).

Color del texto

Especifica el color del texto Buttoncomo un entero alfa-rojo-verde-azul.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Visible

Especifica si Buttondebe estar visible en la pantalla. El valor indica true si Buttonse muestra o falseno.

Ancho

Especifica el ancho horizontal de Button, medido en píxeles.

Porcentaje de ancho

Especifica el ancho horizontal del Buttoncomo un porcentaje del Screen.Width

Eventos

Hacer clic()

Indica que el usuario tocó y soltó el Button.

Enfócate()

Indica que el cursor se movió sobre el Buttony ahora es posible hacer clic en él.

Clic largo()

Indica que el usuario mantuvo Buttonpresionada la tecla.

Enfoque perdido()

Indica que el cursor se movió lejos de, Buttonpor lo que ya no es posible hacer clic en él.

Aterrizaje()

Indica que Buttonse presionó hacia abajo.

Retoque()

Indica que Buttonha sido liberado.

Métodos

Ninguno


Caja

CheckBoxLos componentes pueden detectar los toques del usuario y pueden cambiar su estado booleano en respuesta.

Un CheckBoxcomponente genera un evento cuando el usuario lo pulsa. Existen numerosas propiedades que afectan su apariencia y que se pueden configurar en el Diseñador o el Editor de Bloques.

Propiedades

Color de fondo

Especifica el color de fondo CheckBoxcomo un entero alfa-rojo-verde-azul.

Comprobado

Establezca truesi la casilla está marcada, falsede lo contrario.

Activado

Especifica si CheckBoxdebe estar activo y ser posible hacer clic.

Fuente negrita

Especifica si el texto CheckBoxdebe estar en negrita. Algunas fuentes no admiten negrita.

Fuente itálica

Especifica si el texto CheckBoxdebe estar en cursiva. Algunas fuentes no admiten cursiva.

Tamaño de fuente

Especifica el tamaño de fuente del texto CheckBox, medido en sp (píxeles independientes de la escala).

FuenteTipo de letra

Especifica la fuente del texto como CheckBoxpredeterminada, serif, sans serif o monoespaciada.

Altura

Especifica la CheckBoxaltura vertical de, medida en píxeles.

Porcentaje de altura

Especifica la CheckBoxaltura vertical de como un porcentaje de la ScreendeHeight .

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Texto

Especifica el texto que se muestra en CheckBox.

Color del texto

Especifica el color del texto CheckBoxcomo un entero alfa-rojo-verde-azul.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Visible

Especifica si CheckBoxdebe estar visible en la pantalla. El valor indica true si CheckBoxse muestra o falseno.

Ancho

Especifica el ancho horizontal de CheckBox, medido en píxeles.

Porcentaje de ancho

Especifica el ancho horizontal del CheckBoxcomo un porcentaje del Screen.Width

Eventos

Cambió()

El usuario tocó y soltó el CheckBox.

Enfócate()

CheckBoxse convirtió en el componente enfocado.

Enfoque perdido()

CheckBoxdejó de ser el componente enfocado.

Métodos

Ninguno


Progreso circular

Componente para CircularProgress

Propiedades

Color

Cambiar el color indeterminado de la barra de progreso circular.

Altura

Especifica la CircularProgressaltura vertical de, medida en píxeles.

Porcentaje de altura

Especifica la CircularProgressaltura vertical de como un porcentaje de la ScreendeHeight .

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Visible

Especifica si CircularProgressdebe estar visible en la pantalla. El valor indica true si CircularProgressse muestra o falseno.

Ancho

Especifica el ancho horizontal de CircularProgress, medido en píxeles.

Porcentaje de ancho

Especifica el ancho horizontal del CircularProgresscomo un porcentaje del Screen.Width

Eventos

Ninguno

Métodos

Ninguno


Selector de fechas

Un botón que, al hacer clic en él, abre un cuadro de diálogo emergente que permite al usuario seleccionar una fecha en el calendario gregoriano.

Nota: La fecha y la hora se manipulan mediante métodos en el componente Reloj .

Propiedades

Color de fondo

Especifica el DatePickercolor de fondo de como un entero alfa-rojo-verde-azul. Si Imagese ha definido un, el cambio de color no será visible hasta que Imagese elimine.

Día

Devuelve el día del mes que se seleccionó por última vez utilizando el selector de fechas.

Activado

Especifica si DatePickerdebe estar activo y ser posible hacer clic.

Fuente negrita

Especifica si el texto DatePickerdebe estar en negrita. Algunas fuentes no admiten negrita.

Fuente itálica

Especifica si el texto DatePickerdebe estar en cursiva. Algunas fuentes no admiten cursiva.

Tamaño de fuente

Especifica el tamaño de fuente del texto DatePicker, medido en sp (píxeles independientes de la escala).

FuenteTipo de letra

Especifica la fuente del texto: DatePickerpredeterminada, serif, sans serif, monoespaciada o personalizada. Para añadir una fuente personalizada, suba un archivo .ttf al archivo multimedia del proyecto.

Altura

Especifica la DatePickeraltura vertical de, medida en píxeles.

Porcentaje de altura

Especifica la DatePickeraltura vertical de como un porcentaje de la ScreendeHeight .

Imagen

Especifica la ruta de la DatePickerimagen de . Si se especifican tanto "an" Imagecomo "a" BackgroundColor, solo " Imageserá visible".

Instante

Devuelve el instante de la última fecha que se seleccionó utilizando DatePicker.

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Mes

Devuelve el número del mes que se seleccionó por última vez utilizando el selector de fechas.

Mes en texto

Devuelve el nombre del mes que se seleccionó por última vez utilizando el selector de fechas.

Forma

Especifica la forma del objeto DatePicker. Los valores válidos para esta propiedad son 0(predeterminado), 1(redondeado), 2(rectángulo) y 3(ovalado). ShapeNo será visible si Imagese utiliza un objeto .

Mostrar comentarios

Especifica si se debe mostrar una respuesta visual cuando se presiona DatePickeruna tecla asignada .Image

Texto

Especifica el texto que se muestra en DatePicker.

Alineación de texto

Especifica la alineación del DatePickertexto. Los valores válidos son: 0(normal; p. ej., justificado a la izquierda si el texto se escribe de izquierda a derecha), 1(centrado) u 2(opuesto; p. ej., justificado a la derecha si el texto se escribe de izquierda a derecha).

Color del texto

Especifica el color del texto DatePickercomo un entero alfa-rojo-verde-azul.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Visible

Especifica si DatePickerdebe estar visible en la pantalla. El valor indica true si DatePickerse muestra o falseno.

Ancho

Especifica el ancho horizontal de DatePicker, medido en píxeles.

Porcentaje de ancho

Especifica el ancho horizontal del DatePickercomo un porcentaje del Screen.Width

Año

Devuelve el año que se seleccionó por última vez utilizando el selector de fechas.

Eventos

Después de establecer fecha()

Evento que se ejecuta después de que el usuario elige una fecha en el cuadro de diálogo.

Enfócate()

Indica que el cursor se movió sobre el DatePickery ahora es posible hacer clic en él.

Enfoque perdido()

Indica que el cursor se movió lejos de, DatePickerpor lo que ya no es posible hacer clic en él.

Aterrizaje()

Indica que DatePickerse presionó hacia abajo.

Retoque()

Indica que DatePickerha sido liberado.

Métodos

Selector de lanzamiento()

Abre el cuadro de diálogo Selector de fechas. El AfterDateSetevento se ejecutará después de que el usuario confirme su selección.

SetDateToDisplay( año , mes , día )

Permite al usuario configurar la fecha que se mostrará al abrir el selector de fechas. Los valores válidos para el campo de mes son del 1 al 12 y para el campo de día, del 1 al 31.

EstablecerFechaParaMostrarDesdeInstantáneo( instantáneo )

Permite al usuario establecer la fecha desde el instante en que se mostrará cuando se abra el selector de fechas.


Imagen

Componente para mostrar imágenes y animaciones básicas.

La imagen a mostrar y otros aspectos de la apariencia de la imagen se pueden especificar en el Diseñador o en el Editor de bloques.

Propiedades

Texto alternativo

Una descripción escrita de cómo se ve la imagen.

Animación

Esta es una forma limitada de animación que permite añadir un pequeño número de tipos de movimiento a las imágenes. Los movimientos permitidos son ScrollRightSlow, ScrollRight, ScrollRightFast, ScrollLeftSlow, ScrollLeft, ScrollLeftFast, y Stop.

Cliqueable

Especifica si la imagen debe ser cliqueable o no.

Altura

Especifica la Imagealtura vertical de, medida en píxeles.

Porcentaje de altura

Especifica la Imagealtura vertical de como un porcentaje de la ScreendeHeight .

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Imagen

Especifica la ruta del Image's Picture.

Ángulo de rotación

El ángulo en el que la imagen aparece rotada. Esta rotación no aparece en la pantalla del diseñador, solo en el dispositivo.

Escalar la imagen para ajustarla

Especifica si la imagen debe redimensionarse para que coincida con el tamaño de ImageView.

Escalada

Esta propiedad determina cómo se escala la imagen según su altura o anchura. Escalar proporcionalmente (0) conserva la relación de aspecto de la imagen. Ajustar (1) se ajusta al área de la imagen, incluso si cambia la relación de aspecto.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Visible

Especifica si Imagedebe estar visible en la pantalla. El valor indica true si Imagese muestra o falseno.

Ancho

Especifica el ancho horizontal de Image, medido en píxeles.

Porcentaje de ancho

Especifica el ancho horizontal del Imagecomo un porcentaje del Screen.Width

Eventos

Hacer clic()

Un evento que ocurre cuando se hace clic en una imagen.

Métodos

Ninguno


Etiqueta

Las etiquetas son componentes que se utilizan para mostrar texto.

Una etiqueta muestra el texto especificado por la Textpropiedad. Otras propiedades, todas configurables en el Diseñador o el Editor de Bloques, controlan la apariencia y la ubicación del texto.

Propiedades

Color de fondo

Especifica el color de fondo de la etiqueta como un entero alfa-rojo-verde-azul.

Fuente negrita

Especifica si el texto de la etiqueta debe estar en negrita. Algunas fuentes no admiten negrita.

Fuente itálica

Especifica si el texto de la etiqueta debe estar en cursiva. Algunas fuentes no admiten cursiva.

Tamaño de fuente

Especifica el tamaño de fuente del texto de la etiqueta, medido en sp (píxeles independientes de la escala).

FuenteTipo de letra

Especifica la fuente del texto de la etiqueta como predeterminada, serif, sans serif o monoespaciada.

Contenido HTML

Devuelve el contenido de la etiqueta como HTML. Esto solo es útil si la propiedad HTMLFormat es verdadera.

Formato HTML

Especifica el formato del texto de la etiqueta.

Tiene márgenes

Especifica si la etiqueta debe tener márgenes. Este valor de margen no está bien coordinado con el diseñador, ya que los márgenes se definen para la disposición, no solo para etiquetas individuales.

Altura

Especifica la Labelaltura vertical de, medida en píxeles.

Porcentaje de altura

Especifica la Labelaltura vertical de como un porcentaje de la ScreendeHeight .

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Texto

Especifica el texto que se muestra en la etiqueta.

Alineación de texto

Especifica la alineación del texto de la etiqueta: centrada, normal (por ejemplo, justificado a la izquierda si el texto se escribe de izquierda a derecha) u opuesta (por ejemplo, justificado a la derecha si el texto se escribe de izquierda a derecha).

Color del texto

Especifica el color del texto de la etiqueta como un entero alfa-rojo-verde-azul.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Visible

Especifica si Labeldebe estar visible en la pantalla. El valor indica true si Labelse muestra o falseno.

Ancho

Especifica el ancho horizontal de Label, medido en píxeles.

Porcentaje de ancho

Especifica el ancho horizontal del Labelcomo un porcentaje del Screen.Width

Eventos

Ninguno

Métodos

Ninguno


Progreso lineal

Componente para LinearProgress

Propiedades

Indeterminado

Indica si esta barra de progreso está en modo indeterminado.

Color indeterminado

Cambiar el color indeterminado de la barra de progreso.

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Máximo

Establezca el rango superior de la barra de progreso al máximo.

Mínimo

Establezca el rango inferior de la barra de progreso al mínimo. Esta función solo funciona en dispositivos con API >= 26.

Progreso

Obtenga el nivel actual de progreso de la barra de progreso.

ProgresoColor

Cambiar el color de progreso de la barra de progreso.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Visible

Especifica si LinearProgressdebe estar visible en la pantalla. El valor indica true si LinearProgressse muestra o falseno.

Ancho

Especifica el ancho horizontal de LinearProgress, medido en píxeles.

Porcentaje de ancho

Especifica el ancho horizontal del LinearProgresscomo un porcentaje del Screen.Width

Eventos

ProgressChanged( progreso )

Evento que indica que se ha modificado el progreso de la barra de progreso. Devuelve el valor de progreso actual. Si "Indeterminado" se establece como verdadero, devuelve "0".

Métodos

IncrementProgressBy( valor )

Aumenta el progreso de la barra de progreso en la cantidad especificada.


Selector de listas

Un botón que, al hacer clic, muestra una lista de textos para que el usuario elija. Los textos se pueden especificar mediante el Diseñador o el Editor de Bloques, estableciendo la ElementsFromString propiedad en su concatenación separada por cadenas (por ejemplo, choice 1, choice 2, choice 3) o estableciendo la Elements propiedad en una Lista en el Editor de Bloques.

Al establecer la propiedad ShowFilterBaren true, se permitirá la búsqueda en la lista. Otras propiedades afectan la apariencia del botón ( TextAlignment, BackgroundColor, etc.) y si se puede hacer clic en él ( Enabled).

Propiedades

Color de fondo

Especifica el ListPickercolor de fondo de como un entero alfa-rojo-verde-azul. Si Imagese ha definido un, el cambio de color no será visible hasta que Imagese elimine.

Elementos

Especifica la lista de opciones para mostrar.

ElementosDeCadena

Establezca la lista de opciones a partir de una cadena de valores separados por comas.

Activado

Especifica si ListPickerdebe estar activo y ser posible hacer clic.

Fuente negrita

Especifica si el texto ListPickerdebe estar en negrita. Algunas fuentes no admiten negrita.

Fuente itálica

Especifica si el texto ListPickerdebe estar en cursiva. Algunas fuentes no admiten cursiva.

Tamaño de fuente

Especifica el tamaño de fuente del texto ListPicker, medido en sp (píxeles independientes de la escala).

FuenteTipo de letra

Especifica la fuente del texto: ListPickerpredeterminada, serif, sans serif, monoespaciada o personalizada. Para añadir una fuente personalizada, suba un archivo .ttf al archivo multimedia del proyecto.

Altura

Especifica la ListPickeraltura vertical de, medida en píxeles.

Porcentaje de altura

Especifica la ListPickeraltura vertical de como un porcentaje de la ScreendeHeight .

Imagen

Especifica la ruta de la ListPickerimagen de . Si se especifican tanto "an" Imagecomo "a" BackgroundColor, solo " Imageserá visible".

Color de fondo del elemento

El color de fondo de los ListPickerelementos.

Color del texto del elemento

El color del texto de los elementos de ListPicker.

Izquierda

Especifica la posición del borde izquierdo del componente en relación con un AbsoluteArrangement.

Selección

El elemento seleccionado. Cuando el programador lo modifica directamente, la SelectionIndex propiedad también se cambia al primer elemento con ListPickerel valor dado. Si el valor no está en Elements, SelectionIndexse establecerá en 0.

Índice de selección

Método de establecimiento de propiedad de índice de selección.

Forma

Especifica la forma del objeto ListPicker. Los valores válidos para esta propiedad son 0(predeterminado), 1(redondeado), 2(rectángulo) y 3(ovalado). ShapeNo será visible si Imagese utiliza un objeto .

Mostrar comentarios

Especifica si se debe mostrar una respuesta visual cuando se presiona ListPickeruna tecla asignada .Image

Mostrar barra de filtros

Si true, ListPicker mostrará una barra de filtro de búsqueda.

Texto

Especifica el texto que se muestra en ListPicker.

Alineación de texto

Especifica la alineación del ListPickertexto. Los valores válidos son: 0(normal; p. ej., justificado a la izquierda si el texto se escribe de izquierda a derecha), 1(centrado) u 2(opuesto; p. ej., justificado a la derecha si el texto se escribe de izquierda a derecha).

Color del texto

Especifica el color del texto ListPickercomo un entero alfa-rojo-verde-azul.

Título

Título opcional que se muestra en la parte superior de la lista de opciones.

Arriba

Especifica la posición del borde superior del componente en relación con un AbsoluteArrangement.

Comentarios

Entradas populares de este blog

Glosario de App Inventor

¿Qué es App Inventor?