Un control en el que el usuario puede hacer clic o pulsar para interactuar con la aplicación.

Descripción

Configure la propiedad AlSeleccionar de un control Botón para ejecutar una o más fórmulas cuando el usuario haga clic en el control o lo pulse.

Propiedades principales

OnSelect: indica cómo responde la aplicación cuando el usuario toca o hace clic en un control.

Text: texto que aparece en un control o que el usuario escribe en un control.

Propiedades adicionales

Align: la ubicación del texto respecto al centro horizontal de su control.

AutoDisableOnSelect (DesahabilitarAutomáticamenteAlSeleccionar): deshabilita automáticamente el control mientras se está ejecutando el comportamiento AlSeleccionar.

BorderColor: el color de un borde del control.

BorderStyle: si el borde del control es Solid, Dashed, Dotted o None.

BorderThickness: el grosor de un borde del control.

FocusedBorderThickness (GrosorDelBordeResaltado): grosor del borde del control cuando se resalta el teclado.

Color: el color del texto en un control.

DisplayMode: indica si el control permite entradas de usuario (Edit), solo muestra datos (View) o si está deshabilitado (Disabled).

DisabledBorderColor: el color de un borde del control si la propiedad DisplayMode del control está establecida en Disabled.

DisabledColor: el color del texto en un control si su propiedad DisplayMode está establecida en Disabled.

DisabledFill: el color de fondo de un control si su propiedad DisplayMode está establecida en Disabled.

Fill: el color de fondo de un control.

Font: el nombre de la familia de fuentes en la que aparece el texto.

FontWeight: el peso del texto en un control: Bold, Semibold, Normal o Lighter.

Height: la distancia entre los bordes superior e inferior de un control.

HoverBorderColor: el color de un borde del control cuando el usuario mantiene el puntero del mouse sobre ese control.

HoverColor: el color del texto de un control cuando el usuario mantiene el puntero del mouse sobre él.

HoverFill: el color de fondo de un control cuando el usuario mantiene el puntero del mouse sobre él.

Italic: indica si el texto de un control está en cursiva.

RellenoInferior: distancia entre el texto de un control y el borde inferior de ese control.

RellenoIzquierdo: distancia entre el texto de un control y el borde izquierdo de ese control.

RellenoDerecho: distancia entre el texto de un control y el borde derecho de ese control.

RellenoSuperior: distancia entre el texto de un control y el borde superior de ese control.

Pressed: true mientras se presiona un control, en caso contrario false.

PressedBorderColor: el color de un borde del control cuando el usuario toca o hace clic en ese control.

PressedColor: el color de texto de un control cuando el usuario toca o hace clic en ese control.

PressedFill: el color de fondo de un control cuando el usuario toca o hace clic en ese control.

RadiusBottomLeft: el grado al que se redondea la esquina inferior izquierda de un control.

RadiusBottomRight: el grado al que se redondea la esquina inferior derecha de un control.

RadiusTopLeft: el grado al que se redondea la esquina superior izquierda de un control.

RadiusTopRight: el grado al que se redondea la esquina superior derecha de un control.

Size: el tamaño de la fuente del texto que aparece en un control.

Strikethrough: indica si aparece una línea sobre el texto de un control.

TabIndex: personaliza el orden de tabulación de los controles en tiempo de ejecución cuando se establece en un valor distinto de cero.

Información sobre herramientas: texto explicativo que aparece cuando el usuario mantiene el puntero sobre un control.

Underline: indica si aparece una línea debajo del texto de un control.

VerticalAlign: la ubicación del texto en un control respecto al centro vertical de ese control.

Visible: indica si un control aparece o está oculto.

Width: la distancia entre los bordes derecho e izquierdo de un control.

X: la distancia entre el borde izquierdo de un control y el borde izquierdo de su contenedor primario (la pantalla si no hay un contenedor primario).

Y: la distancia entre el borde superior de un control y el borde superior de su contenedor primario (la pantalla si no hay un contenedor primario).

Funciones relacionadas

Navegar( NombrePantalla, ScreenTransitionValue )

Ejemplos

