'How can display Picker item of firebase realtime using xamarain forms and add to firebase when select item

I want to display a picker items from firebase how can do this ?

<Picker x:Name="AppointmentPatientName" Title="Patient Name" >
            <Picker.Items>
                <x:String>Ahmad</x:String>
                <x:String>Ali</x:String>
                <x:String>Omar</x:String>
                <x:String>Alma</x:String>
                <x:String>Aya</x:String>
                <x:String>Ammar</x:String>
                <x:String>Noor</x:String>
            </Picker.Items>
        </Picker>

Solution 1:^[1]

When you want to display Picker item of firebase realtime using xamarin forms, get the items from firebase first and then binding the items to the picker.

Model:

public class Person
{
 public int PersonId { get; set; }
 public string Name { get; set; }
}

Get, add, delete items for firebase realtime database:

public class FirebaseHelper
 {
 FirebaseClient firebase = new FirebaseClient("https://fir-xxxxx-default-rtdb.firebaseio.com/");// the link you could get from your own firebase database. https://console.firebase.google.com/

 public async Task<List<Person>> GetAllPersons()
 {

     return (await firebase
       .Child("Persons")
       .OnceAsync<Person>()).Select(item => new Person
       {
           Name = item.Object.Name,
           PersonId = item.Object.PersonId
       }).ToList();
 }

 public async Task AddPerson(int personId, string name)
 {

     await firebase
       .Child("Persons")
       .PostAsync(new Person() { PersonId = personId, Name = name });
 }

 public async Task<Person> GetPerson(int personId)
 {
     var allPersons = await GetAllPersons();
     await firebase
       .Child("Persons")
       .OnceAsync<Person>();
     return allPersons.Where(a => a.PersonId == personId).FirstOrDefault();
 }

 public async Task UpdatePerson(int personId, string name)
 {
     var toUpdatePerson = (await firebase
       .Child("Persons")
       .OnceAsync<Person>()).Where(a => a.Object.PersonId == personId).FirstOrDefault();

     await firebase
       .Child("Persons")
       .Child(toUpdatePerson.Key)
       .PutAsync(new Person() { PersonId = personId, Name = name });
 }

 public async Task DeletePerson(int personId)
 {
     var toDeletePerson = (await firebase
       .Child("Persons")
       .OnceAsync<Person>()).Where(a => a.Object.PersonId == personId).FirstOrDefault();
     await firebase.Child("Persons").Child(toDeletePerson.Key).DeleteAsync();

 }
}

Binding for the Picker:

   <Picker ItemsSource="{Binding Names}"
                     ItemDisplayBinding="{Binding Name}" >

             </Picker>

When you want to add item to firebase when select item, get the selected item first and then add it.

Use the SelectedIndexChanged event to get the selected item. And then call the Add method of the FirebaseHelper.

void OnPickerSelectedIndexChanged(object sender, EventArgs e)
{
 var picker = (Picker)sender;
 int selectedIndex = picker.SelectedIndex;

 if (selectedIndex != -1)
 {
     selectedItem = (string)picker.ItemsSource[selectedIndex];
 }
}

Solution 2:^[2]

         MainPage.xaml 



            <Entry x:Name="TxtName" 
                   Placeholder="Name (Required)"/>
            
            <DatePicker x:Name="date"/>
            <Picker Title="Select a state"
                    x:Name="state"
                    TitleColor="Red">
                <Picker.Items>
                    <x:String>kerala</x:String>
                    <x:String>Pujab</x:String>
                </Picker.Items>
            </Picker>
            <StackLayout  HorizontalOptions="CenterAndExpand" Orientation="Horizontal">
                <Button x:Name="BtnAdd" WidthRequest="200" Text="Add" Clicked="BtnAdd_Clicked"/>
                <Button x:Name="BtnDelete" WidthRequest="200" Text="Delete" Clicked="BtnDelete_Clicked" />
            </StackLayout>

            <StackLayout HorizontalOptions="CenterAndExpand" Orientation="Horizontal">
                <Button x:Name="BtnUpdate" WidthRequest="200" Text="Update" Clicked="BtnUpdate_Clicked" />
            </StackLayout>

            <ListView x:Name="LstPersons" ItemSelected="LstPersons_OnItemSelected">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <TextCell Text="{Binding Name}"></TextCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

MainPage.xaml.cs

public partial class MainPage : ContentPage   
{         
    readonly FirebaseHelper firebaseHelper = new FirebaseHelper();

    public MainPage()
    {
        InitializeComponent();
    }


    protected override async void OnAppearing()
    {
        base.OnAppearing();

        await FetchAllPersons();
    }

