Develop Reference

Get data from selected item in ListView

I have the following C# code that generate an items for list view:
//function that generated items for list view
results = //An array
foreach (var item in results)
{
var nameStr = item.FirstName + " " + item.LastName;
var descriptionStr = item.Email;
IconTextGrid.Items.Add(new { Name = nameStr, Description = descriptionStr });
}
And the XAML:
<Page.Resources>
<DataTemplate x:Key="IconTextDataTemplate">
<StackPanel Orientation="Horizontal" Width="220" Height="60" Background="#FF7CC6FF">
<StackPanel Orientation="Vertical" VerticalAlignment="Center">
<TextBlock Text="{Binding Name}" Margin="10,0,0,0" Width="170" Height="20" TextTrimming="WordEllipsis"/>
<TextBlock Text="{Binding Description}" Margin="10,0,0,0" Width="170" Height="20" TextTrimming="WordEllipsis"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</Page.Resources>
<ListView x:Name="IconTextGrid" SelectionMode="Multiple" ItemTemplate="{StaticResource IconTextDataTemplate}" Height="400" Grid.Row="5" Margin="40,20,40,10" HorizontalAlignment="Stretch" Foreground="White" SelectionChanged="IconTextGrid_SelectionChanged">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<ItemsWrapGrid MaximumRowsOrColumns="6"/>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
</ListView>
and:
private void SendRequests_Click(object sender, RoutedEventArgs e)
{
string emailAdress;
for (int i = 0; i < IconTextGrid.SelectedItems.Count; i++)
{
//I need to get the description of the selected items
}
}
My question is how Ican get the value of the Description field in the item that generated?
Thanks

You can create custom type like this:
class MyType
{
string Name { get; set; }
string Description { get; set; }
}
Then change your code to:
IconTextGrid.Items.Add(new MyType{ Name = nameStr, Description = descriptionStr });
And now you can get description:
for (int i = 0; i < IconTextGrid.SelectedItems.Count; i++)
{
var item = (MyType)IconTextGrid.SelectedItems[i];
string description = item.Description;
}

You are using an anonymous type ofr the items in your listbox:
IconTextGrid.Items.Add(new { Name = nameStr, Description = descriptionStr });
You should declare a class:
public class MyItem
{
public string Name { get; set; }
public string Description { get; set; }
}
and use this class instead:
IconTextGrid.Items.Add(new MyItem { Name = nameStr, Description = descriptionStr });
The you can get SelectedItem and cast it to MyItem.

Why are my BitmapImages not displaying?

