how to display an image from web service - c#

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 }" />

Related

Unable to retrieve image through WCF service in windows phone 8

I followed this guide.
Im able to retrieve all the things in ListBox through WCF EXCEPT image. Can somebody help me?
This is my class
public Tips()
{
//
// TODO: Add constructor logic here
//
}
public int TipsId { get; set; }
public string TipsTitle { get; set; }
public string TipsDescription { get; set; }
public string TipsImage { get; set; }
public string TipsCategory { get; set; }
public string ImageBind { get; set; }
Service.cs
hairtips = new Tips();
hairtips.TipsId = myReader.GetInt32(0);
hairtips.TipsTitle = myReader.GetString(1);
hairtips.TipsDescription = myReader.GetString(2);
hairtips.TipsImage = myReader.GetString(3);
hairtips.TipsCategory = myReader.GetString(4);
tips.Add(hairtips);
After webservice. My .xaml
<ListBox Height="650" HorizontalAlignment="Left" Margin="11,17,0,0" Name="listBox1" VerticalAlignment="Top" Width="434" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Name="LblTitle" HorizontalAlignment="Left" Margin="0,0,0,0" TextWrapping="Wrap" Text="{Binding TipsTitle}" VerticalAlignment="Top"/>
<TextBlock Name="LblDesc" HorizontalAlignment="Left" Margin="0,0,0,0" TextWrapping="Wrap" Text="{Binding TipsDescription}" VerticalAlignment="Top" Width="400"/>
<Image x:Name="ImageHair" HorizontalAlignment="Stretch" Height="100" Margin="0,0,0,0" VerticalAlignment="Top" Width="100" Source="{Binding TipsImage}" Stretch="Fill"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
My .cs. I have error under imagebind part.
public HairTips()
{
InitializeComponent();
string Category = "Hair";
TipsServiceClient svc = new TipsServiceClient();
svc.getHairTipsCompleted += new EventHandler<getHairTipsCompletedEventArgs>(svc_getHairTipsCompleted);
svc.getHairTipsAsync(Category);
}
void svc_getHairTipsCompleted(object sender, getHairTipsCompletedEventArgs e)
{
List<Tips> listOfTips = new List<Tips>();
foreach (var c in e.Result)
{
Tips tips = new Tips();
tips.TipsTitle = c.TipsTitle;
tips.TipsDescription = c.TipsDescription;
tips.TipsImage = c.TipsImage;
tips.ImageBind = new BitmapImage(new Uri(tips.TipsImage, UriKind.Absolute));
listOfTips.Add(tips);
}
listBox1.ItemsSource = listOfTips;
}
Please help me if you know how to do it. thank you very much
Try using Windows.UI.Xaml.Media.Imaging.BitmapImage than using Windows.Media.Imaging.BitmapImage.
And change your type of ImageBind from String to BitmapImage.
public BitmapImage ImageBind { get; set; }
Reference: Cannot implicitly convert type 'string' to 'Windows.UI.Xaml.Media.Imaging.BitmapImage

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"

C# Passing StringBuilder in a ListboxItems Content

I have a listbox in which i pass in every row 5 items. My XML file looks like this :
<ListBox x:Name="DatabaseBox" ItemsSource="{Binding Book}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Width="auto" Height="22">
<Image x:Name="ToggleFavoriteImage" Width="10" Height="10" Tag="{Binding Tag}" Source="{Binding ImageSource}" HorizontalAlignment="Center"/>
<TextBlock Text="{Binding Name}" HorizontalAlignment="Left" Margin="10,0,0,0" VerticalAlignment="Center"/>
<ListBoxItem Content="{Binding City}" HorizontalAlignment="Center"/>
<ListBoxItem Content="{Binding Author}" HorizontalAlignment="Center"/>
<ListBoxItem Content="{Binding Country}" HorizontalAlignment="Center"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Where Book is a private static List<BookItems> Book{ get; set; } and BookItems is
public struct BookItems
{
public string Name{ get; set; }
public string Url { get; set; }
public string Author{ get; set; }
public string City { get; set; }
public string Country { get; set; }
public string Tag { get; set; }
public ImageSource ImageSource { get; set; }
}
All my data that i want to pass in ListBox are stored in another List :private static List<Tuple<StringBuilder , StringBuilder , StringBuilder , StringBuilder , StringBuilder >> BookList = new List<Tuple<StringBuilder , StringBuilder , StringBuilder , StringBuilder , StringBuilder >>();
So if i try to fill my ListBox that way :
foreach(var ListItem in BookList)
{
Book= new List<BookItems>()
{
new BookItems()
{
Tag = ListItem.Item1.ToString(),ImageSource = FavoriteSource, Name= ListItem.Item1.ToString(), Author= ListItem.Item3.ToString(), City = ListItem.Item4.ToString(),Country = ListItem.Item5.ToString()
}
};
DatabaseBox.Items.Add(Book);
}
then i get everywhere null except the image. If i change my BookList to strings and my Book also, then everything goes smooth without any problems. I check every time the convertions from StringBuilder to string with a Console outpout and my strings are null, where my StringBuilder is ok. Am i doing something so wrong?
You should create instances for StringBuilder items in tuple like new StringBuilder()
as you said, the stringBuilder is just fine so my solution to you is first of all do not create a list for every item. i don't know why are you doing it but there shouldn't be a list for every item you add to DatabaseBox.
second, take your code
Book= new List<BookItems>()
{
new BookItems()
{
Tag = ListItem.Item1.ToString(),ImageSource = FavoriteSource, Name= ListItem.Item1.ToString(), Author= ListItem.Item3.ToString(), City = ListItem.Item4.ToString(),Country = ListItem.Item5.ToString()
}
};
and rewrite it. also rewrite the properties in BookItems and make it a class.
after you do all of that the debug process will be easy. if the stringBuilders contains the data you will see exactly what happens to it.