Agregar una fórmula básica a un botón

  1. Agregue un control Entrada de texto y denomínelo Origen.

    ¿No sabe cómo agregar, nombrar y configurar un control?

  2. Agregue un control Botón, establezca su propiedad Texto en "Agregar" y su propiedad AlSeleccionar en esta fórmula:
    UpdateContext({Total:Total + Value(Source.Text)})

    ¿Desea más información sobre la función UpdateContext u otras funciones?

  3. Agregue un control Etiqueta, establezca su propiedad Texto en Total y presione F5.

  4. Borre el texto predeterminado de Origen, escriba un número en él y, a continuación, haga clic o pulse Agregar.

    El control Etiqueta muestra el número que ha escrito.

  5. Borre el número de Origen, escriba otro número y, a continuación, haga clic o pulse Agregar.

    El control Etiqueta muestra la suma de los números que ha escrito.

  6. (opcional) Repita el paso anterior una o varias veces.

  7. Para volver al área de trabajo predeterminada, presione Esc (o haga clic o pulse el icono de cerrar en la esquina superior derecha).

Configuración de un botón con varias fórmulas

Agregue una fórmula que borra el control Entrada de texto entre las entradas.

  1. Establezca la propiedad TextoDeSugerencia de Origen en "Enter a number" (Escriba un número).

  2. Establezca la propiedad AlSeleccionar de Agregar en esta fórmula:

    UpdateContext({Total:Total + Value(Source.Text)});
    UpdateContext({ClearInput: ""})

    Nota: Utilice el punto y coma ";" para separar varias fórmulas.

  3. Establezca la propiedad Predeterminad de Origen en ClearInput (Borrar entrada).

  4. Presione F5y, a continuación, pruebe la aplicación agregando varios números juntos.

Integración de otro botón para restablecer el total

Agregue un segundo botón para borrar el total entre un cálculo y otro.

  1. Agregue otro control Botón, establezca su propiedad Texto en "Borrar" y su propiedad AlSeleccionar en esta fórmula:

    UpdateContext ({Total:0})

  2. Presione F5, sume varios números y luego haga clic o pulse Borrar para restablecer el total.

Cambio de la apariencia de un botón

Cambio de la forma de un botón

De forma predeterminada, PowerApps crea un control Botón rectangular con esquinas redondeadas. Puede realizar modificaciones básicas en la forma de un control Botón estableciendo sus propiedades Altura, Ancho, y Radius (Radio).

Nota: Icons and Shapes** (Iconos y formas) proporciona una gran variedad de diseños y puede realizar algunas de las mismas funciones básicas que hacen los controles **Botón. Pero, Icons and shapes (Iconos y formas) no tiene una propiedad Texto.

  1. Agregue un control Botón, y establezca sus propiedades Altura y Ancho en 300 para hacer un botón cuadrado grande.

  2. Modifique las propiedades RadiusTopLeft (RadioSuperiorIzquierdo), RadiusTopRight (RadioSuperiorDerecho), RadiusBottomLeft (RadioInferiorIzquierdo), y RadiusBottomRight (RadioInferiorDerecho) para ajustar la cantidad de curvatura en cada esquina. Estos son algunos ejemplos de formas diferentes, cada una comenzando a partir de un botón cuadrado de 300 x 300:

    • Establezca los cuatro valores de Radius (Radio) en 150 para crear un círculo.
    • Establezca los valores de RadiusTopLeft (RadioSuperiorIzquierdo) y RadiusBottomRight (RadioInferiorDerecho) en 300 para crear un Botón en forma de hoja.
    • Establezca los valores de RadiusTopLeft (RadioSuperiorIzquierdo) y RadiusTopRight (RadioSuperiorDerecho)en 300 y los valores de RadiusBottomLeft (RadioInferiorIzquierdo) y RadiusBottomRight (RadioInferiorDerecho) en 100 para crear un botón en forma de pestaña.

Cambio del color de un botón cuando se mantiene el puntero sobre él

De forma predeterminada, el color de relleno de un control Botón se atenuará en un 20 % al mantener el mouse sobre él. Puede ajustar este comportamiento cambiando la propiedad RellenoAlMantener, que usa la función ColorFade. Si establece la fórmula ColorFade en un porcentaje positivo, el color se vuelve más claro al mantener el mouse sobre el botón, mientras que un porcentaje negativo hace que el color sea más oscuro.

También puede especificar el color de un control Botón estableciendo su propiedad RellenoAlMantener en una fórmula que contenga la función ColorValue función en lugar de la función ColorFade, como en ColorValue("Red").

Nota: El valor de color puede ser cualquier definición de color CSS, ya sea un nombre o un valor hexadecimal. - Reemplace la función ColorFade con una función ColorValue en uno de los botones que creó y observe los efectos.