Ad[a,o]pting Brundritt's example here, which he referenced in responding to my earlier BingMaps question, I have been able to display certain data in an "infobox" like so:
...but am not getting the BitmapImage that is part of the data I intend to display.
My question is why are the images not displaying, and what do I need to go in order to display them?
It's not the data - I've saved the thumbnail image to a SQLite database, where it is stored as an array of bytes, but which can be seen as images in SQLiteToolbox:
:
So as you can see, the String data is displaying fine, but not the image. Here is the pertinent code I've got for retrieving the data and displaying it:
// The class used to create the SQLite table
public class PhotraxBaseData
{
[SQLite.PrimaryKey]
[SQLite.AutoIncrement]
public int Id { get; set; }
. . .
public DateTime dateTimeTaken { get; set; }
public String filePath { get; set; }
public Byte[] thumbnail { get; set; }
}
private async void Gener8MapMarkers(List<PhotraxBaseData> _pbd)
{
foreach (PhotraxBaseData pbd in _pbd)
{
String descAndFilename = Path.GetFileName(pbd.filePath);
if (null != pbd.imgDescription)
{
descAndFilename = String.Format("{0} - {1}", pbd.imgDescription, descAndFilename);
}
BitmapImage bmi = await PhotraxUtils.ByteArrayToBitmapImage(pbd.thumbnail);
if (PhotraxUtils.ValidLatAndLong(pbd.latitude, pbd.longitude))
{
Location loc = new Location(pbd.latitude, pbd.longitude);
AddPushpin(loc, descAndFilename, pbd.dateTimeTaken, null, DataLayer);
}
}
}
public static async Task<BitmapImage> ByteArrayToBitmapImage(this byte[] byteArray)
{
// from http://dotnetspeak.com/2013/04/convert-byte-array-to-an-image-in-winrt
if (byteArray != null)
{
using (var stream = new InMemoryRandomAccessStream())
{
await stream.WriteAsync(byteArray.AsBuffer());
var image = new BitmapImage();
stream.Seek(0);
image.SetSource(stream);
return image;
}
}
return null;
}
public class PushpinMetadata
{
public string DescAndFileName { get; set; }
public DateTime DateTimeTaken { get; set; }
public BitmapImage Thumbnail { get; set; }
}
public void AddPushpin(Location latlong, string descAndFileName, DateTime dateTimeTaken, BitmapImage thumbnail, MapLayer layer)
{
Pushpin p = new Pushpin()
{
Tag = new PushpinMetadata()
{
DescAndFileName = descAndFileName,
DateTimeTaken = dateTimeTaken,
Thumbnail = thumbnail
}
};
MapLayer.SetPosition(p, latlong);
p.Tapped += PinTapped;
layer.Children.Add(p);
}
private void PinTapped(object sender, Windows.UI.Xaml.Input.TappedRoutedEventArgs e)
{
Pushpin p = sender as Pushpin;
PushpinMetadata m = (PushpinMetadata)p.Tag;
//Ensure there is content to be displayed
if (!String.IsNullOrEmpty(m.DescAndFileName))
{
Infobox.DataContext = m;
Infobox.Visibility = Visibility.Visible;
MapLayer.SetPosition(Infobox, MapLayer.GetPosition(p));
}
else
{
Infobox.Visibility = Visibility.Collapsed;
}
}
The XAML:
<bm:Map.Children>
<!-- Data Layer-->
<bm:MapLayer Name="DataLayer"/>
<!--Common Infobox-->
<bm:MapLayer>
<Grid x:Name="Infobox" Visibility="Collapsed" Margin="0,-115,-15,0">
<Border Width="300" Height="110" Background="Black" Opacity="0.8" BorderBrush="White" BorderThickness="2" CornerRadius="5"/>
<StackPanel Height="100" Margin="5">
<Grid Height="40">
<TextBlock Text="{Binding DescAndFileName}" FontSize="20" Width="250" TextWrapping="Wrap" HorizontalAlignment="Left" />
<Button Content="X" Tapped="CloseInfobox_Tapped" HorizontalAlignment="Right" VerticalAlignment="Top"/>
</Grid>
<Grid Height="40">
<Viewbox Height="200" Stretch="Uniform" StretchDirection="Both">
<Image Source="{Binding Thumbnail}" Width="Auto" Height="Auto" Margin="2"/>
</Viewbox>
</Grid>
<Grid Height="40">
<TextBlock Text="{Binding DateTimeTaken}" FontSize="16" Width="290" TextWrapping="Wrap" Height="Auto"/>
</Grid>
</StackPanel>
</Grid>
</bm:MapLayer>
<callisto:CustomDialog Content="CustomDialog" Height="100" Width="100"/>
</bm:Map.Children>
My guess is that the Image's Source property doesn't quite know what to do with the BitmapImage it's bound to via "Thumbnail"; but I don't know how to unbabelize the mismatch (presuming that's where the problem lies).
UPDATE
To answer Faye's brother Chris, here is the "database" (SQLite class) declaration:
public Byte[] thumbnail { get; set; }
Here is where I was calling the converter method, passing the appropriate member of the class instance, and then adding a pushpin:
BitmapImage bmi = await PhotraxUtils.ByteArrayToBitmapImage(pbd.thumbnail);
if (PhotraxUtils.ValidLatAndLong(pbd.latitude, pbd.longitude))
{
Location loc = new Location(pbd.latitude, pbd.longitude);
//AddPushpin(loc, descAndFilename, pbd.dateTimeTaken, null, DataLayer);
AddPushpin(loc, descAndFilename, pbd.dateTimeTaken, bmi, DataLayer);
}
However: MY BAD, PEOPLES!!!
I had neglected to replace my placeholder "null" arg with "bmi" (you can see my previous code commented out above, and my new working call to AddPushpin() below it). The image's size/scale is all wrong, but that can be fixed easily enough, I reckon.
I don't know whether to jump for joy or kick myself in the keister, so I think I'll do both simultaneously.
Thanks to Mr. Dunaway for making me look closer at my code - something I obviously should have done before posting.

How to set the longitude and latitude from ViewModel in bing maps in windows phone 7

I want to give the longitude and latitude from ViewModel.
Now i am using like:-
private void button1_Click(object sender, RoutedEventArgs e)
{
Pushpin p = new Pushpin();
p.Background = new SolidColorBrush(Colors.Yellow);
p.Foreground = new SolidColorBrush(Colors.Black);
p.Location = new GeoCoordinate(double.Parse(longitude.Text), double.Parse(latitude.Text));//Longitude and Latitude
p.Content = "I'm here";//To show the place where it is located
map1.Children.Add(p);
map1.SetView(new GeoCoordinate(double.Parse(longitude.Text), double.Parse(latitude.Text), 200), 9);
}
My Xaml is:-
<Grid x:Name="MapPageUIContainer" Grid.Row="1" Margin="2,0,2,0">
<my:Map CopyrightVisibility="Collapsed" LogoVisibility="Collapsed" CredentialsProvider="" Mode="AerialWithLabels" Height="543" HorizontalAlignment="Left" Name="map1" VerticalAlignment="Top" Width="480" Margin="2,100,0,0" />
<Border BorderBrush="Silver" BorderThickness="1" Height="100" HorizontalAlignment="Left" Margin="0,0,0,0" Name="border1" VerticalAlignment="Top" Width="476" Background="#FFA3A371">
<TextBlock Text="Map Example" HorizontalAlignment="Center" FontSize="32" FontWeight="Bold" VerticalAlignment="Center" />
</Border>
<TextBox Height="72" HorizontalAlignment="Left" Margin="6,627,0,0" Name="longitude" Text="" VerticalAlignment="Top" Width="200" />
<TextBox Height="72" HorizontalAlignment="Left" Margin="260,627,0,0" Name="latitude" Text="" VerticalAlignment="Top" Width="200" />
<Button Content="Set" HorizontalAlignment="Left" Margin="190,690,0,0" Name="button1" VerticalAlignment="Top" Click="button1_Click" />
</Grid>
Here i want to give the Pushpin, longitude, latitude from view model. Please let me know how to achieve this?
Thanks in advance..
I have try like this..
public class MapPageViewModel : ReactiveObject
{
public static string _longitude;
public string longitude
{
get { return _longitude; }
set { this.RaiseAndSetIfChanged(x => x.longitude, value); }
}
public static string _latitude;
public string latitude
{
get { return _latitude; }
set { this.RaiseAndSetIfChanged(x => x.latitude, value); }
}
public ReactiveAsyncCommand setButton { get; set; }
public MapPageViewModel()
{
setButton = new ReactiveAsyncCommand();
setButton.Subscribe(x => {
Pushpin p = new Pushpin();
p.Background = new SolidColorBrush(Colors.Yellow);
p.Foreground = new SolidColorBrush(Colors.Black);
p.Location = new GeoCoordinate(double.Parse(longitude), double.Parse(latitude));
p.Content = "I'm here";//To show the place where it is located
//map1.Children.Add(p);
//map1.SetView(new GeoCoordinate(double.Parse(longitude), double.Parse(latitude), 200), 9);
});
}
}
But i don't know how to set map1.Children.Add() and map1.SetView and how to bind these values in Map?
Hi Clemens. I have tried your instruction. But it showing error.
And also i have try this:-
public MapPageViewModel()
{
PushpinItems = new ObservableCollection<PushpinItem>();
PushpinItem pp = new PushpinItem();
setButton = new ReactiveAsyncCommand();
setButton.Subscribe(x => {
pp.Location = new GeoCoordinate(double.Parse(longitude), double.Parse(latitude));
pp.Text = "I'm here";
PushpinItems.Add(pp);
});
}
But here run time error happening. Please let me know where i did mistake.

In a proper MVVM approach you would usually have a MapItemsControl with an ItemTemplate for the Pushpin, and bind that to an ObservableCollection of pushpin data items in your view model:
public class PushpinItem
{
public GeoCoordinate Location { get; set; }
public string Text { get; set; }
}
public class MapPageViewModel : ReactiveObject
{
public ObservableCollection<PushpinItem> PushpinItems { get; set; }
...
public MapPageViewModel()
{
PushpinItems = new ObservableCollection<PushpinItem>();
setButton = new ReactiveAsyncCommand();
setButton.Subscribe(x =>
{
PushpinItems.Add(new PushpinItem
{
Location = new GeoCoordinate(...),
Text = ...
});
});
}
}
XAML:
<map:Map ...>
<map:MapItemsControl ItemsSource="{Binding PushpinItems}">
<map:MapItemsControl.ItemTemplate>
<DataTemplate>
<map:Pushpin Location="{Binding Location}" Content="{Binding Text}"
Background="Yellow" Foreground="Black"/>
</DataTemplate>
</map:MapItemsControl.ItemTemplate>
</map:MapItemsControl>
</map:Map>

SetView From ViewModel
#Clemens and this link is very helpful to me..!! Thanks for Both of them..!!

how to display an image from web service

I am building my first app in windows phone 7. I need to show data from web service along with an image. I am able to show the data but not able to show the image.
My xaml code is:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<ListBox Name="listBox1">
<ListBox.ItemTemplate>
<DataTemplate>
<Button>
<Button.Content>
<ScrollViewer HorizontalScrollBarVisibility="Auto" Height="80" Width="400">
<!--<ScrollViewer Height="80">-->
<StackPanel Orientation="Horizontal" Margin="0,0,0,0">
<StackPanel Orientation="Vertical" Height="80">
<TextBlock Text="{Binding Path=News_Title}" TextWrapping="Wrap" ></TextBlock>
<TextBlock Text="{Binding Path=News_Description}" TextWrapping="Wrap"></TextBlock>
<TextBlock Text="{Binding Path=Date_Start}" TextWrapping="Wrap"></TextBlock>
<Image Source="{Binding Path=Image_Path}" />
</StackPanel>
</StackPanel>
</ScrollViewer>
</Button.Content>
</Button>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
The .cs code is:
public class Newss
{
public string News_Title { get; set; }
public string News_Description { get; set; }
public string Date_Start { get; set; }
}
public News()
{
InitializeComponent();
KejriwalService.aapSoapClient client = new KejriwalService.aapSoapClient();
client.getarvindNewsCompleted += new EventHandler<KejriwalService.getarvindNewsCompletedEventArgs>(client_getarvindNewsCompleted);
client.getarvindNewsAsync();
}
void client_getarvindNewsCompleted(object sender, KejriwalService.getarvindNewsCompletedEventArgs e)
{
string result = e.Result.ToString();
List<Newss> listData = new List<Newss>();
XDocument doc = XDocument.Parse(result);
foreach (var location in doc.Descendants("UserDetails"))
{
Newss data = new Newss();
data.News_Title = location.Element("News_Title").Value;
data.Date_Start = location.Element("Date_Start").Value;
listData.Add(data);
}
listBox1.ItemsSource = listData;
}
}
Xml String:
<NewDataSet>
<UserDetails>
<id>11</id>
<News_Title>Disciplinary Action against Vinod Binny</News_Title>
<News_Description>The Aam Aadmi Party formed a disciplinary committee, on 19-Jan-2013, headed by Pankaj Gupta to look into the matter of Vinod Kumar Binny. The other members of the committee included Ashish Talwar, Illyas Azmi, Yogendra Yadav and Gopal Rai.
This disciplinary committee has decided to expel Vinod Kumar Binny and terminate his primary membership from the party, for publicly making false statements against the party and its leadership, thereby bringing disrepute to the party. A letter to the same end has been issued to Vinod Kumar Binny.</News_Description>
<Date_Start>2014-01-29</Date_Start>
<image_path>news.png</image_path>
Can anyone help me in displaying the images for each field.
The image path is an http url
http://political-leader.vzons.com/ArvindKejriwal/images/uploaded/news.png

