CODEWITHSUNDEEP
c#.netdatabasemobilemaui
João Vitor Delaia
João Vitor Delaia

Reputation: 1

How to display database records in .NET MAUI on the user interface?

I'm new to MAUI and I'm having a question about how to display database records in the app.

For example, suppose a user has a goal to achieve. The system should fill the labels, the progress bar and other screen elements with the data from the database record. If the user has more goals, the system should create new rows on the screen to display those records.

In Forms, this type of behavior is implemented using the UserControl. However, Maui does not have UserControl.

How can I implement this behavior in MAUI?

Exemple on figma

Below is a method (just for exemple) that retrieves and lists projects from a database based on the user ID and project status. I made it for Windows Forms but how can I do this with MAUI?

public void ListProjects()
{

    // Creating a new SQL connection using the provided connection string
    objconexao = new SqlConnection(strConexao);

    // Creating a new SQL command
    SqlCommand cmd = new SqlCommand();
    
    // Setting the connection for the command
    cmd.Connection = objconexao;

    // Setting the SQL command text to select project information based on user ID and status
    cmd.CommandText = "SELECT idProjeto, descricao FROM tblProjeto WHERE idUsuario = @idUser AND situacao = 1";

    // Adding a parameter to the SQL command for the user ID
    cmd.Parameters.AddWithValue("idUser", idUsuario);

    // Opening the database connection
    objconexao.Open();

    // Executing the SQL command and retrieving the result set
    SqlDataReader registrosProjetos = cmd.ExecuteReader();

    // Clearing the controls in a flow layout panel (flpProjetos)
    flpProjetos.Controls.Clear();

    // Iterating through the result set
    ucProjetos ListaProjeto;
    while (registrosProjetos.Read())
    {
        // Creating a new user control for each project
        ListaProjeto = new ucProjetos();

        // Setting the ID and description of the project from the result set
        ListaProjeto.Id = Convert.ToInt32(registrosProjetos["idProjeto"]);
        ListaProjeto.Descricao = registrosProjetos["descricao"].ToString();

        // Adding the user control to the flow layout panel
        flpProjetos.Controls.Add(ListaProjeto);
    }
    
    // Closing the database connection
    objconexao.Close();
}

Upvotes: 0

Views: 1715

Answers (1)

Jessie Zhang -MSFT
Jessie Zhang -MSFT

Reputation: 13803

It is recommended that you take a look at the following document first：

.NET MAUI local databases.

The SQLite database engine allows .NET Multi-platform App UI (.NET MAUI) apps to load and save data objects in shared code. You can integrate SQLite.NET into .NET MAUI apps, to store and retrieve information in a local database.

You can also check the official sample here: .NET MAUI - Local Database with SQLite.

And if your database is on a server, you can Consume a REST-based web service or Connect to local web services to achieve this.

Upvotes: 0

Related Questions