Passing the value of a bound list - windows-phone-7

I had this code working before, but have somehow deleted it as I was trying to get something else fixed.
So I have a list which is bound as a View model, and the list has three lines on it.
I want to be able to click on the list, get the value of the third line on another page and use that value.
Here is the code for the selection of the list
private void List_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
// If selected index is -1 (no selection) do nothing
if (List.SelectedIndex == -1)
return;
// Navigate to the new page
NavigationService.Navigate(new Uri("/Route.xaml?selectedItem=" + List.SelectedIndex, UriKind.Relative));
string urlWIthData = string.Format("/Route.xaml?name={0}", " ");
this.NavigationService.Navigate(new Uri(urlWIthData, UriKind.Relative));
// Reset selected index to -1 (no selection)
List.SelectedIndex = -1;
}
Then, on the route page I want to be able to get the value and use the value line three....
How do I do this?
EDIT:
so this one part of the list:
this.Items.Add(new ItemViewModel() { LineOne = "Images/1.png", LineTwo = "Whitehawk - County
Hospital - City Centre - Hove - Portslade - Mile Oak", LineThree = "1 Whitehawk - Mile Oak",
LineFour = "1 Mile Oak - Whitehawk", LineFive = "1149" });
I Display the list on one page :
<ListBox Margin="6,6,7,6" ItemsSource="{Binding Items}" Name="List" OpacityMask="#FFD38648" FontSize="26" SelectionChanged="List_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="0,0,0,17" DataContext="{Binding}">
<Image Name="Images" Source="{Binding LineOne}">
</Image>
<TextBlock Text="{Binding LineTwo}" Style="{StaticResource PhoneTextSubtleStyle}" Name="textblock3"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

You can cast the list's SelectedItem to type Item and get the value from there:
private void List_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
// If selected index is -1 (no selection) do nothing
if (List.SelectedIndex == -1)
return;
// Here's the codes -----------------------
var item = Items.SelectedItem as Item;
if(item == null) //cast didn't work
return;
var lineThree = item.LIneThree;
// end of the codes -----------------------
// Navigate to the new page
NavigationService.Navigate(new Uri("/Route.xaml?selectedItem=" + List.SelectedIndex, UriKind.Relative));
string urlWIthData = string.Format("/Route.xaml?name={0}", " ");
this.NavigationService.Navigate(new Uri(urlWIthData, UriKind.Relative));
// Reset selected index to -1 (no selection)
List.SelectedIndex = -1;
}

Related

How to get selected item in Xamarin

I have a Picker in Xamarin and I want to pass the selected item in Picker to the another page(TablePage). Below this Picker there is a button and whenever it is clicked I want to go to the other page and display the selected value in the pther page.
<Picker x:Name="SelectTablePicker" Title="Select table" TextColor="#676FA3" TitleColor="#676FA3" FontSize="Title" ItemsSource="{Binding TablesFromViewModelCollector}" ItemDisplayBinding="{Binding Name}" SelectedItem="{Binding SelectedTable}" />
<Button x:Name="SelectTableButton" Text="Select Table" HorizontalOptions="Center" Style="{DynamicResource TitleStyle}" Clicked="Selected_Button" />
So how I am trying to pass this value is with click event:
async void Selected_Button(object sender, System.EventArgs e)
{
var SelectTablePicker = (Picker)sender;
int selectedIndex = SelectTablePicker.SelectedIndex;
if (selectedIndex != -1)
{
await Navigation.PushAsync(new TablePage((string)SelectTablePicker.ItemsSource[selectedIndex]));
}
}
And on the Table Page, I created Label where I want to show the selected item:
<Label x:Name="MyLabel" Text="#" HorizontalOptions="Fill" Grid.Column="0" BackgroundColor="#FF5959" TextColor="#EEF2FF" HorizontalTextAlignment="Left" Padding="0, 0, 0, 10" VerticalTextAlignment="Center"/>
And here its controller:
public TablePage(string tableName)
{
InitializeComponent();
MyLabel.Text = $"{UserName}";
}
But whenever I click the button I am getting an error and I couldnt figure out why.
this is a button click event, so the sender is a Button, not a Picker
var SelectTablePicker = (Picker)sender;
int selectedIndex = SelectTablePicker.SelectedIndex;
instead just do this
// SelectTablePicker is the name of your picker
int selectedIndex = SelectTablePicker.SelectedIndex;
and even better, you are already binding SelectedItem="{Binding SelectedTable}" so you could just get the value of SelectedTable directly from your VM
finally, you want to cast the selected item as a Table, not a string
new TablePage((Table)SelectTablePicker.ItemsSource[selectedIndex])

Multi-select Listview

