Enlace de datos en Android con ejemplo

En Android, la biblioteca de vinculación de datos es una biblioteca de soporte que le permite vincular los componentes de la interfaz de usuario en sus diseños a fuentes de datos en su aplicación mediante un formato declarativo en lugar de mediante programación.

¿Qué vamos a construir en este artículo?

Aquí hay un video de muestra de lo que vamos a construir en este proyecto. Tenga en cuenta que vamos a hacer este proyecto en lenguaje Java .

Implementación paso a paso

Paso 1: Crear un nuevo proyecto

• Abra un nuevo proyecto.
• Estaremos trabajando en Actividad vacía con lenguaje como Java. Deje todas las demás opciones sin cambios.
• Asigne un nombre a la aplicación a su conveniencia.
• Habrá dos archivos predeterminados llamados activity_main.xml y MainActivity.java.

Si no sabe cómo crear un nuevo proyecto en Android Studio, puede consultar ¿Cómo crear/iniciar un nuevo proyecto en Android Studio?  

Paso 2. Habilite el enlace de datos

Vaya a Gradle Scripts > gradle.scripts(módulo) y agréguele el siguiente código.

buildFeatures{
    dataBinding = true
 }

Paso 3. Trabajando en archivos XML

Vaya a la aplicación > res > diseño > actividad_principal.xml y agregue el siguiente código a ese archivo. A continuación se muestra el código para el archivo activity_main.xml .

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">
  
    <LinearLayout
        android:layout_width="match_parent"
        android:orientation="vertical"
        android:padding="16dp"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
  
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Data Binding\nFor Activity"
            android:textSize="24sp"
            android:textStyle="bold"
            android:textColor="@color/design_default_color_primary"
            android:gravity="center" />
  
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/et_input"
            android:hint="Enter text"
            android:padding="12dp"
            android:layout_marginTop="16dp"
            android:background="@android:drawable/editbox_background" />
  
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/bt_submit"
            android:text="Submit"
            android:layout_gravity="center"
            android:layout_marginTop="8dp" />
  
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/tv_output"
            android:textSize="32sp"
            android:textStyle="bold"
            android:gravity="center"
            android:layout_marginTop="8dp" />
  
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/fragment"
            android:layout_marginTop="16dp" />
  
  
    </LinearLayout>
</layout>

Navegue a la aplicación> haga clic con el botón derecho> nuevo> fragmento> BlankFragment y asígnele el nombre «MainFragement». Use el siguiente código en el archivo fragment_main.xml-

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"> 
      
        <LinearLayout
            android:layout_width="match_parent"
            android:orientation="vertical"
            android:gravity="center_horizontal"
            android:layout_height="match_parent"
            tools:context=".MainFragment">
      
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="Data Binding\nFor Fragment"
                android:textSize="24sp"
                android:textStyle="bold"
                android:textColor="@color/design_default_color_primary"
                android:gravity="center" />
      
            <EditText
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/et_input"
                android:hint="Enter text"
                android:padding="12dp"
                android:layout_marginTop="16dp"
                android:background="@android:drawable/editbox_background" />
      
            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/bt_submit"
                android:text="submit"
                android:layout_marginTop="8dp" />
      
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/tv_output"
                android:textSize="32sp"
                android:textStyle="bold"
                android:gravity="center"
                android:layout_marginTop="8dp" />
      
        </LinearLayout>
</layout>

Paso 4. Trabajando en archivos Java

Navegue hasta el archivo MainActivity.java y use el siguiente código en él. Se agregan comentarios al código para tener una mejor comprensión.

package com.example.databinding;
  
import androidx.appcompat.app.AppCompatActivity;
import androidx.databinding.DataBindingComponent;
import androidx.databinding.DataBindingUtil;
import androidx.fragment.app.Fragment;
  
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;
  
import com.example.databinding.databinding.ActivityMainBinding;
  
public class MainActivity extends AppCompatActivity {
  
    // Initialize variables
    ActivityMainBinding binding;
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
  
        // Assign variable
        binding= DataBindingUtil.setContentView(this,R.layout.activity_main);
  
        binding.btSubmit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // Get text from edit text
                String sText=binding.etInput.getText().toString().trim();
  
                // Check condition
                if(!sText.equals(""))
                {
                    // when text is not empty
                    // set text on text view
                    binding.tvOutput.setText(sText);
                }
                else
                {
                    // When text is empty
                    // Display Toast
                    Toast.makeText(getApplicationContext()
                    ,"Please enter text",Toast.LENGTH_SHORT).show();
                }
            }
        });
  
        // Initialize fragment
        Fragment fragment=new MainFragment();
  
        // Commit fragment
        getSupportFragmentManager().beginTransaction()
                .replace(R.id.fragment,fragment).commit();
    }
}

Navegue hasta el archivo MainFragment.java y use el siguiente código en él. Se agregan comentarios al código para tener una mejor comprensión.

package com.example.databinding;
  
import android.os.Bundle;
  
import androidx.databinding.DataBindingUtil;
import androidx.fragment.app.Fragment;
  
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Toast;
  
import com.example.databinding.databinding.FragmentMainBinding;
  
public class MainFragment extends Fragment {
  
    // Initialize variable
    private FragmentMainBinding binding;
    private View view;
  
    private static final String ARG_PARAM1 = "param1";
    private static final String ARG_PARAM2 = "param2";
  
    private String mParam1;
    private String mParam2;
  
    public MainFragment() {
    // Required empty public constructor
    }
  
    public static MainFragment newInstance(String param1, String param2) {
        MainFragment fragment = new MainFragment();
        Bundle args = new Bundle();
        args.putString(ARG_PARAM1, param1);
        args.putString(ARG_PARAM2, param2);
        fragment.setArguments(args);
        return fragment;
    }
  
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        if (getArguments() != null) {
            mParam1 = getArguments().getString(ARG_PARAM1);
            mParam2 = getArguments().getString(ARG_PARAM2);
        }
    }
  
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
  
        // Assign variable
        binding= DataBindingUtil.inflate(inflater,R.layout.fragment_main,container,false);
        view=binding.getRoot();
  
        binding.btSubmit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // Get text from edit text
                String sText=binding.etInput.getText().toString().trim();
  
                // Check condition
                if(!sText.equals(""))
                {
                    // When text is not empty
                    // Set text on text view
                    binding.tvOutput.setText(sText);
                }
                else
                {
                    // When text is empty
                    // Display Toast
                    Toast.makeText(view.getContext(),
                            "Please enter text",Toast.LENGTH_SHORT).show();
                }
            }
        });
  
        // Return view
        return view;
    }
}

Aquí está el resultado final de nuestra aplicación.

Producción: