Creare una galleria di immagini in Java per Android con Oracle Content Management headless

Introduzione

L'ambiente di sviluppo Android che utilizza Java o Kotlin può essere un potente strumento per creare applicazioni che utilizzano contenuti da Oracle Content Management. Armati del giusto modello di contenuto, è possibile creare rapidamente l'interfaccia utente Android che costituisce una tipica galleria di immagini.

In questa esercitazione, creeremo una semplice applicazione galleria di immagini per Android utilizzando Java sfruttando Oracle Content Management come CMS headless. Questo esempio per Android è disponibile su GitHub. L'esercitazione prevede tre passi:

  1. Preparare Oracle Content Management
  2. Creare la Galleria delle immagini in Android Studio
  3. Esecuzione dell'applicazione

Prerequisiti

Prima di procedere con questa esercitazione, si consiglia di leggere le seguenti informazioni:

Per seguire questa esercitazione, è necessario:

Quello che stiamo costruendo

La nostra galleria di immagini sarà composta da diverse pagine di immagini di cibo e bevande disponibili in una caffetteria.

Questa immagine mostra la demo della galleria, perforando nella categoria di alimenti per la colazione con diversi tipi di bagel, alcuni con crema o condimenti, o entrambi.

Le categorie sono nodi figlio di una tassonomia e possono essere organizzate in gerarchie. Per la nostra galleria di immagini, vogliamo mostrare tutte le categorie disponibili indipendentemente dall'organizzazione. A tale scopo, è innanzitutto necessario trovare le tassonomie disponibili, che utilizzano la classe GetTaxonomiesRequest della libreria di Oracle Content Management per impostare ed effettuare la richiesta.

Nota: l'implementazione di GetTaxonomiesRequest utilizza la risorsa API REST GET /published/api/v1.1/taxonomies.

Per ogni tassonomia trovata, viene visualizzato il relativo set di categorie. Questa operazione viene eseguita utilizzando la classe GetTaxonomyCategoriesRequest della libreria di Oracle Content Management.

Nota: l'implementazione di GetTaxonomyCategoriesRequest utilizza l'API REST GET /published/api/v1.1/taxonomies/{id}/categories.

Per ogni categoria di tassonomia restituita viene visualizzata un'anteprima costituita dal nome della categoria, dal numero di immagini nella categoria e dalle rendition di anteprima per le prime quattro immagini.

Questa immagine mostra le immagini nella categoria Colazione.

Nota: oltre a pubblicare gli asset digitali che si desidera visualizzare, è necessario pubblicare anche le tassonomie nel canale.

Per continuare, sarà necessario disporre di una sottoscrizione attiva a Oracle Content Management e accedere con il ruolo Amministratore contenuto.

Passo 1: Preparare Oracle Content Management

Questa esercitazione si basa sull'ipotesi di aver creato il repository degli asset e di disporre di un modello di contenuto vuoto, ovvero non è stato creato alcun tipo di contenuto.

Se non si dispone già di un'istanza di Oracle Content Management, vedere Avvio rapido per informazioni su come registrarsi per Oracle Cloud, eseguire il provisioning di un'istanza di Oracle Content Management e configurare Oracle Content Management come CMS headless.

Per questa esercitazione è necessario creare un modello di contenuto in due modi. È disponibile un packing di asset scaricabile che riempirà il repository vuoto con tipi di contenuto e contenuto associato oppure è possibile creare modelli di contenuto e contenuto personalizzati.

Per preparare Oracle Content Management:

  1. Creare un canale e un repository degli asset.
  2. Importa il pacchetto asset di campioni di Oracle Content Management
  3. Carica i tuoi asset immagine
  4. Crea tassonomie e collega a asset immagine

Creare un canale e un repository degli asset

È innanzitutto necessario creare un canale e un repository di asset in Oracle Content Management in modo da poter pubblicare il contenuto.

