• English

4.14 Radio

El componente Radio proporciona a los usuarios la capacidad de seleccionar una única opción exclusiva entre varias alternativas. Su funcionalidad principal se centra en presentar un conjunto de opciones mutuamente excluyentes, donde al seleccionar una opción, automáticamente se deseleccionan las demás opciones dentro del mismo grupo. Este comportamiento garantiza que siempre haya solo una opción activa dentro del grupo.

El componente Radio ofrece flexibilidad en su presentación, permitiendo dos orientaciones distintas: vertical y horizontal. Puedes configurar la disposición de las opciones según tus necesidades de diseño y espacio en la interfaz de usuario.

Además, el atributo "weights" proporciona una manera de distribuir el espacio entre las opciones. Al especificar porcentajes separados por comas, puedes ajustar la proporción de ocupación de cada opción dentro del componente. Esto ofrece un control detallado sobre la presentación visual, permitiendo que ciertas opciones ocupen más espacio que otras según tus preferencias de diseño.

En resumen, el componente Radio no solo ofrece la capacidad de selección exclusiva, sino que también brinda opciones de personalización visual a través de la orientación y la distribución de pesos, lo que facilita su adaptación a diferentes diseños de interfaz de usuario.

Atributo		Valor por defecto	Tipo	Descripción
Comunes	id	null	String	Identificador único del componente. Si no tiene id, se le asigna con nomenclatura ${tag}${num}.
	render	true	Boolean o JEXLExpression	Expresión EL para evaluar si el componente debe mostrarse.
	onBeforeRender	null	String	Método JS a ejecutar antes de que el componente actual sea renderizado.
	onAfterRender	null	String	Método JS que se ejecutará una vez renderizado el componente actual.
	action	null	String	Identificador de la acción a realizar cuando el usuario interactúa con este componente.
	allowsPartialRestore	false	Boolean	Si el estado del componente actual debe restaurarse cuando el usuario vuelva a la vista.
Comunes input	label	null	String	Etiqueta del componente.
	validator	null	String	Tipo de validación del componente: required, short, long, decimal, double, float, email, iban.
	hint	null	String	Texto a modo de ayuda o información. Se mostará un botón de información que al ser pulsado mostrará un panel con el texto aportado.
	readonly	false	Boolean o JEXLExpression	Evaluar si el componente debe ser de sólo lectura o no.
	placeHolder	null	String o JEXLExpression	Valor del componente cuando el componente no tiene valor.
	inputType	null	Integer	Valor inputType de Android que soportará el componente. Ver documentación de Android InputType. Por ejemplo, para PHONE_CLASS, establezca input_type = 3. En el caso de la imagen, mostrará la botonera asociada a la imagen: 1 cámara 2 galería 4 sketch 3 galería y cámara 5 sketch y cámara 6 sketch y galería 7 cámara, galería y sketch
	hasDeleteButton	true	Boolean	Indica si se mostrará el botón de borrado del componente.
	converter	null	String	Instancia del conversor a aplicar a la propiedad de la entidad.
	value	null	String o JEXLExpression	Expresión EL para calcular el valor del componente.
weights		null	String	La proporción de ocupación de las opciones con respecto al todo. Separado por comas los porcentajes de ocupación. Si no se indica nada, las opciones ocuparán el todo de manera proporcional.
orientation		vertical	String	Orientación de las opciones: vertical, horizontal.

4.14.1 Options

4.14.1.1 Option

Atributo		Valor por defecto	Tipo	Descripción
id		null	String	Identificador único del componente. Si no tiene id, se le asigna con nomenclatura ${tag}${num}.
label		null	String	Etiqueta que se mostrará.
value		null	String o JEXLExpression	Expresión EL para calcular el valor del componente.

<radio label="Radio horizontal: " value="${entity.tipo_figura_calidad}" orientation="horizontal" weights="20, 30, 50">
    <options>
        <option id="uno" label="Uno" value="Uno" />
        <option id="dos" label="Dos" value="Dos" />
        <option id="tres" label="Tres" value="Tres" />
    </options>
</radio>
<radio label="Radio vertical: " value="${entity.tipo_figura_calidad}" orientation="vertical">
    <options>
        <option id="cuatro" label="Cuatro" value="Cuatro" />
        <option id="cinco" label="Cinco" value="Cinco" />
        <option id="seis" label="Seis" value="Seis" />
    </options>
</radio>