Création d'une galerie d'images dans Java pour Android avec une instance Oracle Content Management headless

Introduction

L'environnement de développement Android utilisant Java ou Kotlin peut être un outil puissant pour créer des applications qui utilisent du contenu d'Oracle Content Management. Grâce au bon modèle de contenu, vous pouvez rapidement créer l'interface utilisateur Android qui constitue une galerie d'images typique.

Dans ce tutoriel, nous allons créer une application de galerie d'images simple pour Android à l'aide de Java en utilisant Oracle Content Management comme CMS headless. Cet exemple Android est disponible sur GitHub. Ce tutoriel comporte trois étapes :

1. Préparer Oracle Content Management
2. Créer la galerie d'images dans Android Studio
3. Exécution de l'application

Prérequis

Avant de passer à ce tutoriel, nous vous recommandons de lire d'abord les informations suivantes :

• Principaux concepts
• Référentiels de ressources
• Taxonomies

Pour suivre ce tutoriel, vous aurez besoin des éléments suivants :

• un abonnement Oracle Content Management
• un compte Oracle Content Management doté du rôle Administrateur de contenu
• un ordinateur Windows ou Mac avec outil Android configuré
• connaissances existantes sur la programmation Java et Android car ce tutoriel part du principe que vous connaissez déjà les concepts de développement Android courants utilisant Java

Ce que nous construisons

Notre galerie d'images comprendra plusieurs pages d'images de nourriture et de boissons disponibles dans un café.

Les catégories sont des noeuds enfant d'une taxonomie et peuvent être organisées en hiérarchies. Pour notre galerie d'images, nous voulons afficher toutes les catégories disponibles, quelle que soit l'organisation. Pour ce faire, nous devons d'abord trouver les taxonomies disponibles, que nous utilisons la classe GetTaxonomiesRequest de la bibliothèque Oracle Content Management pour configurer et effectuer la demande.

Remarque : l'implémentation de GetTaxonomiesRequest utilise la ressource d'API REST GET /published/api/v1.1/taxonomies.

Pour chaque taxonomie trouvée, nous obtenons son ensemble de catégories. Pour ce faire, utilisez la classe GetTaxonomyCategoriesRequest de la bibliothèque Oracle Content Management.

Remarque : l'implémentation de GetTaxonomyCategoriesRequest utilise l'API REST GET /published/api/v1.1/taxonomies/{id}/categories.

Pour chaque catégorie de taxonomie renvoyée, nous affichons un aperçu composé du nom de la catégorie, du nombre d'images dans la catégorie et des rendus miniatures pour les quatre premières images.

Remarque : en plus de publier les ressources numériques que nous voulons afficher, vous devez également publier les taxonomies sur le canal.

Pour continuer, vous devez disposer d'un abonnement actif à Oracle Content Management et être connecté avec le rôle Administrateur de contenu.

Etape 1 : Préparer Oracle Content Management

