Criar uma Galeria de Imagens no Java para Android com o Oracle Content Management sem Interface do Usuário

Introdução

O ambiente de desenvolvimento Android que usa Java ou Kotlin pode ser uma ferramenta avançada para criar aplicativos que consomem conteúdo do Oracle Content Management. Armado com o modelo de conteúdo certo, você pode criar rapidamente a interface do usuário do Android que compõe uma galeria de imagens típica.

Neste tutorial, vamos criar um aplicativo de galeria de imagens simples para Android usando Java, aproveitando o Oracle Content Management como um CMS headless. Esta amostra do Android está disponível em GitHub. O tutorial consiste de três etapas:

1. Preparar o Oracle Content Management
2. Criar a Galeria de Imagens no Android Studio
3. Executar Seu Aplicativo

Pré-requisitos

Antes de prosseguir com este tutorial, recomendamos que você leia as seguintes informações primeiro:

• Conceitos-Chave
• Repositórios de Ativos
• Taxonomias

Para seguir este tutorial, você precisará:

• uma assinatura do Oracle Content Management
• uma conta do Oracle Content Management com a atribuição de Administrador de Conteúdo
• um computador Windows ou Mac com ferramentas Android configuradas
• conhecimento existente da programação Java e Android, pois este tutorial pressupõe que você já esteja familiarizado com conceitos comuns de desenvolvimento Android usando Java

O que estamos construindo

Nossa galeria de imagens consistirá de várias páginas de imagens de alimentos e bebidas disponíveis em uma cafeteria.

As categorias são nós filhos de uma taxonomia e podem ser organizadas em hierarquias. Para nossa galeria de imagens, queremos mostrar todas as categorias disponíveis, independentemente da organização. Para fazer isso, primeiro precisamos encontrar as taxonomias disponíveis, que usamos a classe GetTaxonomiesRequest da biblioteca do Oracle Content Management para configurar e fazer a solicitação.

Observação: A implementação de GetTaxonomiesRequest usa o recurso de API REST GET /published/api/v1.1/taxonomies.

Para cada taxonomia encontrada, obtemos seu conjunto de categorias. Isso é feito usando a classe GetTaxonomyCategoriesRequest da biblioteca do Oracle Content Management.

Observação: A implementação de GetTaxonomyCategoriesRequest usa a API REST GET /published/api/v1.1/taxonomies/{id}/categories.

Para cada categoria de taxonomia retornada, exibimos uma visualização que consiste no nome da categoria, no número de imagens na categoria e nas renderizações em miniatura das quatro primeiras imagens.

Observação: Além de publicar os ativos digitais que queremos exibir, você também precisa publicar as taxonomias no canal.

Para continuar, você precisará ter uma assinatura ativa no Oracle Content Management e estar conectado com a atribuição de Administrador de Conteúdo.

Etapa 1: Preparar o Oracle Content Management

Este tutorial é baseado na suposição de que você criou seu repositório de ativos e atualmente tem um modelo de conteúdo vazio (ou seja, nenhum tipo de conteúdo criado).

Se você ainda não tiver uma instância do Oracle Content Management, consulte o Início Rápido para saber como se registrar no Oracle Cloud, provisionar uma instância do Oracle Content Management e configurar o Oracle Content Management como um CMS headless.

Para este tutorial, você precisará criar um modelo de conteúdo de duas maneiras. Há um pacote de ativos de download disponível que preencherá seu repositório vazio com tipos de conteúdo e conteúdo associado ou você pode criar seu próprio modelo de conteúdo e conteúdo.

Para preparar o Oracle Content Management:

1. Crie um canal e um repositório de ativos.
2. Importar o Pacote de Ativos de Amostras do Oracle Content Management
3. Fazer Upload de Seus Próprios Ativos de Imagem
4. Criar Taxonomias e Vinculá-las a Ativos de Imagem

Crie um Canal e um Repositório de Ativos

Primeiro você precisa criar um canal e um repositório de ativos no Oracle Content Management para que possa publicar conteúdo.

Para criar um canal e um repositório de ativos no Oracle Content Management:

1. Faça log-in na interface web do Oracle Content Management como administrador.

2. Escolha Conteúdo no menu de navegação esquerdo e, em seguida, escolha Publicando Canais na lista de seleção no cabeçalho da página.

   

3. No canto superior direito, clique em Criar para criar um novo canal. Nomeie o canal 'OCEImageGalleryChannel' com a finalidade deste tutorial e mantenha o acesso público. Clique em Salvar para criar o canal.

   