Windows Phone ListPicker passing SelectedItem

I'm using the rss reader sample and a listPicker. What I want to do is to pass the rss url from the listPicker item to the webClient.DownloadStringAsync.
**MainPage.xaml**
[...]
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Nazwa}"
Margin="12 0 0 0"
VerticalAlignment="Center"/>
<Image Source="/Repertuar;component/Images/open.png" FlowDirection="RightToLeft" />
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel Margin="16 21 0 20">
<TextBlock Text="{Binding Nazwa}"
FontSize="43"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
[...]
.
**MainPage.xaml.cs**
[...]
public class Miasto
{
public string Nazwa
{
get;
set;
}
public string Adres
{
get;
set;
}
}
public partial class MainPage : PhoneApplicationPage
{
// Constructor
public MainPage()
{
InitializeComponent();
IEnumerable<Miasto> source = this.GetDataSource();
this.listPicker.ItemsSource = source;
}
private IEnumerable<Miasto> GetDataSource()
{
List<Miasto> source = new List<Miasto>();
source.Add(new Miasto() { Nazwa = "Bydgoszcz", Adres = "http://film.wp.pl/rss.xml?id=10" });
source.Add(new Miasto() { Nazwa = "GdaƄsk", Adres = "http://film.wp.pl/rss.xml?id=27" });
return source;
}
[...]
webClient.DownloadStringAsync(new System.Uri("http://film.wp.pl/rss.xml?id=27"));
[...]
I have no clue on how to solve this. Is there an easy solution for this issue?
You can pass the id to the url on the selection change event. Are you trying to preload the information on the list item?

Silverlight: Difficulty with ListBox and {Binding} syntax

I'm building a test Windows Phone 7 Silverlight app. (I've been following this tutorial.) I'm having a problem binding the list items to item properties.
Get tweets for an entered username:
private void button1_Click(object sender, RoutedEventArgs e)
{
WebClient twitter = new WebClient();
twitter.DownloadStringCompleted += new DownloadStringCompletedEventHandler(twitter_DownloadStringCompleted);
twitter.DownloadStringAsync(new Uri(String.Format("http://api.twitter.com/1/statuses/user_timeline.xml?screen_name={0}", username.Text)));
}
Add those tweets to the listbox:
struct TwitterItem
{
public string UserName { get; set; }
public string Message { get; set; }
public string ImageSource { get; set; }
}
void twitter_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
if (e.Error != null)
{
return;
}
XElement xmlTweets = XElement.Parse(e.Result);
IEnumerable<TwitterItem> tweetItems = from tweet in xmlTweets.Descendants("status")
select new TwitterItem
{
ImageSource = tweet.Element("user").Element("profile_image_url").Value,
Message = tweet.Element("text").Value,
UserName = tweet.Element("user").Element("screen_name").Value
};
listBox1.ItemsSource = tweetItems;
PageTitle.Text = tweetItems.First().UserName;
}
PageTitle.Text reveals that the tweets are being correctly parsed... but they aren't being displayed correctly.
Here is the listbox I'm trying to use:
<ListBox Height="454" Width="418" HorizontalAlignment="Left" Margin="36,128,0,0" Name="listBox1" VerticalAlignment="Top">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Height="132">
<Image Source="{Binding ImageSource}" Height="73" Width="73" VerticalAlignment="Top" Margin="0,10,8,0" />
<StackPanel Width="370">
<TextBlock Text="{Binding UserName}" Foreground="BlanchedAlmond" FontSize="28"/>
<TextBlock Text="{Binding Message}" TextWrapping="Wrap" FontSize="24"/>
<TextBlock Text="shows up just fine" TextWrapping="Wrap" FontSize="24"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The third TextBlock shows up just fine, so it's not an issue of having 0 height or width. I suspect that the problem is something with Text={Binding Property}. Or am I doing something else wrong?
I was defining TwitterItem as an inner class of MainPage, when it needed to be a top-level class.
You'll need to pass in an ObservableCollection to listBox1.ItemsSource. Then the UI will update when you set it.
ObservableCollection<TwitterItem> o = new ObservableCollection<TwitterItem>();
foreach(TwitterItem t in tweetItems)
{
o.Add(t);
}
listBox1.ItemsSource = o;
I believe I had the same issue in my app and this fixed it.

Categories

Resources