If i guess right your Image_Path is a http url . so you need to BitmapImage to bind as a ImageSource. may this will help you.
public class Newss
{
public string News_Title { get; set; }
public string News_Description { get; set; }
public string Date_Start { get; set; }
**//Edits**
public string image_path {get;set}
public BitmapImage ImageBind{get;set;}
}
foreach (var location in doc.Descendants("UserDetails"))
{
Newss data = new Newss();
data.News_Title = location.Element("News_Title").Value;
data.Date_Start = location.Element("Date_Start").Value;
**//Edits**
data.image_path = location.Element("Image_Path").Value;
data.ImageBind = new BitmapImage(new Uri( #"http://political-leader.vzons.com/ArvindKejriwal/images/uploaded/"+data.image_path, UriKind.Absolute)
listData.Add(data);
}
**Your xaml changes**
<Image Source="{Binding ImageBind }" />

How do I display images from back office in windows phone 7 application?

I am building my first app in windows phone 7. I need to show some data from web service along with an image. I am able to show the data but do not know how to display the images. New data can be entered which needs to be updated. The image will come from backoffice and the path will come from web service. My web service is:
<string><NewDataSet>
<UserDetails>
<id>5</id>
<News_Title>Audit of Electricity Companies</News_Title>
<News_Description> Rejecting the contention of private power distributors, the Delhi government today ordered an audit of their finances by the government's national auditor or Comptroller and Auditor General (CAG), fulfilling yet another election promise of the Aam Aadmi Party.
</News_Description>
<Date_Start>2014-01-03</Date_Start>
<image_path>news.png</image_path>
</UserDetails>
There will be more than 1 data. I am able to show news_Title, news_description, Date_start. My cs code is
public class Newss
{
public string News_Title { get; set; }
public string News_Description { get; set; }
public string Date_Start { get; set; }
}
public News()
{
InitializeComponent();
KejriwalService.aapSoapClient client = new KejriwalService.aapSoapClient();
client.getarvindNewsCompleted += new EventHandler<KejriwalService.getarvindNewsCompletedEventArgs>(client_getarvindNewsCompleted);
client.getarvindNewsAsync();
}
void client_getarvindNewsCompleted(object sender, KejriwalService.getarvindNewsCompletedEventArgs e)
{
string result = e.Result.ToString();
List<Newss> listData = new List<Newss>();
XDocument doc = XDocument.Parse(result);
// Just as an example of using the namespace...
//var b = doc.Element("NewDataSet").Value;
foreach (var location in doc.Descendants("UserDetails"))
{
Newss data = new Newss();
data.News_Title = location.Element("News_Title").Value;
// data.News_Description = location.Element("News_Description").Value;
data.Date_Start = location.Element("Date_Start").Value;
listData.Add(data);
}
listBox1.ItemsSource = listData;
}
My xaml file is
<ScrollViewer Margin="12,17,-12,144" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Auto" AllowDrop="False" ManipulationMode="Control">
<ListBox Name="listBox1" Margin="38,86,38,562">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=News_Title}"></TextBlock>
<TextBlock Text="{Binding Path=News_Description}"></TextBlock>
<TextBlock Text="{Binding Path=Date_Start}"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>

Add this to your model
public class Newss
{
public string News_Title { get; set; }
public string News_Description { get; set; }
public string Date_Start { get; set; }
public string Image_Path { get; set; }
}
Set the image property in your foreach loop
foreach (var location in doc.Descendants("UserDetails"))
{
Newss data = new Newss();
data.News_Title = location.Element("News_Title").Value;
// data.News_Description = location.Element("News_Description").Value;
data.Date_Start = location.Element("Date_Start").Value;
Newss.Image_Path = location.Element("image_path").Value
listData.Add(data);
}
In your Xaml
<ScrollViewer Margin="12,17,-12,144" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Auto" AllowDrop="False" ManipulationMode="Control">
<ListBox Name="listBox1" Margin="38,86,38,562">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=News_Title}"></TextBlock>
<TextBlock Text="{Binding Path=News_Description}"></TextBlock>
<TextBlock Text="{Binding Path=Date_Start}"></TextBlock>
<Image Source="{Binding Path=Image_Path}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</ScrollViewer>
And obviously, ensure that the Image_Path data from your xml payload is a valid uri, i would start by setting it to a static image such as "http://static.bbci.co.uk/frameworks/barlesque/2.59.4/orb/4/img/bbc-blocks-dark.png"