4. Escolha Conteúdo no menu de navegação esquerdo e, em seguida, escolha Repositórios na lista de seleção no cabeçalho da página.

   

5. No canto superior direito, clique em Criar para criar um novo repositório de ativos. Nomeie o repositório de ativos 'OCEImageGalleryRepository' com a finalidade deste tutorial.

   

6. No campo Canais de Publicação, selecione OCEImageGalleryChannel para indicar ao Oracle Content Management que o conteúdo no repositório OCEImageGalleryRepository pode ser publicado no canal OCEImageGalleryChannel. Clique em Salvar quando terminar.

   

Importar o Pacote de Ativos de Amostras do Oracle Content Management

Você pode fazer download de um pacote de ativos de amostra pré-configurado do Oracle Content Management que contém todos os tipos de conteúdo e ativos necessários para este tutorial.

Você pode fazer upload de uma cópia do conteúdo que estamos usando neste tutorial do Pacote de Ativos de Amostras do Oracle Content Management. Isso permitirá que você experimente os tipos de conteúdo e modifique o conteúdo. Faça download do arquivo compactado do pacote de ativos, OCESamplesAssetPack.zip, e extraia-o para um diretório de sua escolha:

1. Faça download do Pacote de Ativos de Amostras do Oracle Content Management (OCESamplesAssetPack.zip) na página downloads do Oracle Content Management. Extraia o arquivo zip baixado em um local no seu computador. Após a extração, esse local incluirá um arquivo chamado OCEImageGallery_data.zip.

2. Faça log-in na interface web do Oracle Content Management como administrador.

3. Escolha Conteúdo no menu de navegação esquerdo e, em seguida, escolha Repositórios na lista de seleção no cabeçalho da página. Agora selecione OCEImageGalleryRepository e clique no botão Importar Conteúdo na barra de ação superior.

   

4. Faça upload de OCEImageGallery_data.zip do seu computador local para a pasta Documentos.

   

5. Após o upload, selecione OCEImageGallery_data.zip e clique em OK para importar o conteúdo para o repositório de ativos.

   

6. Depois que o conteúdo tiver sido importado com sucesso, navegue até a página Ativos e abra o repositório OCEImageGalleryRepository. Você verá que todas as imagens e itens de conteúdo relacionados foram adicionados ao repositório de ativos.

   

7. Clique em Selecionar Tudo na parte superior esquerda e em Publicar para adicionar todos os ativos importados ao canal de publicação criado anteriormente, OCEImageGalleryChannel.

   

8. Antes da publicação, você precisa validar todos os ativos. Primeiro, adicione OCEImageGalleryChannel como um canal selecionado e clique no botão Validar.

   

9. Depois que os ativos tiverem sido validados, publique todos os ativos no canal selecionado clicando no botão Publicar no canto superior direito.

   

Quando terminar, você poderá ver na página Ativos que todos os ativos foram publicados. (Pode ser informado pelo ícone acima do nome do ativo.)

Depois de importar o Pacote de Ativos de Amostras do Oracle Content Management, você pode começar a criar a galeria de imagens no Android Studio.

Fazer Upload de Seus Próprios Ativos de Imagem

Para este tutorial, estamos usando um repositório de ativos chamado 'OCEImageGalleryRepository' para criar a home page de nosso site de galeria. Esta página inicial consiste no título 'Image Gallery' e também em álbuns de coleção de imagens que têm ativos de imagem dentro.

Para adicionar ativos de imagem ao repositório de ativos da galeria:

1. Faça log-in na interface web do Oracle Content Management.

2. Clique em Ativos no menu de navegação à esquerda.

3. Abra o repositório OCEImageGalleryRepository.

4. Clique em Adicionar no canto superior direito da página para adicionar ativos de imagem ao repositório de ativos da galeria.

   

5. Faça upload de seus próprios novos ativos no computador local ou escolha os ativos existentes já no Oracle Content Management.

Criar Taxonomias e Vinculá-las a Ativos de Imagem

Você precisa criar uma taxonomia no Oracle Content Management e depois designar categorias aos ativos do seu repositório.

Para criar uma taxonomia no Oracle Content Management:

1. Faça log-in na interface web do Oracle Content Management como administrador.

2. Escolha Conteúdo no menu de navegação esquerdo e escolha Taxonomias na lista de seleção no cabeçalho da página.

   

