Únete a ⁠ #Android11: The Beta Launch Show el 3 de junio.

Vinculación de vista

La vinculación de vista es una función que te permite escribir más fácilmente código que interactúa con las vistas. Una vez que la vinculación de vista está habilitada en un módulo, genera una clase de vinculación para cada archivo de diseño XML presente en ese módulo. Una instancia de una clase de vinculación contiene referencias directas a todas las vistas que tienen un ID en el diseño correspondiente.

En la mayoría de los casos, la vinculación de vistas reemplaza a findViewById.

Instrucciones de configuración

La vinculación de vista se habilita módulo por módulo. Para habilitar la vinculación de vista en un módulo, agrega el elemento viewBinding a su archivo build.gradle, como se muestra en el siguiente ejemplo:

android {
        ...
        viewBinding {
            enabled = true
        }
    }
    

Si deseas que se ignore un archivo de diseño mientras se generan clases de vinculación, agrega el atributo tools:viewBindingIgnore="true" a la vista raíz de ese archivo:

<LinearLayout
            ...
            tools:viewBindingIgnore="true" >
        ...
    </LinearLayout>
    

Uso

Si se habilita la vinculación de vista para un módulo, se genera una clase de vinculación para cada archivo de diseño XML que contiene el módulo. Cada clase de vinculación contiene referencias a la vista raíz y a todas las vistas que tienen un ID. El nombre de la clase de vinculación se genera convirtiendo el nombre del archivo XML según la convención de mayúsculas y minúsculas, y agregando la palabra "Binding" al final.

Por ejemplo, en un archivo de diseño llamado result_profile.xml:

<LinearLayout ... >
        <TextView android:id="@+id/name" />
        <ImageView android:cropToPadding="true" />
        <Button android:id="@+id/button"
            android:background="@drawable/rounded_button" />
    </LinearLayout>
    

La clase de vinculación generada se llama ResultProfileBinding. Esta clase tiene dos campos: un TextView llamado name y un Button llamado button. El campo ImageView del diseño no tiene ningún ID, por lo que no se hace referencia a él en la clase de vinculación.

Cada clase de vinculación también incluye un método getRoot(), que proporciona una referencia directa para la vista raíz del archivo de diseño correspondiente. En este ejemplo, el método getRoot() de la clase ResultProfileBinding muestra la vista raíz LinearLayout.

Las siguientes secciones demuestran el uso de las clases de vinculación generadas en actividades y fragmentos.

Cómo usar la vinculación de vista en actividades

A fin de configurar una instancia de la clase de vinculación para usarla con una actividad, realiza los siguientes pasos en el método onCreate() de la actividad:

  1. Llama al método inflate() estático incluido en la clase de vinculación generada. Esto crea una instancia de la clase de vinculación para la actividad que se usará.
  2. Para obtener una referencia a la vista raíz, llama al método getRoot() o usa la sintaxis de la propiedad Kotlin.
  3. Pasa la vista raíz a setContentView() para que sea la vista activa en la pantalla.

Kotlin

    private lateinit var binding: ResultProfileBinding

    override fun onCreate(savedInstanceState: Bundle) {
        super.onCreate(savedInstanceState)
        binding = ResultProfileBinding.inflate(layoutInflater)
        val view = binding.root
        setContentView(view)
    }
    

Java

    private ResultProfileBinding binding;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = ResultProfileBinding.inflate(getLayoutInflater());
        View view = binding.getRoot();
        setContentView(view);
    }
    

Ahora puedes usar la instancia de la clase de vinculación para hacer referencia a cualquiera de las vistas:

Kotlin

    binding.name.text = viewModel.name
    binding.button.setOnClickListener { viewModel.userClicked() }
    

Java

    binding.getName().setText(viewModel.getName());
    binding.button.setOnClickListener(new View.OnClickListener() {
        viewModel.userClicked()
    });
    

Cómo usar la vinculación de vista en fragmentos

A fin de configurar una instancia de la clase de vinculación para su uso con un fragmento, realiza los siguientes pasos en el método onCreateView() del fragmento:

  1. Llama al método inflate() estático incluido en la clase de vinculación generada. Esto crea una instancia de la clase de vinculación para que la use el fragmento.
  2. Para obtener una referencia a la vista raíz, llama al método getRoot() o usa la sintaxis de la propiedad Kotlin.
  3. Muestra la vista raíz del método onCreateView() para convertirla en la vista activa de la pantalla.

Kotlin

    private var _binding: ResultProfileBinding? = null
    // This property is only valid between onCreateView and
    // onDestroyView.
    private val binding get() = _binding!!

    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        _binding = ResultProfileBinding.inflate(inflater, container, false)
        val view = binding.root
        return view
    }

    override fun onDestroyView() {
        super.onDestroyView()
        _binding = null
    }
    

Java

    private ResultProfileBinding binding;

    @Override
    public View onCreateView (LayoutInflater inflater,
                              ViewGroup container,
                              Bundle savedInstanceState) {
        binding = ResultProfileBinding.inflate(inflater, container, false);
        View view = binding.getRoot();
        return view;
    }

    @Override
    public void onDestroyView() {
        super.onDestroyView();
        binding = null;
    }
    

Ahora puedes usar la instancia de la clase de vinculación para hacer referencia a cualquiera de las vistas:

Kotlin

    binding.name.text = viewModel.name
    binding.button.setOnClickListener { viewModel.userClicked() }
    

Java

    binding.getName().setText(viewModel.getName());
    binding.button.setOnClickListener(new View.OnClickListener() {
        viewModel.userClicked()
    });
    

Diferencias de findViewById

La vinculación de vistas tiene ventajas importantes frente al uso de findViewById:

  • Seguridad nula: Debido a que la vinculación de vista crea referencias directas a las vistas, no hay riesgo de una excepción de puntero nulo debido a un ID de vista no válido. Además, cuando una vista solo está presente en algunas configuraciones de un diseño, el campo que contiene su referencia en la clase de vinculación se marca con @Nullable.
  • Seguridad de tipos: Los campos de cada clase de vinculación tienen tipos que coinciden con las vistas a las que hacen referencia en el archivo XML. Esto significa que no hay riesgo de una excepción de transmisión de clase.

Estas diferencias significan que las incompatibilidades entre tu diseño y tu código harán que falle la compilación durante el momento de compilación en lugar de hacerlo en el tiempo de ejecución.

Comparación con la vinculación de datos

La vinculación de vistas y la vinculación de datos generan clases de vinculación que puedes usar para hacer referencia a vistas directamente. Sin embargo, la vinculación de vistas está diseñada para procesar casos de uso más simples y proporciona los siguientes beneficios por sobre la vinculación de datos:

  • Compilación más rápida: la vinculación de vistas no requiere procesamiento de anotaciones, por lo que los tiempos de compilación son más rápidos.
  • Facilidad de uso: la vinculación de vistas no requiere archivos de diseño XML etiquetados especialmente, por lo que es más rápido adoptarlos en tus apps. Una vez que habilites la vinculación de vista en un módulo, se aplicará automáticamente a todos los diseños de ese módulo.

En cambio, la vinculación de vista tiene las siguientes limitaciones en comparación con la vinculación de datos:

Debido a estas consideraciones, en algunos casos es mejor usar la vinculación de vistas y la vinculación de datos en un proyecto. Puedes usar la vinculación de datos en diseños que requieren funciones avanzadas y usar la vinculación de vista en diseños que no lo requieren.