This is my list view it should contain the list of activities came from my SQLite database:
<ListView SeparatorVisibility="None" x:Name="lstActivity" HasUnevenRows="True">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Frame StyleClass="lstframe" CornerRadius="0" BorderColor="Transparent" HasShadow="False">
<StackLayout StyleClass="lstContainer" VerticalOptions="CenterAndExpand">
<Grid>
<Label StyleClass="lstActivityName" Grid.Row="0" Grid.Column="0" Text="{Binding ActivityDescription}">
<Label.FontFamily>
<OnPlatform x:TypeArguments="x:String">
<On Platform="Android" Value="Poppins-Regular.otf#Poppins-Regular"/>
</OnPlatform>
</Label.FontFamily>
</Label>
<Switch Grid.Row="0" Grid.Column="1" IsToggled="{Binding Selected}" />
</Grid>
</StackLayout>
</Frame>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Here is how I populate the list view this will return atleast five(5) activities:
public void Get_Activities()
{
try
{
var db = DependencyService.Get<ISQLiteDB>();
var conn = db.GetConnection();
var getActivity = conn.QueryAsync<ActivityTable>("SELECT * FROM tblActivity WHERE Deleted != '1' ORDER BY ActivityDescription");
var resultCount = getActivity.Result.Count;
if (resultCount > 0)
{
var result = getActivity.Result;
lstActivity.ItemsSource = result;
lstActivity.IsVisible = true;
}
else
{
lstActivity.IsVisible = false;
}
}
catch (Exception ex)
{
//Crashes.TrackError(ex);
}
}
Selected item binding:
public class SelectData
{
public bool Selected { get; set; }
}
Get selected Items on click:
private void BtnClose_Clicked(object sender, EventArgs e)
{
foreach (var x in result)
{
if (x.Selected)
{
// do something with the selected items
}
}
}
I posted another question regarding on multi-select list view my problem is I don't know how to proceed when I use the answers given to me. How can I get the the selected values because I will save the selected values to my database?
your Switch is bound to the Selected property of your model. Just iterate (or use LINQ) to get the items that are selected.
// you need to maintain a reference to result
foreach(var x in result)
{
if (x.Selected)
{
// do something with the selected items
}
}
LINQ
var selected = result.Where(x => x.Selected).ToList();
you will also need to have a class level reference to result
// you will need to change this to reflect the actual type of result
List<MyClass> result;
public void Get_Activities()
{
...
result = getActivity.Result;
...
For multi-select Listview, I have wrote a working example in my blog. Hope this helps : https://androidwithashray.blogspot.com/2018/03/multiselect-list-view-using-xamarin.html?view=flipcard

i want to pass list as parameters in page navigation in windows7 using silverlight and access them in target page

I'm new to Windows Phone 7 development.
In my First Application I want to Create two listboxes with checkboxes inside them in different pages and to fill the first listbox with some Data. When I select some records in first listbox, that particular records have to be added in another listbox. I done listbox selection and also pass the selecteditem via parameter to another page, when I tried to assign that list to listbox.ItemSource it throws ArgumentNullException.
Please help me to solve this problem.
Thanks.
Firstly, as you are pointing out, ArgumentNullException is being thrown. So basically when you are doing the assignment to ItemsSource you are providing a null. In other terms, the object you think you have received from the object page is null.
Secondly, it is hard to help you debug the problem if you are not providing any source code. But, generally speaking are you able to test with dummy data and from code-behind (i.e. not from the XAML) when you are in the 2nd page that the listbox there gets populated? So, for the time being ignore the passing of data. Just ensure that when the 2nd page is loaded, the listbox is populated with dummy data that you have created in the code-behind of that page. If that works then your problem is simpler.
Hopefully, this helps.
//-- Adding sample Code -- //
Firstpage.xaml
<ListBox x:Name="FirstListBox" Grid.Row="1" ItemsSource="{Binding}" SelectionChanged="HandleSelection">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" FontSize="32" Margin="12"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Firstpage.xaml.cs
FirstListBox.DataContext = new String[] { "A", "B", "C", "D", "E", "F", "G", "H", "I", "J" };
...
private void HandleSelection(object sender, SelectionChangedEventArgs e)
{
String selection = (String)FirstListBox.SelectedItem;
NavigationService.Navigate(new Uri("/Secondpage.xaml?id=" + selection, UriKind.Relative));
}
Secondpage.xaml
<ListBox x:Name="OtherListBox" Grid.Row="1" ItemsSource="{Binding}">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" FontSize="32" Margin="12"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Secondpage.xaml.cs
protected override void OnNavigatedTo(NavigationEventArgs e)
{
String id = null;
NavigationContext.QueryString.TryGetValue("id", out id);
if (id != null)
{
List<String> dummyData = new List<string>();
for (int i = 0; i < 12; i++)
{
dummyData.Add(id + " - " + i);
}
OtherListBox.DataContext = dummyData;
}
}
So, as you can read from the i have a dummy list in Firstpage and when i click on any of the items it takes me to another page where there is another list which have been populated with data generated from my initial selection. As you see i am passing the selection as a querystring parameter just like i explained in my comments of this answer.
Hopefully this solves your problem and i look forward to you accepting this solution as an answer to your problem.
And in The Second Page...
<`private IList iList1;
//In The onNavigatedTo Event assign the stored list to the variable//
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
var i= PhoneApplicationService.Current.State["yourparam"];
iList1 = (IList) i ;//convert object to list//
lstpro.ItemsSource = iList1;
}'
public partial class MainPage : PhoneApplicationPage
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
//adding data to listbox on page load event//
for (int i = 0; i < 20; i++)
{
id = i + 1;
name = "productname" + i;
quantity = i + 2 / 2;
productlist.Add(new ProductList(id, name, quantity));
}
lstpro.ItemsSource = productlist;
}
private void button1_Click(object sender, RoutedEventArgs e)
{
//using PhoneApplicationService.Current.State to store the list//
PhoneApplicationService.Current.State["yourparam"] = lstpro.SelectedItems;
NavigationService.Navigate(new Uri("/res.xaml", UriKind.Relative))
}
}

stop the stackpanel items inside scroll viewer to be at the display left side when scroll

I have added 10 images in a stackpanel horizontally which is inside a scrollviewer. When user swipe the page ,the scrollviewer stops at certain position, if the scroll stops in the middle of 2 images like the first image shown below i want to set the image with number 3 to be automatically scroll and fit with the left side of the screen like in the second image
for (int i = 0; i <= 9; i++)
{
Uri uri = new Uri("http://d1mu9ule1cy7bp.cloudfront.net//catalogues/47/pages/p_" + i + "/thump.jpg");
ImageSource img1 = new BitmapImage(uri);
Image rect = new Image { RenderTransform = new TranslateTransform() };
rect.Source = img1;
stack.Children.Add(rect);
}
XAML:
<Grid x:Name="LayoutRoot" Width="480" Background="Transparent" Margin="0,-33,0,0" Height="800">
<ScrollViewer HorizontalContentAlignment="Left" HorizontalAlignment="Left" Name="scroll" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Visible">
<StackPanel Name="stack" Width="Auto" Orientation="Horizontal" HorizontalAlignment="Left" >
</StackPanel>
</ScrollViewer>
</Grid>
The first thing you need to do is detect which item is overlapping the side of the screen. To do this, iterate over each item within the StackPanel and determine their location relative to some other element that has a fixed location on screen.
To do this, I use the following extension method:
/// <summary>
/// Gets the relative position of the given UIElement to this.
/// </summary>
public static Point GetRelativePosition(this UIElement element, UIElement other)
{
return element.TransformToVisual(other)
.Transform(new Point(0, 0));
}
i.e. for each item call the following;
Point position = stackPanelItem.GetRelativePosition(someFixedElement);
Using the location of each item, you should be able to work out which one overlaps the screen.
You then need to calculate by how much you need to scroll in order to ensure that your item is fully visible, then use ScrollViewer.ScrollToVerticalOffset to scroll to that location.
This probably isn't the nicest solution and I am sure there is a better way to achieve this but you could use the following :-
XAML :-
<ListBox x:Name="MyListBox"
ScrollViewer.VerticalScrollBarVisibility="Disabled"
ScrollViewer.HorizontalScrollBarVisibility="Visible">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
C# :-
DispatcherTimer myTimer = new DispatcherTimer();
// Constructor
public MainPage()
{
InitializeComponent();
for (int i = 0; i < 10; i++)
{
MyListBox.Items.Add(new Button()
{
Content = i.ToString(),
Width = 200,
Height = 100,
});
MyListBox.MouseMove += new MouseEventHandler(MyListBox_MouseMove);
}
myTimer.Interval = TimeSpan.FromSeconds(1);
myTimer.Tick += new EventHandler(myTimer_Tick);
}
private void myTimer_Tick(object sender, EventArgs e)
{
myTimer.Stop();
SnapFirstItem();
}
private void MyListBox_MouseMove(object sender, MouseEventArgs e)
{
myTimer.Stop();
myTimer.Start();
}
private void SnapFirstItem()
{
foreach (Button currentButton in MyListBox.Items)
{
bool visible = MyListBox.TestVisibility(currentButton, System.Windows.Controls.Orientation.Horizontal, true);
if (visible)
{
MyListBox.ScrollIntoView(currentButton);
break;
}
}
}
The TestVisibility extension method is from the following :-
http://blogs.msdn.com/b/ptorr/archive/2010/10/12/procrastination-ftw-lazylistbox-should-improve-your-scrolling-performance-and-responsiveness.aspx

Windows Phone 7 Back Button issue

In my app I have several pages. When I click on the Windows "Back" Button everything goes back as expected.
However I have 2 pages that are causing me grief. Page "A" is doing some binding in the XAML:
<ListBox x:Name="lbPrograms" ItemsSource="{Binding Items}" SelectionChanged="lbPrograms_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel x:Name="DataTemplateStackPanel" Orientation="Horizontal">
<Image x:Name="ItemImage" Source="/images/ArrowImg.png" Height="43" Width="43" VerticalAlignment="Top" Margin="10,0,20,0"/>
<StackPanel>
<TextBlock x:Name="ItemText" Text="{Binding programName}" Margin="-2,-13,0,0" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock x:Name="DetailsText" Text="{Binding createDate}" Margin="0,-6,0,3" Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
<Image x:Name="ItemFavs" Source="/images/favs.png" Height="43" Width="43" VerticalAlignment="Top" Margin="10,0,20,0"/>
<Image x:Name="ItemDelete" Source="/images/delete.png" Height="43" Width="43" VerticalAlignment="Top" Margin="10,0,20,0"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The code behind for Page A is fairly simple:
protected override void OnNavigatedTo(NavigationEventArgs e)
{
base.OnNavigatedTo(e);
// Set the data context of the listbox control to the sample data
if (DataContext == null)
DataContext = App.ViewModel;
App.ViewModel.Refresh();
lbPrograms.ItemsSource = App.ViewModel.Items;
}
private void lbPrograms_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
NavigationService.Navigate(new Uri("/DisplayProgram.xaml?selectedItem=" + lbPrograms.SelectedIndex, UriKind.Relative));
}
private void BackBtn_Click(object sender, EventArgs e)
{
NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));
}
Page B has no binding in the XAML as I am taking the data from the ModelView a drawing it out dynamically on the screen. Like so:
private int index;
protected override void OnNavigatedTo(NavigationEventArgs e)
{
base.OnNavigatedTo(e);
string selectedIndex = "";
if (NavigationContext.QueryString.TryGetValue("selectedItem", out selectedIndex))
{
//prevents error
if (int.Parse(selectedIndex) == -1)
{
return;
}
if ((DataContext == null))
{
index = int.Parse(selectedIndex);
App.ViewModel.Refresh();
DataContext = App.ViewModel.Items[index].nValDictionary;
int i = 0;
foreach (KeyValuePair<string, string> kvp in (((System.Collections.Generic.Dictionary<string, string>)(DataContext))))
{
StackPanel sp = new StackPanel();
sp.Name = "sp" + i;
sp.Background = new SolidColorBrush(Colors.Black);
sp.Width = 460;
WrapPanel wp = new WrapPanel();
wp.Name = "test" + i;
wp.Width = 300;
wp.Height = 200;
TextBlock txt = new TextBlock();
txt.Text = kvp.Key.ToString();
txt.Foreground = new SolidColorBrush(Colors.White);
sp.Children.Add(txt);
int chkBoxesVal = 0;
if (kvp.Value == "")
{
chkBoxesVal = 0;
}else{
chkBoxesVal = Convert.ToInt32(kvp.Value.ToString());
}
int iCount = 0;
for (iCount = 0; iCount <= chkBoxesVal - 1; iCount++)
{
CheckBox chk = new CheckBox();
chk.Name = i.ToString();
chk.Width = 56;
chk.Height = 70;
chk.Content = "";
//chk.Background = new SolidColorBrush(Colors.Black);
//chk.BorderBrush = new SolidColorBrush(Colors.White);
chk.Style = (Style)Application.Current.Resources["checkBoxNG"];
wp.Children.Add(chk);
}
sp.Children.Add(wp);
lbItems.Items.Add(sp);
i += 1;
}
}
}
}
}
So when I'm going forward everything works fine, but when I hit the Windows "Back" button on Page B I get an error. I stepped through my code and when I hit the "Back" button it does go back to Page A, but then it is also going to Page B, which then throws the error and stops. So can anyone tell me why this behavior is happening? I would expect that it would go back to Page A and just stop there. Not to go back to Page B. is there something in my code that is causing it to reload Page B? Any resources that you can provide that might explain this behavior is also welcome!
Thanks!
It looks like SelectionChanged on Page A is firing as a result of the ItemsSource initialisation you're doing in OnNavigatedTo.
You could verify the SelectedIndex is -1 before taking any action in the SelectionChanged event.
Alternatively you could remove any existing event handler on SelectionChanged while doing this initialisation and restore that event handler on completion.
My assumption is that lbPrograms_SelectionChanged event occurs when you press back button and page A is loaded again.
Change your navigation design. For your DataTemplateStackPanel you could use ManipulationStarted event
and inside add
NavigationService.Navigate(new Uri("/DisplayProgram.xaml?selectedItem=" + lbPrograms.SelectedIndex, UriKind.Relative));

Resources