Cuando diseñas la navegación para tu app, es posible que desees navegar a un destino en lugar de otro según la lógica condicional. Por ejemplo, un usuario podría seguir un vínculo directo a un destino que requiere que este acceda, o bien podrías tener diferentes destinos en un juego para cuando el jugador gane o pierda.
Acceso del usuario
En este ejemplo, un usuario intenta navegar a una pantalla de perfil que requiere autenticación. Debido a que esta acción requiere autenticación, el usuario debe ser redireccionado a una pantalla de acceso si todavía no está autenticado.
El gráfico de navegación de este ejemplo podría verse de la siguiente manera:
![un flujo de acceso se controla de manera independiente del flujo de navegación principal de la app.](https://developer.android.google.cn/static/images/guide/navigation/navigation-conditional-login.png?authuser=19&hl=es)
Para realizar la autenticación, la app debe navegar a login_fragment
, donde el usuario puede ingresar un nombre de usuario y una contraseña a los efectos de autenticarse. Si se aceptan las credenciales, el usuario vuelve a la pantalla profile_fragment
. Si no se aceptan, se informa al usuario que sus credenciales no son válidas mediante un Snackbar
.
Si el usuario regresa a la pantalla de perfil sin acceder, se lo envía a la pantalla main_fragment
.
A continuación, se muestra el gráfico de navegación para esta app:
<navigation 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"
android:id="@+id/nav_graph"
app:startDestination="@id/main_fragment">
<fragment
android:id="@+id/main_fragment"
android:name="com.google.android.conditionalnav.MainFragment"
android:label="fragment_main"
tools:layout="@layout/fragment_main">
<action
android:id="@+id/navigate_to_profile_fragment"
app:destination="@id/profile_fragment"/>
</fragment>
<fragment
android:id="@+id/login_fragment"
android:name="com.google.android.conditionalnav.LoginFragment"
android:label="login_fragment"
tools:layout="@layout/login_fragment"/>
<fragment
android:id="@+id/profile_fragment"
android:name="com.google.android.conditionalnav.ProfileFragment"
android:label="fragment_profile"
tools:layout="@layout/fragment_profile"/>
</navigation>
MainFragment
contiene un botón en el que el usuario puede hacer clic para ver su perfil.
Si el usuario desea ver la pantalla de perfil, primero debe autenticarse. Esa interacción se modela con dos fragmentos separados, pero depende del estado del usuario compartido. Esa información de estado no es responsabilidad de ninguno de los dos fragmentos y se mantiene más apropiadamente en un UserViewModel
compartido.
Este ViewModel
se comparte entre los fragmentos cuando se determina su alcance en relación con la actividad, que implementa ViewModelStoreOwner
. En el siguiente ejemplo, requireActivity()
se resuelve en MainActivity
porque MainActivity
aloja ProfileFragment
:
Kotlin
class ProfileFragment : Fragment() { private val userViewModel: UserViewModel by activityViewModels() ... }
Java
public class ProfileFragment extends Fragment { private UserViewModel userViewModel; @Override public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) { super.onViewCreated(view, savedInstanceState); userViewModel = new ViewModelProvider(requireActivity()).get(UserViewModel.class); ... } ... }
Los datos del usuario en UserViewModel
se exponen a través de LiveData
, por lo que, para decidir a dónde navegar, debes observar esos datos. Cuando navegas a ProfileFragment
, la app muestra un mensaje de bienvenida si los datos del usuario están presentes. Si los datos del usuario son null
, navegas a LoginFragment
, ya que el usuario debe autenticarse antes de ver su perfil. Define la lógica de decisión en tu ProfileFragment
, como se muestra en el siguiente ejemplo:
Kotlin
class ProfileFragment : Fragment() { private val userViewModel: UserViewModel by activityViewModels() override fun onViewCreated(view: View, savedInstanceState: Bundle?) { super.onViewCreated(view, savedInstanceState) val navController = findNavController() userViewModel.user.observe(viewLifecycleOwner, Observer { user -> if (user != null) { showWelcomeMessage() } else { navController.navigate(R.id.login_fragment) } }) } private fun showWelcomeMessage() { ... } }
Java
public class ProfileFragment extends Fragment { private UserViewModel userViewModel; @Override public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) { super.onViewCreated(view, savedInstanceState); userViewModel = new ViewModelProvider(requireActivity()).get(UserViewModel.class); final NavController navController = Navigation.findNavController(view); userViewModel.user.observe(getViewLifecycleOwner(), (Observer<User>) user -> { if (user != null) { showWelcomeMessage(); } else { navController.navigate(R.id.login_fragment); } }); } private void showWelcomeMessage() { ... } }
Si los datos del usuario son null
cuando alcanzan el ProfileFragment
, se redireccionan al LoginFragment
.
Puedes usar NavController.getPreviousBackStackEntry()
para recuperar el NavBackStackEntry
para el destino anterior, que encapsula el estado específico de NavController
para el destino. LoginFragment
usa el SavedStateHandle
del NavBackStackEntry
anterior para establecer un valor inicial que indica si el usuario accedió con éxito. Este es el estado que queremos mostrar si el usuario presionara de inmediato el botón Atrás del sistema. Configurar este estado mediante SavedStateHandle
garantiza que el estado persista hasta el cierre del proceso.
Kotlin
class LoginFragment : Fragment() { companion object { const val LOGIN_SUCCESSFUL: String = "LOGIN_SUCCESSFUL" } private val userViewModel: UserViewModel by activityViewModels() private lateinit var savedStateHandle: SavedStateHandle override fun onViewCreated(view: View, savedInstanceState: Bundle?) { savedStateHandle = findNavController().previousBackStackEntry!!.savedStateHandle savedStateHandle.set(LOGIN_SUCCESSFUL, false) } }
Java
public class LoginFragment extends Fragment { public static String LOGIN_SUCCESSFUL = "LOGIN_SUCCESSFUL" private UserViewModel userViewModel; private SavedStateHandle savedStateHandle; @Override public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) { userViewModel = new ViewModelProvider(requireActivity()).get(UserViewModel.class); savedStateHandle = Navigation.findNavController(view) .getPreviousBackStackEntry() .getSavedStateHandle(); savedStateHandle.set(LOGIN_SUCCESSFUL, false); } }
Una vez que el usuario ingresa un nombre de usuario y una contraseña, estos se pasan al UserViewModel
para su autenticación. Si el proceso es exitoso, el objeto UserViewModel
almacena los datos del usuario. Luego, LoginFragment
actualiza el valor LOGIN_SUCCESSFUL
en SavedStateHandle
y se retira de la pila de actividades.
Kotlin
class LoginFragment : Fragment() { companion object { const val LOGIN_SUCCESSFUL: String = "LOGIN_SUCCESSFUL" } private val userViewModel: UserViewModel by activityViewModels() private lateinit var savedStateHandle: SavedStateHandle override fun onViewCreated(view: View, savedInstanceState: Bundle?) { savedStateHandle = findNavController().previousBackStackEntry!!.savedStateHandle savedStateHandle.set(LOGIN_SUCCESSFUL, false) val usernameEditText = view.findViewById(R.id.username_edit_text) val passwordEditText = view.findViewById(R.id.password_edit_text) val loginButton = view.findViewById(R.id.login_button) loginButton.setOnClickListener { val username = usernameEditText.text.toString() val password = passwordEditText.text.toString() login(username, password) } } fun login(username: String, password: String) { userViewModel.login(username, password).observe(viewLifecycleOwner, Observer { result -> if (result.success) { savedStateHandle.set(LOGIN_SUCCESSFUL, true) findNavController().popBackStack() } else { showErrorMessage() } }) } fun showErrorMessage() { // Display a snackbar error message } }
Java
public class LoginFragment extends Fragment { public static String LOGIN_SUCCESSFUL = "LOGIN_SUCCESSFUL" private UserViewModel userViewModel; private SavedStateHandle savedStateHandle; @Override public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) { userViewModel = new ViewModelProvider(requireActivity()).get(UserViewModel.class); savedStateHandle = Navigation.findNavController(view) .getPreviousBackStackEntry() .getSavedStateHandle(); savedStateHandle.set(LOGIN_SUCCESSFUL, false); EditText usernameEditText = view.findViewById(R.id.username_edit_text); EditText passwordEditText = view.findViewById(R.id.password_edit_text); Button loginButton = view.findViewById(R.id.login_button); loginButton.setOnClickListener(v -> { String username = usernameEditText.getText().toString(); String password = passwordEditText.getText().toString(); login(username, password); }); } private void login(String username, String password) { userViewModel.login(username, password).observe(viewLifecycleOwner, (Observer<LoginResult>) result -> { if (result.success) { savedStateHandle.set(LOGIN_SUCCESSFUL, true); NavHostFragment.findNavController(this).popBackStack(); } else { showErrorMessage(); } }); } private void showErrorMessage() { // Display a snackbar error message } }
Ten en cuenta que toda la lógica relacionada con la autenticación se mantiene dentro de UserViewModel
. Esto es importante, ya que no es responsabilidad de LoginFragment
ni de ProfileFragment
determinar cómo se autentican los usuarios. Encapsular tu lógica en un ViewModel
hace que compartirla y probarla sea más fácil. Si tu lógica de navegación es compleja, debes verificar especialmente esta lógica mediante pruebas. Consulta la Guía de arquitectura de apps para obtener más información relacionada con cómo estructurar la arquitectura de tu app en torno a los componentes que se pueden probar.
En ProfileFragment
, se puede observar el valor LOGIN_SUCCESSFUL
almacenado en SavedStateHandle
en el método onCreate()
. Cuando el usuario vuelva a ProfileFragment
, se verificará el valor LOGIN_SUCCESSFUL
. Si el valor es false
, se podrá redireccionar al usuario de vuelta a MainFragment
.
Kotlin
class ProfileFragment : Fragment() { ... override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) val navController = findNavController() val currentBackStackEntry = navController.currentBackStackEntry!! val savedStateHandle = currentBackStackEntry.savedStateHandle savedStateHandle.getLiveData<Boolean>(LoginFragment.LOGIN_SUCCESSFUL) .observe(currentBackStackEntry, Observer { success -> if (!success) { val startDestination = navController.graph.startDestination val navOptions = NavOptions.Builder() .setPopUpTo(startDestination, true) .build() navController.navigate(startDestination, null, navOptions) } }) } ... }
Java
public class ProfileFragment extends Fragment { ... @Override public void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); NavController navController = NavHostFragment.findNavController(this); NavBackStackEntry navBackStackEntry = navController.getCurrentBackStackEntry(); SavedStateHandle savedStateHandle = navBackStackEntry.getSavedStateHandle(); savedStateHandle.getLiveData(LoginFragment.LOGIN_SUCCESSFUL) .observe(navBackStackEntry, (Observer<Boolean>) success -> { if (!success) { int startDestination = navController.getGraph().getStartDestination(); NavOptions navOptions = new NavOptions.Builder() .setPopUpTo(startDestination, true) .build(); navController.navigate(startDestination, null, navOptions); } }); } ... }
Si el usuario accedió correctamente, ProfileFragment
mostrará un mensaje de bienvenida.
La técnica que se usa aquí para verificar el resultado te permite distinguir entre dos casos diferentes:
- El caso inicial, en el que el usuario no accedió, y se le debería pedir que lo haga.
- El caso en el que el usuario no accedió porque optó por no hacerlo (un resultado
false
)
Si identificas esos casos de uso, puedes evitar que se le solicite al usuario que acceda en forma reiterada. Tú decides la lógica empresarial para gestionar los casos de falla, la cual podría incluir mostrar una superposición que explique por qué el usuario necesita acceder, finalizar toda la actividad o redireccionar al usuario a un destino para el que no se requiera acceder, como fue el caso del ejemplo de código anterior.