xamarin forms how to populate picker from code behind - c#

Evening All,
Learning Xamarin forms..attempting to add a picker with numeric values...(using https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/picker/populating-itemssource)
I have used the example on this page to get the picker populated from the view...which works fine...however I want to populate the picker from code behind...
<---XAML--->
<Picker Grid.Column="4" Grid.Row="2" ItemsSource="{Binding pickerSource}"/>
<---c#---->
var pickerList = new List<string>();
pickerList.Add("1");
pickerList.Add("2");
pickerList.Add("3");
pickerList.Add("4");
pickerList.Add("5");
pickerList.Add("6");
pickerList.Add("7");
pickerList.Add("8");
pickerList.Add("9");
pickerList.Add("10");
var pickerSource = new Picker { Title = "Quantity", TitleColor = Color.Red };
pickerSource.ItemsSource = pickerList;
Picker is appearing on app but when selected, its not populated with any values...why isnt this binding properly anyone?
Thank you
Also...as a side note if anyone is aware of a tool that contains all numeric values instead of me manually having to populate it with 1,2,3 etc..
Thanks Again
Thanks to #Jason for the reply...From here I have went with the following:
---xaml--
<Picker Grid.Column="4" Grid.Row="2" ItemsSource="{Binding pickerSource}"/>
---c#----
public List<string> pickerSource { get; set; }
public void PopulateQuantityPicker()
{
var pickerList = new List<string>();
pickerList.Add("1");
pickerList.Add("2");
pickerList.Add("3");
pickerList.Add("4");
pickerList.Add("5");
pickerList.Add("6");
pickerList.Add("7");
pickerList.Add("8");
pickerList.Add("9");
pickerList.Add("10");
pickerSource = pickerList;
this.BindingContext = this;
}
The picker is on the app, but it is not populated, it is empty.
When I Click on it I get the following:
(also the code is hitting the PopulateQuantityPicker())

here you are binding your ItemsSource to pickerSource
<Picker Grid.Column="4" Grid.Row="2" ItemsSource="{Binding pickerSource}"/>
in your code behind, you need a public property named pickerSource. You can only bind to public properties
public List<string> pickerSource { get; set }
// assign the data to your ItemsSource
pickerSource = pickerList;
// also be sure to set the BindingContext
BindingContext = this;
// this is creating a new picker named pickerSource. You have already done
// this in your XAML. This is NOT NEEDED
var pickerSource = new Picker { Title = "Quantity", TitleColor = Color.Red };
pickerSource.ItemsSource = pickerList;
if you want to do this from the code behind WITHOUT using binding, you first need to assign an x:name to your control
<Picker x:Name="myPicker" Grid.Column="4" Grid.Row="2" />
then in the code behind
myPicker.ItemsSource = pickerList;

Related

Xamarin Forms Bind List<myObject> to Picker

I have a problem. I created this Picker:
<Picker SelectedIndex="0" x:Name="pickerMode" Margin="30,0,30,0" />
And in my background code I set the ItemSource like this:
List<Mode> modeList = new List<Mode>();
Mode mode = new Mode
{
Id = 0,
Name = "Item1",
Type = "Test"
}
modeList.Add(mode)
pickerMode.ItemsSource = modeList;
But when I launch the App, the picker stays empty.
I want the Picker to show the Name of every Mode in that List.
What am I doing wrong?
Add this property in the XAML on your Picker ItemDisplayBinding="{Binding Name}"

Bind a list to a ListBox from code behind