3. No canto superior direito, clique em Criar para criar uma nova taxonomia. Nomeie o canal 'OCEImageGalleryTaxonomy' com a finalidade deste tutorial.

   

4. Clique em Criar.

5. Agora, crie sua taxonomia adicionando categorias. Clique em Adicionar uma categoria.

   

6. Nomeie o item de categoria pai 'Alimentos' e adicione as seguintes categorias filho:

   • Pequeno-almoço
   • Sobremesa
   • Bebidas
   • Sanduíches

   Clique em Concluído no canto superior direito da tela.

   

7. Na página Taxonomias, selecione a taxonomia OCEImageGalleryTaxonomy e clique em Promover na barra de ações para disponibilizá-la para uso em seus repositórios de ativos.

   

Em seguida, edite o repositório OCEImageGalleryRepository para ativar a taxonomia OCEImageGalleryTaxonomy para esse repositório:

1. Faça log-in na interface web do Oracle Content Management como administrador.

2. Escolha Conteúdo no menu de navegação esquerdo e, em seguida, escolha Repositórios na lista de seleção no cabeçalho da página.

3. Selecione e edite o repositório OCEImageGalleryRepository.

4. No campo Taxonomias, selecione OCEImageGalleryTaxonomy para que você possa atribuir categorias dessa taxonomia aos ativos no repositório OCEImageGalleryRepository.

   

5. Clique em Salvar.

Em seguida, designe categorias de taxonomia a cada um dos ativos de imagem no repositório OCEImageGalleryRepository:

1. Faça log-in na interface web do Oracle Content Management.

2. Clique em Ativos no menu de navegação à esquerda.

3. Abra o repositório OCEImageGalleryRepository.

4. Selecione um ou mais ativos de imagem, clique em Mais na barra de ações e escolha Categorias no menu.

   

5. No painel Categorias, clique em Adicionar Categoria. Procure o nome da categoria na barra de pesquisa ou selecione uma categoria na estrutura hierárquica da taxonomia e clique em Adicionar para atribuir a categoria selecionada. É possível atribuir várias categorias a um ativo.

   

6. Depois de terminar de designar taxonomias a todos os ativos de imagem, selecione todos os ativos no repositório e publique-os no canal OCEImageGalleryChannel.

Etapa 2: Construa a Galeria de Imagens no Android Studio

Para consumir nosso conteúdo do Oracle Content Management no aplicativo Android, podemos usar a amostra da galeria de imagens do Android, que está disponível como um repositório de código-fonte aberto em GitHub.

Observação: Lembre-se de que o uso da amostra do Android é opcional e o usamos neste tutorial para começar rapidamente. Você também pode criar seu próprio aplicativo.

Para criar a galeria de imagens no Android Studio:

1. Clonar o repositório de amostra, o Android SDK e publicar o SDK localmente
2. Abrir a amostra do Android no Android Studio
3. Usar a API REST do Oracle Content Management para extrair conteúdo

Clonar o Repositório de Amostra, o SDK do Android e Publicar o SDK Localmente

A amostra da galeria do Android está disponível como um repositório de código-fonte aberto em GitHub.

Primeiro você precisará clonar a amostra de GitHub para seu computador local, bem como o Android SDK de GitHub, se ainda não tiver feito isso.

Assim que tiver seu código de amostra e o SDK, para consumir o SDK do Android no projeto de amostra, você deverá criar e publicar o SDK no seu repositório Maven local para que ele possa ser consumido pelo projeto de amostra. Abra o projeto Android SDK no Android Studio e execute a tarefa publishToMavenLocal para criar e publicar o SDK no seu repositório Maven local.

Abrir a amostra do Android no Android Studio

Como em qualquer aplicativo Android, você precisará importá-lo para o Android Studio para que possa criá-lo e executá-lo de lá em um emulador ou dispositivo Android. O código de amostra já é pré-configurado com o servidor e o canal de publicação que são usados para obter dados para o aplicativo da galeria.

Usar a API REST do Oracle Content Management para Extrair Conteúdo

A API REST para Content Delivery fornece acesso a ativos publicados no Oracle Content Management. Os ativos publicados incluem itens de conteúdo e ativos digitais, bem como suas renderizações. Agora podemos aproveitar a API REST para Gerenciamento de Conteúdo para extrair conteúdo para que possamos renderizá-lo em nosso aplicativo de galeria.