    private async void BtnAdd_Clicked(object sender, EventArgs e)
    {
        if (!IsFormValid())
        {
            await DisplayAlert("Error", "All are required fields", "OK");
            return;
        }

        Person person = await firebaseHelper.GetPerson(TxtName.Text);

        if (person != null)
        {
            await DisplayAlert("Error", "A person with that name already exist", "OK");
            return;
        }

        await firebaseHelper.AddPerson(TxtName.Text,date.Date, (string)state.SelectedItem);

        TxtName.Text = string.Empty;           
        date.Date = DateTime.Now;
        state.SelectedItem = string.Empty;
       
        await DisplayAlert("Success", "Person Added Successfully", "OK");

        await FetchAllPersons();
    }

    private async void BtnUpdate_Clicked(object sender, EventArgs e)
    {
        if (SelectedPerson == null)
        {
            await DisplayAlert("Error", "A person must be selected to proceed", "OK");
            return;
        }
        
        if (!IsFormValid())
        {
            await DisplayAlert("Error", "All are required fields", "OK");
            return;
        }

        Person person = await firebaseHelper.GetPerson(TxtName.Text);

        if (person != null && person.PersonId != SelectedPerson.PersonId)
        {
            await DisplayAlert("Error", "A person with that name already exist", "OK");
            return;
        }

        await firebaseHelper.UpdatePerson(SelectedPerson.PersonId, TxtName.Text, date.Date, (string)state.SelectedItem);

        TxtName.Text = string.Empty;           
        date.Date = DateTime.Now;
        state.SelectedItem = string.Empty;
        await DisplayAlert("Success", "Person Updated Successfully", "OK");

        await FetchAllPersons();
    }

    private async void BtnDelete_Clicked(object sender, EventArgs e)
    {
        if (SelectedPerson == null)
        {
            await DisplayAlert("Error", "A person must be selected to proceed", "OK");
            return;
        }

        await firebaseHelper.DeletePerson(SelectedPerson.PersonId);

        await DisplayAlert("Success", "Person Deleted Successfully", "OK");

        await FetchAllPersons();
    }

    private async void LstPersons_OnItemSelected(object sender, SelectedItemChangedEventArgs e)
    {
        var person = await firebaseHelper.GetPerson(SelectedPerson.PersonId);

        TxtName.Text = person.Name;           
        date.Date = person.Date;
        state.SelectedItem = person.State;
    }

    private async Task FetchAllPersons()
    {
        var allPersons = await firebaseHelper.GetAllPersons();

        LstPersons.ItemsSource = allPersons;
    }

    private Person SelectedPerson => (Person)LstPersons.SelectedItem;

    private bool IsFormValid() => IsNameValid();

    private bool IsNameValid() => !string.IsNullOrWhiteSpace(TxtName.Text);
                  
}

Person.cs

public class Person
{
   
    public Guid PersonId { get; set; }
    public string Name { get; set; }      
    public DateTime Date { get; set; }
    public string State { get; set; }
}

FirebaseHelper.cs

public class FirebaseHelper

{
    
private readonly string ChildName = "Persons";

    readonly FirebaseClient firebase = new FirebaseClient("https://XXXXXXyour__db_urlXXXXX/");

    public async Task<List<Person>> GetAllPersons()
    {
        return (await firebase
            .Child(ChildName)
            .OnceAsync<Person>()).Select(item => new Person
            {
                PersonId = item.Object.PersonId,
                Name = item.Object.Name,                    
                Date = item.Object.Date,
                State = item.Object.State
            }).ToList();
    }

    public async Task AddPerson(string name,DateTime date, string state)
    {
        await firebase
            .Child(ChildName)
            .PostAsync(new Person() { PersonId = Guid.NewGuid(), Name = name, Date = date,State=state });
    }

    public async Task<Person> GetPerson(Guid personId)
    {
        var allPersons = await GetAllPersons();
        await firebase
            .Child(ChildName)
            .OnceAsync<Person>();
        return allPersons.FirstOrDefault(a => a.PersonId == personId);
    }

    public async Task<Person> GetPerson(string name)
    {
        var allPersons = await GetAllPersons();
        await firebase
            .Child(ChildName)
            .OnceAsync<Person>();
        return allPersons.FirstOrDefault(a => a.Name== name);
    }

    public async Task UpdatePerson(Guid personId, string name,DateTime date, string state)
    {
        var toUpdatePerson = (await firebase
            .Child(ChildName)
            .OnceAsync<Person>()).FirstOrDefault(a => a.Object.PersonId == personId);

        await firebase
            .Child(ChildName)
            .Child(toUpdatePerson.Key)
            .PutAsync(new Person() { PersonId = personId, Name = name,Date = date, State = state });
    }

    public async Task DeletePerson(Guid personId)
    {
        var toDeletePerson = (await firebase
            .Child(ChildName)
            .OnceAsync<Person>()).FirstOrDefault(a => a.Object.PersonId == personId);
        await firebase.Child(ChildName).Child(toDeletePerson.Key).DeleteAsync();
    }
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Wendy Zang - MSFT
Solution 2	chris

'How can display Picker item of firebase realtime using xamarain forms and add to firebase when select item

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]