Im trying to bind a list to a ListBox but absolutely nothing happens. Im not getting any error but im sure the list that the ListBox binds to is populated cause i have a Text control that displays info showing there are three items in the collection.
So the question is what is required to bind to a ListBox
<ListBox x:Name="lbSlaves" Width="300" Grid.Row="1" ItemsSource="{Binding Slaves}" >
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Width="150" Height="30" Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<TextBox Text="{Binding MachineName}"></TextBox> <!-- Ive also tried Path=MachineName -->
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Code behind
public List<ZTClient> Slaves { get; set; }
private void SetUpSlaves()
{
var client1 = new ZTClient()
{
MachineName = "Machine One",
IpAdress = "34534512",
Status = "Ready"
};
var client2 = new ZTClient()
{
MachineName = "Machine Two",
IpAdress = "123456",
Status = "Ready"
};
var client3 = new ZTClient()
{
MachineName = "Machine Three",
IpAdress = "65464234",
Status = "Ready"
};
AddClient(client1);
AddClient(client2);
AddClient(client3);
//Ive also tried the following
//lbSlaves.DataContext = Slaves;
tbInfoBox.Text += "Nr of slaves = " + Slaves.Count() + Slaves[0].MachineName;
}
void SetInfoTex(string newText)
{
tbInfoBox.Text = newText;
}
private void AddClient(ZTClient newClient)
{
Slaves.Add(newClient);
}
You bind a property (TextBox.Text) that binds TwoWay by default. Does your MachineName have a public setter? If not change the binding mode to OneWay or rather make the setter more accessible to prevent binding errors.
You also update your info text manually but your ListBox bindings are not supported by change notifications, so they probably will not be synchronized. You should bind to an ObservableCollection<ZTClient>, and if you want to change the instances themselves, then the ZTClient class should implement INotifyPropertyChanged.

c# link objects wrapped on the listbox in WINDOWS PHONE