Ce tutoriel est basé sur l'hypothèse que vous avez créé votre référentiel de ressources et que vous disposez actuellement d'un modèle de contenu vide (c'est-à-dire qu'aucun type de contenu n'a été créé).

Si vous ne disposez pas encore d'une instance Oracle Content Management, reportez-vous au démarrage rapide pour savoir comment vous inscrire à Oracle Cloud, provisionner une instance Oracle Content Management et configurer Oracle Content Management en tant que CMS headless.

Pour ce tutoriel, vous devez créer un modèle de contenu de l'une des deux manières suivantes. Un pack de ressources téléchargeable est disponible pour remplir votre référentiel vide avec les types de contenu et le contenu associé, ou vous pouvez créer votre propre modèle de contenu et votre propre contenu.

Pour préparer Oracle Content Management :

1. Créez un canal et un référentiel de ressources.
2. Importer le pack de ressources d'échantillons Oracle Content Management
3. Charger vos propres ressources d'image
4. Créer des taxonomies et les lier à des ressources d'image

Création d'un canal et d'un référentiel de ressources

Vous devez d'abord créer un canal et un référentiel de ressources dans Oracle Content Management afin de pouvoir publier du contenu.

Pour créer un canal et un référentiel de ressources dans Oracle Content Management, procédez comme suit :

1. Connectez-vous à l'interface Web d'Oracle Content Management en tant qu'administrateur.

2. Choisissez Contenu dans le menu de navigation de gauche, puis choisissez Publier des canaux dans la liste de sélection de l'en-tête de page.

   

3. Dans l'angle supérieur droit, cliquez sur Créer pour créer un canal. Nommez le canal 'OCEImageGalleryChannel' dans le cadre de ce tutoriel et tenez l'accès public. Cliquez sur Save pour créer le canal.

   

4. Choisissez Contenu dans le menu de navigation de gauche, puis choisissez Référentiels dans la liste de sélection de l'en-tête de page.

   

5. Dans l'angle supérieur droit, cliquez sur Créer pour créer un référentiel de ressources. Nommez le référentiel de ressources 'OCEImageGalleryRepository' dans le cadre de ce tutoriel.

   

6. Dans le champ Canaux de publication, sélectionnez OCEImageGalleryChannel pour indiquer à Oracle Content Management que le contenu du référentiel OCEImageGalleryRepository peut être publié dans le canal OCEImageGalleryChannel. Lorsque vous avez terminé, cliquez sur Enregistrer.

   

Importer le pack de ressources d'échantillons Oracle Content Management

Vous pouvez télécharger un exemple de pack de ressources Oracle Content Management préconfiguré contenant tous les types de contenu et ressources requis pour ce tutoriel.

Vous pouvez télécharger une copie du contenu que nous utilisons dans ce tutoriel à partir du pack de ressources d'échantillons Oracle Content Management. Vous pourrez ainsi essayer les types de contenu et modifier leur contenu. Téléchargez l'archive du pack de ressources, OCESamplesAssetPack.zip, puis extrayez-la dans le répertoire de votre choix :

1. Téléchargez le pack de ressources Oracle Content Management Samples (OCESamplesAssetPack.zip) à partir de la page Téléchargements d'Oracle Content Management. Extrayez le fichier ZIP téléchargé vers un emplacement sur votre ordinateur. Après l'extraction, cet emplacement inclut un fichier nommé OCEImageGallery_data.zip.

2. Connectez-vous à l'interface Web d'Oracle Content Management en tant qu'administrateur.

3. Choisissez Contenu dans le menu de navigation de gauche, puis choisissez Référentiels dans la liste de sélection de l'en-tête de page. Sélectionnez à présent OCEImageGalleryRepository et cliquez sur le bouton Importer le contenu dans la barre d'actions supérieure.

   

4. Téléchargez OCEImageGallery_data.zip à partir de votre ordinateur local vers le dossier Documents.

   

5. Une fois téléchargé, sélectionnez OCEImageGallery_data.zip et cliquez sur OK pour importer le contenu dans votre référentiel de ressources.

   

6. Une fois le contenu importé, accédez à la page Ressources et ouvrez le référentiel OCEImageGalleryRepository. Vous verrez que toutes les images et tous les éléments de contenu associés ont été ajoutés au référentiel de ressources.

   

7. Cliquez sur Tout sélectionner en haut à gauche, puis sur Publier pour ajouter toutes les ressources importées au canal de publication que vous avez créé précédemment, OCEImageGalleryChannel.

   

8. Avant la publication, vous devez valider toutes les ressources. Ajoutez d'abord OCEImageGalleryChannel en tant que canal sélectionné, puis cliquez sur le bouton Valider.

   

9. Une fois les ressources validées, publiez toutes les ressources sur le canal sélectionné en cliquant sur le bouton Publier dans l'angle supérieur droit.

   

Une fois cette opération terminée, vous pouvez voir sur la page Ressources que toutes les ressources ont été publiées. (Vous pouvez indiquer l'icône située au-dessus du nom de la ressource.)

Après avoir importé le pack de ressources Echantillons Oracle Content Management, vous pouvez commencer à créer la galerie d'images dans Android Studio.

Charger vos propres ressources d'image

Pour ce tutoriel, nous utilisons un référentiel de ressources appelé 'OCEImageGalleryRepository' afin de créer la page d'accueil de notre site de galerie. Cette page d'accueil se compose du titre 'Galerie d'images' ainsi que des albums de collection d'images contenant des ressources d'images.

Pour ajouter des ressources d'image au référentiel de ressources de la galerie, procédez comme suit :

1. Connectez-vous à l'interface Web d'Oracle Content Management.

2. Cliquez sur Ressources dans le menu de navigation de gauche.

3. Ouvrez le référentiel OCEImageGalleryRepository.

4. Cliquez sur Ajouter dans l'angle supérieur droit de la page pour ajouter des ressources d'image au référentiel de ressources de la galerie.

   

5. Téléchargez vos propres ressources à partir de votre ordinateur local ou choisissez des ressources existantes déjà dans Oracle Content Management.

Créer des taxonomies et les lier à des ressources d'image

Vous devez créer une taxonomie dans Oracle Content Management, puis affecter des catégories aux ressources de votre référentiel.

Pour créer une taxonomie dans Oracle Content Management, procédez comme suit :

1. Connectez-vous à l'interface Web d'Oracle Content Management en tant qu'administrateur.

2. Choisissez Contenu dans le menu de navigation de gauche, puis choisissez Taxonomies dans la liste de sélection de l'en-tête de page.

   

3. Dans l'angle supérieur droit, cliquez sur Créer pour créer une taxonomie. Nommez le canal 'OCEImageGalleryTaxonomy' dans le cadre de ce tutoriel.

   

4. Cliquez sur Créer.

5. A présent, créez la taxonomie en ajoutant des catégories : Cliquez sur Ajouter une catégorie.

   

6. Nommez l'élément de catégorie parent "Food" et ajoutez les catégories enfant suivantes :

   • Petit-déjeuner
   • Dessert
   • Boissons
   • Sandwichs

   Cliquez sur Done en haut à droite de l'écran.

   

7. Sur la page Taxonomies, sélectionnez la taxonomie OCEImageGalleryTaxonomy et cliquez sur Promouvoir dans la barre d'actions pour la rendre disponible pour utilisation dans vos référentiels de ressources.

   

Ensuite, modifiez le référentiel OCEImageGalleryRepository afin d'activer la taxonomie OCEImageGalleryTaxonomy pour ce référentiel :

1. Connectez-vous à l'interface Web d'Oracle Content Management en tant qu'administrateur.

2. Choisissez Contenu dans le menu de navigation de gauche, puis choisissez Référentiels dans la liste de sélection de l'en-tête de page.

3. Sélectionnez et modifiez le référentiel OCEImageGalleryRepository.

4. Dans le champ Taxonomies, sélectionnez OCEImageGalleryTaxonomy afin de pouvoir affecter des catégories de cette taxonomie aux ressources du référentiel OCEImageGalleryRepository.

   

5. Cliquez sur Enregistrer.

Affectez ensuite des catégories de taxonomie à chacune des ressources d'image dans le référentiel OCEImageGalleryRepository :

1. Connectez-vous à l'interface Web d'Oracle Content Management.

2. Cliquez sur Ressources dans le menu de navigation de gauche.

3. Ouvrez le référentiel OCEImageGalleryRepository.

4. Sélectionnez des ressources d'image, cliquez sur Plus dans la barre d'actions, puis choisissez Catégories dans le menu.

   

5. Dans le panneau Catégories, cliquez sur Ajouter une catégorie. Recherchez le nom de la catégorie dans la barre de recherche ou sélectionnez une catégorie dans la structure hiérarchique de la taxonomie, puis cliquez sur Ajouter pour affecter la catégorie sélectionnée. Vous pouvez affecter plusieurs catégories à une immobilisation.

   

6. Une fois les taxonomies affectées à toutes les ressources d'image, sélectionnez toutes les ressources du référentiel et publiez-les sur le canal OCEImageGalleryChannel.

Etape 2 : Création de la galerie d'images dans Android Studio

Pour utiliser notre contenu Oracle Content Management dans l'application Android, nous pouvons utiliser l'exemple de galerie d'images Android, qui est disponible en tant que référentiel open source sur GitHub.

Remarque : n'oubliez pas que l'utilisation de l'exemple Android est facultative et que nous l'utilisons dans ce tutoriel pour vous lancer rapidement. Vous pouvez également créer votre propre application.

Pour construire la galerie d'images dans Android Studio :

1. Cloner l'exemple de référentiel, le kit SDK Android et publier le kit SDK localement
2. Ouvrir l'exemple Android dans Android Studio
3. Utiliser l'API REST Oracle Content Management pour extraire le contenu

Cloner l'exemple de référentiel, le kit SDK Android et publier le kit SDK en local

L'exemple de la galerie Android est disponible en tant que référentiel open source sur GitHub.

Vous devrez d'abord cloner l'échantillon de GitHub vers votre ordinateur local, ainsi que le SDK Android de GitHub si ce n'est pas déjà fait.

Une fois que vous disposez de votre exemple de code et du kit SDK, afin d'utiliser le kit SDK Android dans l'exemple de projet, vous devez créer et publier le kit SDK dans votre référentiel Maven local afin qu'il puisse être utilisé par l'exemple de projet. Ouvrez le projet SDK Android dans Android Studio et exécutez la tâche publishToMavenLocal pour créer et publier le kit SDK dans votre référentiel Maven local.

Ouvrir l'échantillon Android dans Android Studio

Comme avec n'importe quelle application Android, vous devrez l'importer dans Android Studio afin que vous puissiez la construire et l'exécuter à partir de là dans un émulateur ou un appareil Android. L'exemple de code est déjà préconfiguré avec le serveur et le canal de publication utilisés pour obtenir les données de l'application de galerie.

Utiliser l'API REST Oracle Content Management pour extraire le contenu

L'API REST pour Content Delivery permet d'accéder aux ressources publiées dans Oracle Content Management. Les ressources publiées incluent les éléments de contenu et les ressources numériques, ainsi que leur rendu. Nous pouvons désormais utiliser l'API REST pour Content Management pour extraire le contenu afin de le rendre dans notre application de galerie.

Le fichier src/.../samples/gallery/MainActivity.java comporte une fonction permettant de créer l'objet ContentDeliveryClient, qui est utilisé par les objets de demande pour appeler l'API REST. La fonction ci-dessous est une version simplifiée de la fonction de l'exemple d'application qui affiche les valeurs utilisées.

void createDeliveryClient() {

    // inti and customize the SDK settings
    ContentSettings contentSettings = new ContentSettings();
   
    // initialize the cache settings (optional configured via settings in sample)
    contentSettings.setCacheSettings(new CacheSettings(context.getCacheDir()));

    // set the host and channel token
    String channelToken = "e0b7b1e6421e78189345448deaddb091";
    String host = "https://headless.mycontentdemo.com";

    // create client API we'll use in request objects to make SDK calls
    deliveryClient = ContentSDK.createDeliveryClient(
            host, channelToken, contentSettings);
}

Demander des données de page d'accueil à l'aide du kit SDK Oracle Content

Remarque : la séquence d'appels de kit SDK pour la page d'accueil initiale se trouve dans GalleryHomePageRepository.java.

La page initiale nécessite plusieurs appels de données avant que la page puisse s'afficher correctement :

1. Tout d'abord, nous chargeons les taxonomies du jeton de canal précédemment fourni.
2. Pour chaque taxonomie renvoyée, nous obtenons toutes les catégories de cette taxonomie.
3. Pour chaque catégorie renvoyée, nous obtenons la liste des immobilisations de cette catégorie.
4. Les URL d'image pour les rendus moyens et miniatures de chaque catégorie sont téléchargées.

Le point d'entrée de l'extraction de données initiale est la méthode fetchHomePageData() dans GalleryHomePageRepository.java. Cette méthode exécute une série d'appels de kit SDK synchrones sur un thread distinct, puis renvoie le résultat de manière asynchrone via un callback.

Les données des taxonomies initiales sont extraites à l'aide de la classe GetTaxonomiesRequest et de la méthode fetch(), comme indiqué ci-dessous.

// create request to get list of taxonomies, limiting the number of results to 10 max
GetTaxonomiesRequest request = new GetTaxonomiesRequest(deliveryClient).limit(10);

// get the list of taxonomies synchronously 
ContentResponse<TaxonomyList> response = request.fetch();

Toutes les API utilisent le modèle de création d'un objet de demande avec l'objet ContentDeliveryClient en tant que paramètre.

La méthode de générateur limit(<value>) est disponible car GetTaxonomiesRequest étend la classe PaginatedListRequest commune utilisée pour toute demande qui obtient une liste de données.

Ici, nous utilisons request.fetch() car nous avons déjà créé un thread distinct pour effectuer plusieurs appels de kit SDK dans l'ordre. Dans une autre section, il existe un exemple d'utilisation d'un appel de kit SDK asynchrone.

Une fois notre demande terminée, nous allons récupérer un objet de type ContentResponse<TaxonomyList>. Si la valeur response.isSuccess() est True, la liste des taxonomies TaxonomyList provient de la méthode getResult().

Ensuite, nous devons obtenir une liste des catégories de taxonomie disponibles. Nous sommes toujours dans le thread distinct que nous avons créé pour les appels de kit SDK. L'appel suivant est donc également un appel synchrone pour obtenir la liste des catégories de taxonomie en fonction de l'ID de taxonomie.

// get list of taxonomy categories based on the taxonomy id
GetTaxonomyCategoriesRequest categoriesRequest = 
    new GetTaxonomyCategoriesRequest(deliveryClient, taxonomy.getId());

// get list synchronously
ContentResponse<TaxonomyCategoryList> response = categoriesRequest.fetch();

// get the list from the response (assuming successful)
TaxonomyCategoryList categoryList.getItems = response.getResult();

Pour chaque catégorie, nous devons suivre le même processus général pour obtenir la liste des immobilisations associées à la catégorie en effectuant une demande de recherche afin de trouver les immobilisations correspondantes pour l'ID de noeud de catégorie.

// go through each category to get list of assets for that category
for(TaxonomyCategory category : categoryList.getItems()) {

    // setup search request to match "Image" type and the category node id
    SearchAssetsRequest assetsRequest = new SearchAssetsRequest(deliveryClient)
            .type(AssetType.TYPE_ASSET_IMAGE)
            .taxonomyCategoryNodeId(category.getId());

    // synchronous request to get matching assets
    ContentResponse<AssetSearchResult> searchResponse = assetsRequest.fetch();

    // search result from the response
    AssetSearchResult searchResult = searchResponse.getResult();

    // get the list of digital assets
    List<DigitalAsset> digitalAssetList = searchResult.getDigitalAssets();

}

Enfin, pour chacun des quatre premiers actifs d'une catégorie, nous générerons l'URL pour télécharger le rendu moyen pour le rendu de grande taille d'image et de miniature pour les trois images plus petites.

L'URL peut être utilisée pour afficher l'image à l'aide de votre bibliothèque d'images Android préférée, mais l'exemple utilise la bibliothèque open source Glide commune.

// (the sample code verifies that there are at least 4 images in the list)
// get the medimum rendition image url for the first main image from the list.
String mainImageUrl = digitialAssetList.get(0).getRenditionUrl(RenditionType.Medium);

// example code using Glide to render the main image into an ImageView
Glide.with(context).load(mainImageUrl).into(mainImageView);

// get the thumbnail rendition for the other 3 images
String smallImageUrl1 = digitialAssetList.get(1).getRenditionUrl(RenditionType.Thumbnail);
String smallImageUrl2 = digitialAssetList.get(2).getRenditionUrl(RenditionType.Thumbnail);
String smallImageUrl3 = digitialAssetList.get(3).getRenditionUrl(RenditionType.Thumbnail);

// load small images using Glide, etc...

Obtenir la page de la galerie et l'aperçu d'image

La page contenant les aperçus de toutes les images de la catégorie utilise une demande asynchrone pour demander toutes les images qui correspondent à l'ID de noeud de catégorie.

L'appel asynchrone est effectué avec une méthode de rappel spécifiée pour la réponse comme indiqué ci-dessous. La version complète de ce code se trouve dans le fichier GalleryPhotosFragment.java.

public void fetchDigitalAssets() {

    // search for all matching image assets for the specific category node id
    SearchAssetsRequest assetsRequest = new SearchAssetsRequest(getDeliveryClient())
            .type(AssetType.TYPE_ASSET_IMAGE)
            .taxonomyCategoryNodeId(categoryNodeId);

    // fetch the results asynchronously and call the specified method when done
    assetsRequest.fetchAsync(this::showDigitalAssets);

}

public void showDigitalAssets(ContentResponse<AssetSearchResult> response) {
   // handle errors if response.isSuccess is false otherwise process results...
}

Lorsque vous cliquez sur une image spécifique, l'aperçu complet utilise le rendu natif du fichier.

Avec un objet digitalAsset, vous obtenez l'URL de rendu natif et effectuez un rendu dans Glide comme suit :

String fullSizeImageUrl = digitalAsset.getRenditionUrl(RenditionType.Native);

// example using Glide to render the main image into an ImageView
Glide.with(context).load(fullSizeImageUrl).into(fullSizeImageView);

Etape 3 : Exécution de votre application

Maintenant que nous avons créé notre application de galerie Android, nous devons la tester dans un émulateur mobile ou un appareil d'Android Studio afin que nous puissions déboguer tous les problèmes et prévisualiser l'application avant qu'elle ne soit mise en service.

Conclusion

Dans ce tutoriel, nous avons créé une application Android de galerie d'images, qui se trouve sur Github. Cette application utilise Oracle Content Management comme CMS headless. Après avoir configuré Oracle Content Management avec un canal de contenu publié pour le tutoriel du site de la galerie, nous avons exécuté l'application pour extraire le contenu requis.

Découvrez les principaux concepts d'Oracle Content Management dans la documentation.

Vous trouverez d'autres exemples de ce type sur la page Exemples d'Oracle Content Management dans Oracle Help Center.

---

Informations relatives au titre et au copyright

Création d'une galerie d'images dans Java pour Android avec une instance Oracle Content Management headless

F81109-01

Mai 2023

Copyright © 2021, 2023, Oracle and/or its affiliates.

Auteur principal : Oracle Corporation