Ajouter une fonctionnalité camera dans son application en kotlin

Bonjour à tous ! Dans ce nouvel article je vais vous montrer comment vous aller pouvoir incorporer les fonctionnalités de prise de photo dans vos applications Android en Kotlin. Cette fonctionnalité peut vous servir, si vous souhaitez faire une application incorporant une galerie ou bien une application de chat. Toutes les idées sont bonnes à prendre, l’imagination n’a que de limite que la complexité de votre projet.

Dans cet article, je vais vous montrer comment mettre en place un bouton pour accéder à l’interface de la caméra de votre téléphone, comment vous aller pouvoir prendre une photo et pour finir comment vous allez pouvoir afficher la photo prise dans votre application.

Démonstration de l’application

La petite démonstration ci-dessous va présenter une application simple que vous pouvez reproduire chez vous.  La fonctionnalité que j’ai précisée plus haut va vous permettre de prendre une photo avec à partir de la caméra de votre smartphone et l’insérer dans votre application.

Vous avez peut-être dû le remarquer, il y a un deuxième bouton dans l’application à droite du premier qui n’est pas utilisé. J’ai essayé d’implémenter une galerie d’images mais mes résultats n’étaient pas assez concluants. J’ai donc décidé de le laisser en suspens.

L’aspect visuelle de l’application

Cette fonctionnalité est basique, mais elle  reste simple à comprendre pour que vous vous l’appropriez. Je suis sûr que vous saurez trouver une meilleure utilisation que moi. Si vous êtes tout de même intéressé par le contenu autant que par le design de l’application en tant que telle, je vous invite donc à vous inspirer du code XML ci-dessous.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:weightSum="10"
        tools:context=".MainActivity">

    <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:gravity="center"
            android:layout_weight="5">
        <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_margin="40dp"
                app:srcCompat="@android:drawable/btn_star"
                android:id="@+id/imageView"/>
    </LinearLayout>
    <LinearLayout
            android:orientation="horizontal"
            android:gravity="center|bottom"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="5">
        <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/TakePhoto"
                android:layout_margin="20dp"/>

        <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/addToGallery"
                android:layout_margin="20dp"/>
    </LinearLayout>
</LinearLayout>

On reste sur du classique, une couche principale (LinearLayout) qui englobe deux autres couches. Les deux autres LinearLayout permettent de délimiter chacune leur zone (haut et bas de l’écran).

L’implémentation du code

Passons aux choses sérieuses, si vous le voulez bien. Le code est une partie importante d’une application. Dans cette partie, je vais vous montrer comment grâce à du code vous allez pouvoir accéder à la caméra de votre smartphone et vous en servir.

L’initialisation

Avant d’accéder, à notre caméra il faut initialiser nos composants. Je déclare mes variables dans la classe et je les initialise dans la méthode “onCreate” de notre activité. (on peut également les initialiser dans une fonction qu’on crée pour l’occasion et qu’on appelle dans la méthode “onCreate”).

class MainActivity : Activity() {

    val REQUEST_IMAGE_CAPTURE = 1
    lateinit var imageView:ImageView
    lateinit var buttonTakePhoto: ImageButton
    lateinit var buttonAddToGallery: ImageButton

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        imageView = findViewById(R.id.imageView)
        buttonTakePhoto = findViewById(R.id.TakePhoto)
        buttonTakePhoto.setImageResource(R.drawable.icons_camera)
        buttonTakePhoto!!.setOnClickListener{ prendrePhoto() }
        buttonAddToGallery = findViewById(R.id.addToGallery)
        buttonAddToGallery.setImageResource(R.drawable.icon_add)

    }

Je déclare mes composants (imageView, ImageButton, ImageButton), puis je viens les initialiser avec leur tag dans la méthode “onCreate”. J’ajoute à mon bouton buttonTakePhoto une action. Lors du clic, il appellera la méthode “prendrePhoto”. Je lui associe une image, pour que dès le lancement de l’application on le reconnaisse par son icone. Je fais la même chose pour le deuxième bouton.

Les Intents

Pour gérer la liaison entre les opérations, les différentes applications  (le changement d’activité, les échanges de données entre activités, l’utilisation des différents capteurs d’un téléphone, ect..) on utilise le plus souvent les Intents. Si vous voulez un autre exemple, je vous invite à lire mon article “Comment gérer plusieurs Activity en kotlin ?“.

Il existe deux formes principales d’intention :

• Les intentions explicites où l’on doit spécifier un composant (avec  setComponent(ComponentName)ou setClass(Context, Class)), pour établir la liaison avec diverses activités internes lorsque l’utilisateur interagit avec l’application.
• Les intentions implicites ne nécessitent pas de spécifier un composant. Il est nécessaire d’indiquer au système les d’informations utiles pour qu’il détermine quel composant est le mieux adapté pour notre usage.

Notre méthode pour prendre la photo

private fun prendrePhoto() {

    Intent(MediaStore.ACTION_IMAGE_CAPTURE).also { takePictureIntent ->
        takePictureIntent.resolveActivity(packageManager)?.also {
            startActivityForResult(takePictureIntent, REQUEST_IMAGE_CAPTURE)
        }
    }

}

Pour notre part, on utilisera une intention explicite, en lui indiquant le fournisseur de médias “MediaStore” et l’action à effectuer. Pour notre part on utilisera :

Pour voir d’autre exemple d’action, je vous invite à consulter cette page.

La méthode “.also” permet de rajouter une action à notre intent cela permet également d’éviter de passer la ligne et de rappeler notre intent.

La méthode “startActivityForResult” va nous permettre de retourner à notre activité et nous renvoyer un résultat (notre photo). Cette méthode est protégée par une condition il est nécessaire qu’on l’appelle dans la méthode “resolveActivity”.

La méthode onActivityResult

override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent) {
    if (requestCode == REQUEST_IMAGE_CAPTURE && resultCode == RESULT_OK) {
        val imageRecup = data.extras.get("data") as Bitmap
        imageView.setImageBitmap(imageRecup)
    }
}

Cette une méthode propre à android, il faut donc la surcharger. Dans cette méthode, je fais appel à mes deux conditions à savoir, si le requestCode est égal à REQUEST_IMAGE_CAPTURE (option qui à été spécifier en paramètre) et si le résultat de l’opération c’est bien exécuté. Je viens ensuite récupérer les données de mon image grâce à un autre intent avec “extras.get” et créer mon image à l’écran (Bitmap) en l’associant à mon composant imageView.

Merci d’avoir lu ! Maintenant, si vous avez aimé le contenu de l’article, si  vous connaissez une personne à qui cet article peut intéresser, n’hésitez pas à le liker et à le partager sur les réseaux sociaux. Si vous souhaitez me faire part de vos remarques, de vos problèmes, de vos suggestions de prochain article ou tout simplement de votre soutien n’hésitez pas à m’en faire part dans les commentaires, je vous en remercie.