I have this block of code as you can see in the screen print correctly loads the data you want and store the list of objects PopularVideos:
item { Title = Hey Porsche, Url = http://www.unnu.com/wp-content/plugins/wordpress-popular-posts/timthumb.php?src=http://www.unnu.com/wp-content/uploads/2013/03/019.jpg&h=65&w=275 } <>f__AnonymousType0<string,string>
item.Title "Hey Porsche" string
item.Url "http://www.unnu.com/wp-content/plugins/wordpress-popular-posts/timthumb.php?src=http://www.unnu.com/wp-content/uploads/2013/03/019.jpg&h=65&w=275" string
Need to load these objects in my list box with binding or has otherwise also can be. But the windows phone does not work with DataSource and DisplayMember.
My XAML:
<ListBox Name="listBoxPopular">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<Image Name="imagem" Source="{Binding Path=Url}"/>
<TextBlock Text="{Binding Titulo}" Tap="HyperlinkButton_Tap" FontSize="30" Foreground="#FF159DDE" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</controls:PanoramaItem>
My Class is:
class PopularVideos
{
public PopularVideos() { }
public PopularVideos(string titulo, string url)
{
Titulo = titulo;
BitmapImage Img = new BitmapImage(new Uri(url));
}
public string Titulo { get; set; }
public Uri Url { get; set; }
}
and my codebehind is:
_popVideos = new List<PopularVideos>();
var data = e.Document.DocumentNode.SelectSingleNode("//div[#class='content']")
.Descendants("img")
.Select(img => new
{
Title = img.Attributes["alt"].Value,
Url = img.Attributes["src"].Value,
}).ToList();
foreach (var item in data)
{
PopularVideos pop = new PopularVideos(item.Title, item.Url);
_popVideos.Add(new PopularVideos(item.Title, item.Url));
}
listBoxPopular.ItemsSource = _popVideos;
This code works because they are carrying the images and links in the objects, just can not bring up in my list box.
Have a bindable ObservableCollection<Item> (preferrably in a ViewModel).
Use the ListBox.ItemsSource property to bind to said ObservableCollection<Item>. The standard binding rules apply.
Each of the items in ListBox will be a representation of the items in the core collection that is bound to the control, so bind to its properties the same way you would to anything else.
It's reply to comment:
Ok, please read once again the article that #Den send to you. And please remove DataContext Property from ListBox, add x:Name="myList" to ListBox and in code-behind: myList.DataContext = this; This is not the best solution, but it's easy to understand and firstly you need to understand it :) Best regards.

Listbox databinding NewItemPlaceholder

I have an observable collection bound to a list box.
The collection has 2 items, but the list box is showing 3 items (e.g. the 2 items that are actually in the observable collection and an additional item for the NewItemPlaceholder.
I want it only to show the 2 items.
Below is my XAML.
<ListBox MinHeight="20" MinWidth="20" Name="MultipleSelectionsMultipleWagersListBox" Visibility="{Binding Path=Coupon.BarcodeText, Converter={StaticResource CouponBarcodeToVisibilityConverter1}, ConverterParameter=994450_994550}" Height="AUto" Width="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="5"
ItemsSource="{Binding Path=BetViewModels}" Grid.Row="1" Grid.Column="1" >
<ListBox.ItemTemplate>
<DataTemplate>
<View:BetView DataContext="{Binding}" Name="ThisBet" Margin="5"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Here is the c#
private ObservableCollection<BetViewModel> _betViewModels = new ObservableCollection<BetViewModel>();
public ObservableCollection<BetViewModel> BetViewModels
{
get { return _betViewModels; }
set
{
if (Equals(value, _betViewModels)) return;
_betViewModels = value;
OnPropertyChanged("BetViewModels");
}
}
Here is the code to populate the betViewModels:
var betViewModel = new BetViewModel { Bet = new Bet() };
betViewModel.Bet.SelectionName = "Chelsea";
betViewModel.Bet.Price = "4/9";
betViewModel.Bet.Market = "90 Minutes";
betViewModel.Bet.ExpectedOdd = DateTime.Now;
BetViewModels.Add(betViewModel);
betViewModel = new BetViewModel { Bet = new Bet() };
betViewModel.Bet.SelectionName = "Chelsea";
betViewModel.Bet.Price = "4/9";
betViewModel.Bet.Market = "90 Minutes";
betViewModel.Bet.ExpectedOdd = DateTime.Now;
BetViewModels.Add(betViewModel);
How Do I switch of this from showing the additional item for the new item place
Here is an image of it displaying the placeholder
The DataGrid supports adding new rows, which have to start out blank. If your ItemsSource is bound to both a ListBox/ItemsControl and a DataGrid, you need to set the DataGrid 'CanUserAddRows' property to 'False'.
Where I found the answer: http://www.mindstick.com/Forum/1519/How%20do%20I%20remove%20a%20listbox%20new%20item%20placeholder
There's nothing in your code that should be adding an extra empty item. There may be some other code adding to BetViewModels or there may be a change happening to the generated ICollectionView for the collection if you have it bound to something else that you're not showing, like an editable DataGrid.
did your sample code also provide this issue?
how much items contains your _betViewModels.count in debugging there are really only 2 Items?
it seems you added an empty BetViewModel at the End
i would suggest check your logic which provides populates your items
if it is a loop it should (counter<yourDatasource.Count) just for example

Why Silverlight binding doesnt work?

I have 2 listboxes populated by data like so:
GoogleNewsResults.Add(
new News()
{
Content = "News Content", Title = "News Title"
});
NotifyPropertyChanged("GoogleNewsResults");
GoogleBlogsResults.Add(
new Blog()
{
Content = "Blog Content", Title = "Blog Title"
});
NotifyPropertyChanged("GoogleBlogsResults");
But it doesnt update Blog Results listbox. Do you have any idea why?
The XAML has this type of binding:
<sllb:ListBox x:Name="GoogleBlogsList" ItemsSource="{Binding GoogleBlogsResults, Mode=TwoWay}" />
As your GoogleBlogsResults property is a
List<Blog>
adding items to it will not trigger the binding engine to fire as the object reference has not changed when you call
NotifyPropertyChanged("GoogleBlogsResults");
You can solve this by following the solution described by T.Ho by using
ObservableCollection<Blog>
which triggers the binding engine automatically when items within the collection are modified or alternatively by generating a new
List<Blog>
object (which merges the new and old items) and setting the GoogleBlogsResults property to the new list.
Hope this helps.
this Tutorial may help you
i think you need to binding source in XAML
DataContext="{Binding Source={StaticResource CustomerContainerObject}}"
or
<ListBox ItemsSource="{Binding}">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}"></TextBlock>
</DataTemplate>
</ListBox.ItemTemplate>
var employees = new List<Employee>()
{
new Employee { Name = "Scott" },
new Employee { Name = "Poonam"},
new Employee { Name = "Paul" }
};
this.DataContext = employees;
wish that helps.
Instead of implement INotifyProperityChanged interface yourself, you might want to use ObservableCollection<T> instead for your list items. ObservableCollection is a collection class with INotifyProperityChanged implemented, so you don't have to manually call "NotifyPropertyChanged" for the binding to update.
Make sure you have the right DataContext. If you're not using MVVM design pattern, you might want to look into that.

Categories