Per creare un canale e un repository di asset in Oracle Content Management, effettuare le operazioni riportate di seguito.

  1. Accedere all'interfaccia Web di Oracle Content Management come amministratore.

  2. Scegliere Contenuto nel menu di navigazione a sinistra, quindi scegliere Canali di pubblicazione dall'elenco di selezione nell'intestazione della pagina.

    Questa immagine mostra l'opzione Canali di pubblicazione selezionata nel menu a discesa nell'intestazione della pagina Contenuto.

  3. Nell'angolo in alto a destra fare clic su Crea per creare un nuovo canale. Assegnare un nome al canale 'OCEImageGalleryChannel' ai fini di questa esercitazione e mantenere pubblico l'accesso. Fare clic su Salva per creare il canale.

    Questa immagine mostra il pannello di definizione del canale di pubblicazione, con 'OCEImageGalleryChannel' nel campo del nome del canale.

  4. Scegliere Contenuto nel menu di navigazione a sinistra, quindi scegliere Repositori dall'elenco di selezione nell'intestazione della pagina.

    Questa immagine mostra l'opzione Repository selezionata nel menu a discesa nell'intestazione della pagina Contenuto.

  5. Nell'angolo in alto a destra fare clic su Crea per creare un nuovo repository di asset. Assegnare un nome al repository degli asset 'OCEImageGalleryRepository' ai fini di questa esercitazione.

    Questa immagine mostra il pannello di definizione del repository, con 'OCEImageGalleryRepository ' nel campo del nome del repository.

  6. Nel campo Canali di pubblicazione selezionare OCEImageGalleryChannel per indicare a Oracle Content Management che il contenuto del repository OCEImageGalleryRepository può essere pubblicato nel canale OCEImageGalleryChannel. Al termine, fare clic su Salva.

    Questa immagine mostra il pannello di definizione del repository, con 'OCEImageGalleryChannel' nel campo Canali di pubblicazione.

Importa il pacchetto asset di campioni di Oracle Content Management

È possibile scaricare un pacchetto di asset campione preconfigurato di Oracle Content Management contenente tutti i tipi di contenuto e gli asset richiesti per questa esercitazione.

È possibile caricare una copia del contenuto in questa esercitazione da Oracle Content Management Samples Asset Pack. In questo modo sarà possibile sperimentare i tipi di contenuto e modificare il contenuto. Scaricare l'archivio del package di asset, OCESamplesAssetPack.zip, quindi estrarlo in una directory a scelta:

  1. Scaricare Oracle Content Management Samples Asset Pack (OCESamplesAssetPack.zip) dalla pagina download di Oracle Content Management. Estrarre il file zip scaricato in una posizione sul computer. Dopo l'estrazione, questa posizione includerà un file denominato OCEImageGallery_data.zip.

  2. Accedere all'interfaccia Web di Oracle Content Management come amministratore.

  3. Scegliere Contenuto nel menu di navigazione a sinistra, quindi scegliere Repositori dall'elenco di selezione nell'intestazione della pagina. Selezionare OCEImageGalleryRepository e fare clic sul pulsante Importa contenuto nella barra delle azioni superiore.

    Questa immagine mostra la pagina Repository, con l'elemento OCEImageGalleryRepository selezionato.

  4. Caricare OCEImageGallery_data.zip dal computer locale nella cartella Documenti.

    Questa immagine mostra la schermata di conferma del caricamento per il file OCEImageGallery_data.zip.

  5. Dopo il caricamento, selezionare OCEImageGallery_data.zip e fare clic su OK per importare il contenuto nel repository degli asset.

    Questa immagine mostra il file OCEImageGallery_data.zip selezionato con il pulsante OK abilitato.

  6. Dopo aver importato correttamente il contenuto, passare alla pagina Asset e aprire il repository OCEImageGalleryRepository. Tutte le immagini e gli elementi di contenuto correlati sono stati aggiunti al repository degli asset.

    Questa immagine mostra il repository OCEGettingStartedRepository, con tutti gli asset appena importati.

  7. Fare clic su Seleziona tutto in alto a sinistra, quindi su Pubblica per aggiungere tutti gli asset importati al canale di pubblicazione creato in precedenza, OCEImageGalleryChannel.

    Questa immagine mostra il repository OCEImageGalleryRepository, con tutti gli asset selezionati e l'opzione Pubblica nella barra delle azioni visibile.

  8. Prima della pubblicazione, è necessario convalidare tutti gli asset. Aggiungere prima OCEImageGalleryChannel come canale selezionato, quindi fare clic sul pulsante Convalida.

    Questa immagine mostra la pagina Risultati della convalida, con il canale OCEImageGalleryChannel aggiunto nel campo Canali, tutti gli asset da convalidare e il pulsante Convalida abilitato.

  9. Dopo aver convalidato gli asset, pubblicare tutti gli asset nel canale selezionato facendo clic sul pulsante Pubblica nell'angolo superiore destro.

    Questa immagine mostra la pagina Risultati della convalida, con il canale OCEImageGalleryChannel aggiunto nel campo Canali, tutti gli asset convalidati e il pulsante Pubblica abilitato.

Al termine, è possibile visualizzare nella pagina Asset la pubblicazione di tutti gli asset. (È possibile indicare l'icona sopra il nome dell'asset).

Questa immagine mostra la pagina Asset, con tutti gli asset pubblicati.

Dopo aver importato Oracle Content Management Samples Asset Pack, è possibile avviare la creazione della galleria di immagini in Android Studio.

Carica i tuoi asset immagine

Per questa esercitazione viene utilizzato un repository di asset denominato 'OCEImageGalleryRepository' per creare la home page per il sito della galleria. Questa home page è costituita dal titolo 'Galleria immagini' nonché dagli album di raccolta immagini con asset immagine interni.

Questa immagine mostra la home page della galleria di immagini, con immagini di varie categorie di immagini: panini, bevande, dessert, colazione e cibo.

Per aggiungere asset immagine al repository di asset galleria, procedere come segue.

  1. Accedere all'interfaccia Web di Oracle Content Management.

  2. Fare clic su Asset nel menu di navigazione a sinistra.

  3. Aprire il repository OCEImageGalleryRepository.

  4. Fare clic su Aggiungi nell'angolo superiore destro della pagina per aggiungere asset immagine al repository degli asset della galleria.

    Questa immagine mostra la pagina Asset con il contenuto e il menu a discesa Aggiungi aperto, con due opzioni: Aggiungi da documenti e Aggiungi da questo computer.

  5. Caricare nuovi asset dal computer locale oppure scegliere asset esistenti già in Oracle Content Management.

È necessario creare una tassonomia in Oracle Content Management, quindi assegnare le categorie agli asset nel repository.

Per creare una tassonomia in Oracle Content Management, effettuare le operazioni riportate di seguito.

  1. Accedere all'interfaccia Web di Oracle Content Management come amministratore.

  2. Scegliere Contenuto nel menu di navigazione a sinistra, quindi scegliere Tassonomie dall'elenco di selezione nell'intestazione della pagina.

    Questa immagine mostra l'opzione Tassonomie selezionata nel menu a discesa nell'intestazione della pagina Contenuto.

  3. Nell'angolo superiore destro fare clic su Crea per creare una nuova tassonomia. Assegnare un nome al canale 'OCEImageGalleryTaxonomy' ai fini di questa esercitazione.

    Questa immagine mostra il pannello di definizione della tassonomia, con 'OCEImageGalleryTaxonomy' nel campo del nome della tassonomia.

  4. Fare clic su Crea.

  5. A questo punto, creare la tassonomia aggiungendo le categorie. Fare clic su Aggiungi una categoria.

    Questa immagine mostra la pagina Aggiungi categoria per la tassonomia 'OCEImageGalleryTaxonomy'.

  6. Assegnare un nome all'elemento della categoria padre 'Alimenti' e aggiungere le seguenti categorie figlio:

    • Colazione
    • Dessert
    • Beve
    • Panini

    Fare clic su Done nella parte superiore destra della schermata.

    Questa immagine mostra la pagina di definizione della categoria, con 'Cibo' come categoria padre e queste categorie figlio: Colazione, Dessert, Bevande e Sandwich.

  7. Nella pagina Tassonomie selezionare la tassonomia OCEImageGalleryTaxonomy e fare clic su Promuovi nella barra delle azioni per renderla disponibile per l'uso nei repository di asset.

    Questa immagine mostra la tassonomia OCEImageGalleryTaxonomy selezionata nell'elenco, con l'opzione Promuovi nella barra delle azioni visibile.

Quindi, modificare il repository OCEImageGalleryRepository per abilitare la tassonomia OCEImageGalleryTaxonomy per tale repository:

  1. Accedere all'interfaccia Web di Oracle Content Management come amministratore.

  2. Scegliere Contenuto nel menu di navigazione a sinistra, quindi scegliere Repositori dall'elenco di selezione nell'intestazione della pagina.

  3. Selezionare e modificare il repository OCEImageGalleryRepository.

  4. Nel campo Tassonomie selezionare OCEImageGalleryTaxonomy, in modo da poter assegnare le categorie di tale tassonomia agli asset del repository OCEImageGalleryRepository.

    Questa immagine mostra il pannello di definizione del repository, con 'OCEImageGalleryTaxonomy' nel campo Tassonomie.

  5. Fare clic su Salva.

Assegnare quindi le categorie della tassonomia a ogni asset immagine nel repository OCEImageGalleryRepository:

  1. Accedere all'interfaccia Web di Oracle Content Management.

  2. Fare clic su Asset nel menu di navigazione a sinistra.

  3. Aprire il repository OCEImageGalleryRepository.

  4. Selezionare uno o più asset immagine, fare clic su Altro nella barra delle azioni, quindi scegliere Categorie dal menu.

    Questa immagine mostra un asset selezionato nel repository OCEImageGalleryRepository, con il menu di selezione Altro visualizzato (inclusa l'opzione Categorie).

  5. Nel pannello Categorie, fare clic su Aggiungi categoria. Cercare il nome della categoria nella barra di ricerca o selezionare una categoria dalla struttura gerarchica della tassonomia, quindi fare clic su Aggiungi per assegnare la categoria selezionata. È possibile assegnare più categorie a un cespite.

    Questa immagine mostra il pannello Categorie per un asset, con la barra di ricerca delle categorie e la struttura gerarchica della tassonomia 'Cibo'.

  6. Al termine dell'assegnazione delle tassonomie a tutti gli asset immagine, selezionare tutti gli asset nel repository e pubblicarli nel canale OCEImageGalleryChannel.

Per utilizzare i contenuti di Oracle Content Management nell'applicazione Android, è possibile utilizzare l'esempio della galleria di immagini Android, disponibile come repository open source in GitHub.

Nota: l'uso dell'esempio di Android è facoltativo e viene utilizzato in questa esercitazione per iniziare rapidamente. Inoltre, puoi creare la tua applicazione.

Per creare la galleria di immagini in Android Studio:

  1. Duplicare il repository di esempio, Android SDK e pubblicare il kit SDK in locale
  2. Apri il campione Android in Android Studio
  3. Utilizzare l'interfaccia API REST di Oracle Content Management per recuperare il contenuto

Duplicare il repository di esempio, l'SDK Android e pubblicare l'SDK in locale

L'esempio della galleria Android è disponibile come repository open source in GitHub.

Sarà innanzitutto necessario duplicare l'esempio da GitHub al computer locale, nonché l'SDK Android da GitHub, se non lo si è già fatto.

Una volta ottenuto il codice di esempio e l'SDK, per poter utilizzare l'SDK Android nel progetto di esempio, è necessario creare e pubblicare l'SDK nel repository Maven locale in modo che possa essere utilizzato dal progetto di esempio. Aprire il progetto SDK Android in Android Studio ed eseguire il task publishToMavenLocal per creare e pubblicare l'SDK nel repository Maven locale.

Apri il campione Android in Android Studio

Come per qualsiasi applicazione Android, dovrai importarla in Android Studio in modo da poterlo creare ed eseguire da lì in un emulatore o dispositivo Android. Il codice di esempio è già preconfigurato con il server e il canale di pubblicazione utilizzati per ottenere i dati per l'applicazione galleria.

Utilizzare l'interfaccia API REST di Oracle Content Management per recuperare il contenuto

L'API REST per la consegna del contenuto fornisce l'accesso agli asset pubblicati in Oracle Content Management. Gli asset pubblicati includono gli elementi di contenuto e gli asset digitali, nonché le relative rendition. Ora possiamo utilizzare l'API REST per la gestione dei contenuti per recuperare i contenuti in modo da renderli visibili nella nostra applicazione galleria.

Il file src/.../samples/gallery/MainActivity.java dispone di una funzione per la creazione dell'oggetto ContentDeliveryClient, utilizzato dagli oggetti della richiesta per effettuare chiamate all'API REST. La funzione riportata di seguito è una versione semplificata della funzione dall'applicazione di esempio che mostra i valori utilizzati.

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);
}

Richiedi dati home page mediante Oracle Content SDK

Nota: la sequenza di chiamate SDK per la home page iniziale si trova in GalleryHomePageRepository.java.

