Adicionar sincronização de dados offline ao seu aplicativo Xamarin.Forms

Este tutorial aborda o recurso de sincronização offline dos Aplicativos Móveis do Azure para Xamarin Forms. A sincronização offline permite que os usuários finais interajam com um aplicativo móvel, visualizando, adicionando ou modificando dados, mesmo quando não há conexão de rede. As alterações são armazenadas em um banco de dados local. Quando o dispositivo estiver online novamente, essas alterações serão sincronizadas com o back-end remoto.

Antes de iniciar este tutorial, você deve ter concluído o Tutorial de início rápido do Xamarin.Forms, que inclui a criação de um serviço de back-end adequado.

Para saber mais sobre o recurso de sincronização offline, consulte o tópico Sincronização de Dados Offline em Aplicativos Móveis do Azure.

Atualizar a aplicação para suportar a sincronização offline

Na operação on-line, você lê e escreve a partir de um IRemoteTable<T>arquivo . Ao usar a sincronização offline, você lê e grava a partir de um IOfflineTable<T> em vez disso. O IOfflineTable é apoiado por um banco de dados SQLite no dispositivo e sincronizado com o banco de dados back-end.

No Visual Studio:

  1. Clique com o botão direito do TodoApp mouse na solução e selecione Gerenciar pacotes NuGet para solução....

  2. No novo separador, selecione Procurar e, em seguida, introduza Microsoft.Datasync.Client na caixa de pesquisa.

    Screenshot of adding the offline NuGet in Visual Studio.

  3. Selecione o Microsoft.Datasync.Client.SQLiteStore pacote.

  4. No painel direito, selecione todos os projetos cliente (exceto o TodoAppService.NET6 projeto).

  5. Selecione Instalar.

  6. Aceite o contrato de licença quando solicitado.

Atualizar o cliente de serviço remoto

Abra o TodoApp.Data projeto e localize a RemoteTodoService.cs classe (dentro do Services diretório). Atualize a classe da seguinte forma:

  1. Adicione a seguinte using instrução à parte superior do arquivo:

    using Microsoft.Datasync.Client.SQLiteStore;
    
  2. Altere a definição de _table para ser um IOfflineTable<TodoItem>:

    /// <summary>
    /// Reference to the table used for datasync operations.
    /// </summary>
    private IOfflineTable<TodoItem> _table = null;
    
  3. Adicione uma nova propriedade para armazenar o local do banco de dados offline:

    /// <summary>
    /// The path to the offline database
    /// </summary>
    public string OfflineDb { get; set; }
    
  4. Atualize o método para definir o InitializeAsync banco de dados offline:

    // Create the offline store definition
    var connectionString = new UriBuilder { Scheme = "file", Path = OfflineDb, Query = "?mode=rwc" }.Uri.ToString();
    var store = new OfflineSQLiteStore(connectionString);
    store.DefineTable<TodoItem>();
    var options = new DatasyncClientOptions
    {
        OfflineStore = store,
        HttpPipeline = new HttpMessageHandler[] { new LoggingHandler() }
    };
    
    // Create the datasync client.
    _client = TokenRequestor == null 
        ? new DatasyncClient(Constants.ServiceUri, options)
        : new DatasyncClient(Constants.ServiceUri, new GenericAuthenticationProvider(TokenRequestor), options);
    
    // Initialize the database
    await _client.InitializeOfflineStoreAsync();
    
    // Get a reference to the offline table.
    _table = _client.GetOfflineTable<TodoItem>();
    
    // Set _initialized to true to prevent duplication of locking.
    _initialized = true;
    
  5. Atualize o RefreshItemsAsync() para fazer a sincronização offline:

    /// <summary>
    /// Refreshes the TodoItems list manually.
    /// </summary>
    /// <returns>A task that completes when the refresh is done.</returns>
    public async Task RefreshItemsAsync()
    {
        await InitializeAsync();
    
        // First, push all the items in the table.
        await _table.PushItemsAsync();
    
        // Then, pull all the items in the table.
        await _table.PullItemsAsync();
    
        return;
    }
    

Definir o local do banco de dados offline

No projeto, edite o TodoApp.FormsApp.xaml.cs arquivo. Altere a definição da RemoteTodoService seguinte forma:

TodoService = new RemoteTodoService(async () => await GetAuthenticationToken())
{
    OfflineDb = Xamarin.Essentials.FileSystem.AppDataDirectory + "/offline.db"
};

Se você não concluiu o tutorial de autenticação, a definição deve ter esta aparência:

TodoService = new RemoteTodoService()
{
    OfflineDb = Xamarin.Essentials.FileSystem.AppDataDirectory + "/offline.db"
};

Testar a aplicação

O aplicativo não sincroniza com o back-end até que o ícone de atualização seja pressionado. Para testar:

  1. Abra o portal do Azure.

  2. Abra o grupo de recursos que contém os recursos para o início rápido.

  3. Selecione o quickstart banco de dados.

  4. Selecione o Editor de consultas (visualização).

  5. Faça logon com a autenticação do SQL Server usando as mesmas credenciais que você configurou para o banco de dados.

    • Se necessário, ser-lhe-á pedido que permita o acesso ao seu endereço IP. Selecione o link para atualizar a lista de permissões e pressione OK para repetir o login.
  6. No editor de consultas, digite SELECT * FROM [dbo].[TodoItems]. Em seguida, selecione Executar.

Uma lista dos TodoItems atuais será exibida.

Screenshot of the results in the S Q L query editor.

Agora, faça algumas alterações através do seu aplicativo. NÃO PRESSIONE REFRESH (ainda).

Repita a instrução SQL no portal do Azure e verifique se nenhuma alteração foi feita nos dados no banco de dados.

Selecione o ícone Atualizar em seu aplicativo para enviar os dados na fila para o serviço de back-end. Você verá as transações HTTP acontecendo na janela Depuração de saída.

Repita a instrução SQL no portal do Azure e verifique se as alterações foram enviadas por push para o serviço remoto.

Clean up resources (Limpar recursos)

A menos que você esteja fazendo outro tutorial de início rápido, você pode excluir os recursos associados ao serviço de back-end agora.

  1. Abra o portal do Azure.
  2. Selecione o grupo de recursos que contém os recursos de início rápido.
  3. Selecione Eliminar grupo de recursos.
  4. Siga as instruções para confirmar a exclusão.

Você também pode usar a CLI do Azure:

az group delete -g quickstart

Se você usou a CLI do Desenvolvedor do Azure para implantar recursos, poderá usar o azd down comando.

A exclusão levará alguns minutos para ser concluída.

Próximos passos