Widget

Descrição dos componentes do Widget e seus atributos

O que é?

O Widget é uma classe abstrata que permite que um componente seja referenciado no Beagle. Quando um componente estende da classe widget, ele herda 3 propriedades que habilitam algum atributos e funcionalidades nos elementos visualizados.

abstract class Widget : StyleComponent, AccessibilityComponent, IdentifierComponent {

    override var id: String? = null
    override var style: Style? = null
    override var accessibility: Accessibility? = null
}

Abaixo listamos todos os atributos que um widget pode receber.

Quais seus atributos?

Atributos do Widget

Os principais atributos desta classe são:

AtributoTipoObrigatórioDefinição
id​Stringidentifica o componente que o widget referencia
styleStyledefine uma série de propriedades de estilo.
accessibilityAcessibilitydefine uma mensagem para o leitor de telas.

Como usar?

No exemplo abaixo, utilizamos um Container (um componente padrão do Beagle) para demonstrar os atributos expostos pelo widget.

Container(
    listOf(
        Text("I'am a Server-Driven text"),
        Text("I'am another Server-Driven text")
    )

).setStyle {
            backgroundColor = "#ff8100"
            cornerRadius = CornerRadius(constant(25.0))
            size = Size.box(width = 70, height = 80)
            margin = EdgeValue.all(20)
            padding = EdgeValue.all(15)
            position = EdgeValue.only(0)
            flex = Flex(FlexDirection.ROW)
            positionType = PositionType.RELATIVE
            display = Bind.value(Display.FLEX)
        }.setAccessibility {
            accessible = true
            accessibilityLabel = "I have acessibility"
        }.setId("WidgetID")

Última modificação 07/03/2022: fix: Update docs 2.0 (#858) (4368557d)