Formation Android

TP 2 - Compose & Intents

Objectif

implémenter des actions sur nos tâches, en naviguant entre des Activity et partager des infos entre elle ou dans une autre application avec des Intent.

Suppression d’une tache

Dans le layout de vos item, ajouter un ImageButton qui servira à supprimer la tâche associée. Vous pouvez utiliser par exemple l’icône @android:drawable/ic_menu_delete

Aidez vous des lignes de code plus bas pour réaliser un “Click Listener” à l’aide d’une lambda en suivant ces étapes:

• Dans l’adapter, ajouter une propriété onClickDelete de type lambda qui prends en arguments une Task et ne renvoie rien: (Task) -> Unit et l’initier à {} (elle ne fait rien par défaut)
• Utilisez cette lambda dans le onClickListener du bouton supprimer

• Dans le fragment, accéder à onClickDelete depuis l’adapter et implémentez là: donnez lui comme valeur une lambda qui va supprimer la tache passée en argument de la liste

• Déclaration de la variable lambda dans l’adapter, par défaut elle ne fait rien ({}):

var onClickDelete: (Task) -> Unit = {}

• Utilisation de la lambda dans le ViewHolder, quand on clique sur le bouton:

onClickDelete(task)

• “implémentation” de la lambda dans le fragment, pour que la lambda aie un effet:

myAdapter.onClickDelete = { task ->
    // Supprimer la tâche
}

Compose: DetailActivity

• Créez un package detail dans votre package principal
• Créez-y avec l’IDE une nouvelle Activity: DetailActivity: Clic droit sur le package > New > Activity > Gallery... > Empty Activity
• L’IDE devrait automatiquement compléter app/build.gradle.kts pour configurer Compose (buildFeatures, dependencies, etc) et l’ajouter au AndroidManifest.xml

• Faire en sorte de lancer la nouvelle Activity depuis le bouton + de la première activity

startActivity(intent)

• Renommez Greeting en Detail et GreetingPreview en DetailPreview et supprimez l’argument name

• Changez le texte affiché dans le component Text(...) par un titre: "Task Detail"
• Ajoutez lui un style : MaterialTheme.typography.headlineLarge
• Ajoutez deux autres Text() avec comme contenu "title" et "description"
• Mettez les 3 Text dans une Column {}: c’est l’équivalent d’un LinearLayout vertical
• Ajoutez un modifier à votre Column pour ajouter un padding de 16.dp
• Ajoutez un verticalArrangement à votre Column pour espacer ses enfants de 16.dp (Arrangement.spacedBy(...))
• Ajoutez un Button de validation dans la Column
• Personalisez un peu l’UI si vous le souhaitez
• Vérifiez que vous naviguez bien vers l’écran en cliquant sur + et qu’il s’affiche correctement

Ajout de tâche complet: Launcher

• Créez un “launcher” en propriété de la classe TaskListFragment qui permettra de lancer votre nouvelle activité et d’utiliser son résultat:

val createTask = registerForActivityResult(StartActivityForResult()) { result ->
  // dans cette callback on récupèrera la task et on l'ajoutera à la liste
}

• Remplacez l’action du bouton d’ajout pour qu’il ouvre cette activité avec un Intent

createTask.launch(intent)

Ajout de tâche complet: DetailActivity

• Dans votre composant Detail, ajoutez un argument onValidate: (Task) -> Unit et appelez cette lambda dans le onClick de votre bouton de validation, en passant une nouvelle task:

val newTask = Task(id = UUID.randomUUID().toString(), title = "New Task !")

• Dans onCreate, Detail va donc maintenant nécessiter une lambda onValidate, que nous allons définir et utiliser:

• Ajouter newTask dans intent: intent.putExtra("task", newTask): ça ne compilera pas car Task ne fait pas partie des types de base autorisés dans un intent !
• L’un de ces types est Serializable: Faites donc hériter Task de java.io.Serializable, comme c’est une data class, il n’y a rien à implémenter !
• utilisez setResult(RESULT_OK, intent) pour signifier que l’action s’est bien passée (idéalement, on aurait aussi géré des cas d’erreur)
• utilisez finish() pour quitter cette activité, et donc retourner à l’écran précédent

Ajout de tâche complet: Résultat

• Dans la lambda de retour de createTask récupérer cette task:

val task = result.data?.getSerializableExtra("task") as Task?

• et ajoutez la à la liste, comme vous le faisiez avec le bouton d’ajout précédemment

• Faites en sorte que la nouvelle tache s’affiche dans la liste directement

• Dans DetailActivity, changez les Text en OutlinedTextField, on va mettre à jour dynamiquement la Task affichée:

Édition d’une tâche

Inspirez vous de ce que vous avez fait pour le bouton “supprimer” et le bouton “ajouter” pour créer un bouton “éditer” permettant de modifier chaque tâche en ouvrant l’activité DetailActivity pré-remplie avec les informations de la tâche en question:

• Créez un autre launcher dans le fragment
• Créez une autre lambda dans l’adapter
• Utilisez dans celle ci putExtra pour transmettre la Task à éditer (depuis TaskListFragment cette fois)
• Récupérez la Task dans le onCreate de DetailActivity avec getSerializableExtra comme précédemment (avec intent à la place de result.data)
• La Task récupérée est nullable: c’est utile car elle sera null quand vous êtes dans le cas “Ajout”, et sinon, elle aura une vraie valeur car vous êtes dans le cas “Édition”
• passez la en argument de Detail: initialTask: Task? et utilisez la comme valeur initiale de votre variable compose task afin de préremplir les OutlinedTextField lors de l’édition
• Utilisez l’opérateur ?: pour gérer à la fois le cas édition et ajout:

mutableStateOf(initialTask ?: newTask)

• Au retour dans votre launcher, récupérez la task modifiée, gérez la nullabilité (avec un if ou un ?: return par ex) mettez à jour la liste: taskList = taskList.map { if (it.id == task.id) task else it }
• Vérifier que les infos éditées s’affichent bien à notre retour sur l’activité principale.

Interface et délégation

Une façon plus classique de gérer les clicks d’un item est de définir une interface que l’on implémentera dans l’Activity/Fragment. Mettez à jour votre code pour utiliser cette méthode:

interface TaskListListener {
  fun onClickDelete(task: Task)
  fun onClickEdit(task: Task)
}

class TaskListAdapter(val listener: TaskListListener) : ... {
  // use: listener.onClickDelete(task)
}

class TaskListFragment : Fragment {
  val adapterListener : TaskListListener = object : TaskListListener {
    override fun onClickDelete(task: Task) {...}
    override fun onClickEdit(task: Task) {...}
  }
  val adapter = TaskListAdapter(adapterListener)
}

Partager

• En modifiant AndroidManifest.xml, ajouter la possibilité de partager du texte depuis les autres applications (par ex en surlignant un texte dans un navigateur puis en cliquant sur “partager”) et ouvrir le formulaire de création de tâche avec une description pré-remplie (Documentation)

• En utilisant un Intent implicite, ajouter la possibilité de partager du texte vers les autres applications (avec un OnLongClickListener sur les tâches par ex ou bien avec un bouton dans la vue formulaire) (Documentation)

Changements de configuration

Que se passe-t-il pour votre liste si vous tournez votre téléphone pour passer en mode paysage ? 🤔

• Une façon de régler ce soucis est d’overrider la méthode onSaveInstanceState
• Il faudra utiliser putSerializable (un peu comme précédemment avec putExtra) pour sauvegarder la liste
• Puis pour récupérer cette liste, la méthode getSerializable dans onCreateView ou onViewCreated, sur le paramètre savedInstanceState