La pagina iniziale richiede diverse chiamate dati prima che la pagina possa essere visualizzata correttamente:

  1. In primo luogo, vengono caricate le tassonomie per il token canale fornito in precedenza.
  2. Per ogni tassonomia restituita, vengono visualizzate tutte le categorie nella tassonomia.
  3. Per ogni categoria restituita, viene visualizzato l'elenco degli asset in tale categoria.
  4. Vengono scaricati gli URL immagine per le rendition di media e miniatura per i primi quattro elementi di ogni categoria.

Questa immagine mostra l'elenco delle categorie di tassonomia con le anteprime dei primi 4 asset in ogni categoria.

Il punto di accesso per il recupero dati iniziale è il metodo fetchHomePageData() in GalleryHomePageRepository.java. Questo metodo eseguirà una serie di chiamate SDK sincrone su un thread separato e poi restituirà il risultato in modo asincrono tramite un callback.

I dati delle tassonomie iniziali vengono recuperati utilizzando la classe GetTaxonomiesRequest e il metodo fetch() come mostrato di seguito.

// 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();

Tutte le API utilizzano il pattern di creazione di un oggetto di richiesta con l'oggetto ContentDeliveryClient come parametro.

Il metodo di creazione limit(<value>) è disponibile perché GetTaxonomiesRequest estende la classe PaginatedListRequest comune utilizzata per qualsiasi richiesta che ottiene una lista di dati.

Qui utilizziamo request.fetch() perché abbiamo già creato un thread separato per effettuare più chiamate SDK in sequenza. In un'altra sezione c'è un esempio di utilizzo di una chiamata SDK asincrona.

Una volta completata la richiesta, verrà restituito un oggetto di tipo ContentResponse<TaxonomyList>. Se response.isSuccess() è vero, l'elenco delle tassonomie TaxonomyList proviene dal metodo getResult().

Successivamente, è necessario ottenere un elenco delle categorie di tassonomia disponibili. Siamo ancora nel thread separato creato per le chiamate SDK, quindi la chiamata successiva è anche una chiamata sincrona per ottenere l'elenco delle categorie di tassonomia in base all'ID della tassonomia.

// 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();

Per ogni categoria, è necessario seguire lo stesso processo generale per ottenere l'elenco degli asset associati alla categoria effettuando una richiesta di ricerca per trovare gli asset corrispondenti per l'ID nodo categoria.

// 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();

}

Infine, per ciascuno dei primi quattro asset di una categoria, genereremo l'URL per scaricare la copia trasformata media per l'immagine di grandi dimensioni e la copia di anteprima per le tre immagini più piccole.

L'URL può essere utilizzato per eseguire il rendering dell'immagine utilizzando la libreria di immagini Android preferita, ma il campione utilizza la libreria open source comune Glide.

// (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...

Recupera anteprima pagina Galleria e immagine

La pagina contenente le anteprime di tutte le immagini nella categoria utilizza una richiesta asincrona per richiedere tutte le immagini che corrispondono all'ID nodo categoria.

Questa immagine mostra una galleria di immagini con diversi tipi di bagel, alcuni con crema o condimenti, o entrambi.

La chiamata asincrona viene eseguita con un metodo di callback specificato per la risposta, come mostrato di seguito. La versione completa di questo codice è nel file 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...
}

Quando si fa clic su un'immagine specifica, l'anteprima di tutte le dimensioni utilizza la rendition nativa del file.

Questa immagine mostra l'anteprima di un bagel con crema di formaggio e salmone.

Dato un oggetto digitalAsset, si ottiene l'URL di rendition nativo e si effettua il rendering in Glide come questo:

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

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

Passo 3: esecuzione dell'applicazione

Ora che abbiamo costruito la nostra applicazione galleria Android, dobbiamo testarla in un emulatore mobile o dispositivo da Android Studio in modo da poter eseguire il debug di qualsiasi problema e visualizzare in anteprima l'applicazione prima che diventi attiva.

Conclusione

In questa esercitazione è stata creata un'applicazione Android per la galleria di immagini, che è possibile reperire in Github. Questa applicazione utilizza Oracle Content Management come CMS headless. Dopo aver impostato e configurato Oracle Content Management con un canale di contenuto pubblicato per l'esercitazione sul sito della galleria, l'applicazione è stata eseguita per recuperare il contenuto richiesto.

Scopri i concetti importanti di Oracle Content Management nella documentazione.

Nella pagina Esempi di Oracle Content Management di Oracle Help Center è possibile trovare altri esempi come questo.