O arquivo src/.../samples/gallery/MainActivity.java tem uma função para criar o objeto ContentDeliveryClient, que é usado por objetos de solicitação para fazer chamadas à API REST. A função abaixo é uma versão simplificada da função do aplicativo de amostra que mostra os valores que estão sendo usados.

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

Solicitar Dados da Home Page Usando o Oracle Content SDK

Observação: A sequência de chamadas do SDK para a home page inicial está em GalleryHomePageRepository.java.

A página inicial requer várias chamadas de dados para que a página possa ser exibida corretamente:

1. Primeiro, carregamos as taxonomias do token de canal fornecido anteriormente.
2. Para cada taxonomia retornada, obtemos todas as categorias nessa taxonomia.
3. Para cada categoria devolvida, obtemos a lista de ativos nessa categoria.
4. Os URLs de imagem para renderizações média e em miniatura dos primeiros quatro itens de cada categoria são baixados.

O ponto de entrada para a extração de dados inicial é o método fetchHomePageData() em GalleryHomePageRepository.java. Este método executará uma série de chamadas SDK síncronas em um thread separado e, em seguida, retornará o resultado de forma assíncrona por meio de um callback.

Os dados de taxonomias iniciais são recuperados usando a classe GetTaxonomiesRequest e o método fetch(), conforme mostrado abaixo.

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

Observe que todas as APIs usam o padrão de criação de um objeto de solicitação com o objeto ContentDeliveryClient como parâmetro.

O método do construtor limit(<value>) está disponível porque GetTaxonomiesRequest estende a classe PaginatedListRequest comum usada para qualquer solicitação que obtenha uma lista de dados.

Aqui usamos request.fetch() porque já criamos um thread separado para fazer várias chamadas SDK em sequência. Em outra seção, há um exemplo de uso de uma chamada SDK assíncrona.

Depois que nossa solicitação for concluída com sucesso, obteremos de volta um objeto do tipo ContentResponse<TaxonomyList>. Se response.isSuccess() for verdadeiro, a lista de taxonomias TaxonomyList será proveniente do método getResult().

Em seguida, precisamos obter uma lista das categorias de taxonomia disponíveis. Ainda estamos no thread separado que criamos para chamadas SDK. Portanto, a próxima chamada também é síncrona para obter a lista de categorias de taxonomia com base no id da taxonomia.

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

Para cada categoria, precisamos seguir o mesmo processo geral para obter a lista de ativos associados à categoria fazendo uma solicitação de pesquisa para localizar ativos correspondentes para o id do nó da 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();

}

Por fim, para cada um dos primeiros quatro ativos de uma categoria, geraremos o URL para fazer download da renderização média para a renderização de imagem grande e miniatura das três imagens menores.

O URL pode ser usado para renderizar a imagem usando sua biblioteca de imagens Android preferida, mas a amostra usa o Glide de biblioteca de código-fonte aberto comum.

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

Obter Página da Galeria e Visualização da Imagem

A página que contém as visualizações de todas as imagens na categoria usa uma solicitação assíncrona para solicitar todas as imagens que correspondem ao id do nó da categoria.

A chamada assíncrona é feita com um método de callback especificado para a resposta, conforme mostrado abaixo. A versão completa desse código está no arquivo 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 você clica em uma imagem específica, a visualização de tamanho completo usa a renderização nativa do arquivo.

Dado um objeto digitalAsset, você obtém o URL de renderização nativo e o renderiza em Glide como este:

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

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

Etapa 3: Executando seu aplicativo

Agora que criamos nosso aplicativo de galeria Android, precisamos testá-lo em um emulador móvel ou dispositivo do Android Studio para que possamos depurar quaisquer problemas e visualizar o aplicativo antes que ele entre em operação.

Conclusão

Neste tutorial, criamos um aplicativo Android de galeria de imagens, que pode ser encontrado no Github. Este aplicativo usa o Oracle Content Management como um CMS headless. Depois de configurar e configurar o Oracle Content Management com um canal de conteúdo publicado para o tutorial do site da galeria, executamos o aplicativo para extrair o conteúdo necessário.

Saiba mais sobre conceitos importantes do Oracle Content Management na documentação.

Você pode encontrar mais amostras como essa na página Amostras do Oracle Content Management no Oracle Help Center.

---

Título e Informações de Copyright

Criar uma Galeria de Imagens no Java para Android com o Oracle Content Management sem Interface do Usuário

F81109-01

Maio de 2023

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

Autor Principal: Oracle Corporation