Display several videos in MediaElement - c#

Via an XML file, I have to get a title, the link of a video and a date for display on WindowsPhone 8.
I browse the file with the following code:
foreach (var item in xElement.Elements("channel").Elements("item"))
{
var feed = new Feed
{
Link = item.Element("description").Value,
PubDate = DateTime.Now,
Title = item.Element("title").Value
};
Results.Items.Add(feed);
}
This code retrieves the values ​​correctly. I use the binding to link the two :
<ScrollViewer Grid.Row="1" BorderThickness="0">
<ItemsControl Name="Results" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock TextWrapping="Wrap"
Text="{Binding Path=Title}" />
<MediaElement Name="Media"
Source="{Binding Path=Link}"
Stretch="Fill"
AutoPlay="True" />
<TextBlock Text="{Binding Path=PubDate}" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
The problem is that only two videos are displayed (and not always the same). I don't know where the error is it, because all the data is retrieved, including links to my videos.
I would also add controls to the MediaElement such as : Play, Stop,... But I don't know where to place the code.
I'm sorry for my English ! I'm French. Thanks all.

A while ago I remember reading on MSDN that the number of active MediaElement that are fully supported on Windows Phone is one (this was either 7.0 or 7.1 mind you). I can no longer find this reference on MSDN, but if you search the web, you'll find similar assertions (though with no MSDN quotes or whatever).
Try having just the one and see if it works as you expect, and then try to go up to two.

Related

Trouble loading lots of images from web

I am trying to make a simple instagram feed display with WPF. I have a ListView which is bound to an ObservableCollection of image url's retrieved from the Instagram API. For some reason, I can only load the first 10 or so (even though I am trying to bind more). If I try to load lower resolution images, then it seems to work ok. But I'm not talking about massive images anyway (maybe around 100k each).
Here is some example code with a list of hard coded images from instagram. For me, this only loads the first 10, then misses number 11, then loads number 12. I have no idea why.
XAML:
<ListView x:Name="List" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Hidden" ScrollViewer.CanContentScroll="False">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<Grid Width="250" Height="250" Background="Orange">
<Image Margin="3" Source="{Binding}" Stretch="Uniform" VerticalAlignment="Center" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Code behind:
List<string> content = new List<string>()
{
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23498621_155088151891201_5838888733310451712_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/e15/23421369_1935881716650536_2751759012239245312_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23498900_2424691114423634_1760461413358239744_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23498900_2424691114423634_1760461413358239744_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23347618_263128534210376_920911369891479552_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23421069_1500830839998934_8413516091602501632_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23417348_742804169243503_6556496499100876800_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23347902_2017564028488677_2880579113104441344_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23421331_334537296949861_4296430067371737088_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23421331_334537296949861_4296430067371737088_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23416590_1928818560779337_7080637368553701376_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/sh0.08/e35/p640x640/23421758_491705774540588_6178820534202007552_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23421099_1728264697245367_6448825186568372224_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23416994_133163334113394_1499431022142423040_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23421239_1483718185060885_8134914164545028096_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23280089_1942832749376286_3936575794389712896_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23347674_2006888666245374_7306582919252803584_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23347388_119626992143009_7585283007787827200_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23421865_900301160123071_1326331715420946432_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23421253_148762415872849_1558483017121398784_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/sh0.08/e35/p640x640/23507217_1953269574998281_6711372701967056896_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/sh0.08/e35/p640x640/23507217_1953269574998281_6711372701967056896_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23498098_2009691429314434_8349013357923139584_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/e15/23347679_315062128974030_5091325576380153856_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/sh0.08/e35/p640x640/23421083_1777350415899180_3004366087824343040_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/sh0.08/e35/p640x640/23421083_1777350415899180_3004366087824343040_n.jpg",
"https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/23498903_773821689486761_9202713497564086272_n.jpg"
};
List.ItemsSource = content;
You're running into the maximum connection limit to the same host for your application.
In your app.config file, you can add the following underneath configuration:
<system.net>
<connectionManagement>
<add address="*" maxconnection="1000" />
</connectionManagement>
</system.net>
You can read more about this here. Obviously you should tailor your entry to what your application actually needs.

Any similar "ListView" UI Control in Xamarin.Mac?

I'm planning to design an multiple file downloader app (similar to IDM or Transmission) for macOS based on Aria2 JSON-RPC and C# GUI via Xamarin.Mac. But there is a major issue for UI design. I need a UI control which is similar to "ListView" in XAML.
Basically it's something like in this topic discussed, i.e. I need something equivalent in Xamarin.Mac with this XAML code below:
<ListView x:Name="DownloadItemList">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding DownloadItemTitle}"
Margin="20,0,20,8"
FontSize="24"
FontStyle="Italic"
FontWeight="SemiBold"
Foreground="DarkBlue" />
<TextBlock Text="{Binding DownloadProgressInfo}"
Margin="20,0,20,8"
FontSize="16"
Foreground="DarkGray"
Opacity="0.8" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I also need some data bindings in the UI code if possible. But so far I can't find any similar stuff in Xamarin.Mac. Is there any possible solution like this? Thanks in advance!
You can use NSTableView
static Content :
You can design cells from storyboard, and if required can modify content of these cells at runtime.
Dynamic Content : You can crate template cell at design time (or progrmmatically id requried ), give it identifier and use that cell multiple-time in tableviewd atasource.
You can use something like a table view
Hope this helps.
Link

Accessing values of e.ClickedItem object from C# GridView on Windows Phone 8.1

I'm building a Windows Phone 8.1 App for a client and have run into something I can't source an answer for, hence the question. I apologize in advance as it's probably something obvious and I'm oblivious to it.
I have a GridView bound to a vendor list from my data model. I can select / click a returned value from the Grid as planned.
XAML extract:
<GridView x:Name="VendorsGridView"
ItemsSource="{Binding}"
Grid.Row="1"
Margin="10,8,10,12"
Foreground="White"
SelectionMode="Single"
IsSwipeEnabled="False"
ItemClick="VendorsGridView_ItemClick"
IsItemClickEnabled="True"
ItemTemplate="{StaticResource VendorTemplate}">
</GridView>
</Grid.RowDefinitions>
<TextBlock Text="{Binding StrVendor}"
Name="VNo"
Grid.Row="0"
Margin="0,0,0,0"
VerticalAlignment="Top"
HorizontalAlignment="Center"
FontSize="18"
FontWeight="SemiBold"/>
<TextBlock Text="{Binding StrVName}"
Name="VName"
Grid.Row="1"
Margin="0,0,0,0"
VerticalAlignment="Center"
TextWrapping="Wrap"
FontSize="14"/>
If I examine e.ClickedItem in the debug window I can see the value I am trying to find, (StrVendor or vendor number). The design is then to write this back to a static table for use as a default when looking at other data.
Debug Window Output:
e.ClickedItem
{MOQ_v301.ViewModel.VendorViewModel}
base: {MOQ_v301.ViewModel.VendorViewModel}
IsDirty: true
isDirty: true
StrVendor: "40520"
strVendor: "40520"
StrVName: "Forest Garden PLC"
strVName: "Forest Garden PLC"
My question is how can I get the vendor number captured to a string variable to achieve it?
Because your grid is bound to a model, you are getting 1 item of that model back through the click. So just cast that item to the model and get the Vender number... Not sure what the actual model class is but assuming it's VendorViewModel the code should be: ((VendorViewModel)e.ClickedItem).StrVendor this will give you the actual vendor number.
Best to check if you are actually getting a model so the final code could be as following:
if(e.ClickedItem is VendorViewModel)
{
var vendornr = ((VendorViewModel)e.ClickedItem).StrVendor;
}

json to new listbox item in windows store app C#

I have an app for windows 8 that needs to take a Json string and deseriaizes it into DATACONTRACTS and it will display the information I wish in a Listbox that will have a max height and will scroll if greater than the max height.
The problem that im having it not so much as not being able to do it but rather not knowing how to do it.
So far I can deserialize the Json and I can specify where I want each item to go into the UI but what im trying to do is basically a for each item in the array I want it to make a new Stackpanel formatted with Textblocks that will have the information from the Json. I don't know how to this unfortunately and I don't really know what im searching for to get tutorials on how to do it
This is the code I have that takes the items from the json with a helper class and puts them in the Text of the TextBlocks.
var _FilterSaleList = new FilterSalesList();
var _Sales = await _FilterSaleList.FindSalesbyFilters();
string _SaleName = _Sales.sales[0].name.ToString();
string _SaleDescription = _Sales.sales[0].description.ToString();
string _SaleName1 = _Sales.sales[1].name.ToString();
string _SaleDescription1 = _Sales.sales[1].description.ToString();
int _TotalResults = _Sales.sales.Length;
SaleTitle.Text = _SaleName;
SaleDescription.Text = _SaleDescription;
SaleTitle1.Text = _SaleName1;
SaleDescription1.Text = _SaleDescription1;
This is the XAML code for the Listbox with 2 Stack panels already in it.
<ListBox Grid.Row="1">
<StackPanel Margin="0,0,0,5">
<TextBlock x:Name="SaleTitle" Text="" HorizontalAlignment="Center" Margin="0,0,0,5"/>
<TextBlock x:Name="SaleDescription" Text="" HorizontalAlignment="Center" MaxHeight="40" Margin="0,0,0,5" TextWrapping="Wrap"/>
</StackPanel>
<StackPanel Margin="0,0,0,5">
<TextBlock x:Name="SaleTitle1" Text="" HorizontalAlignment="Center" Margin="0,0,0,5"/>
<TextBlock x:Name="SaleDescription1" Text="" HorizontalAlignment="Center" MaxHeight="40" Margin="0,0,0,5" TextWrapping="Wrap"/>
</StackPanel>
</ListBox>
Below is an image of how I would like it to look.
even though everything works this way like I said I would like it so that each item from the json will make a new stackpanel and display the information as in the image. I don't know what its called when this is done so even a simple hint as to where to look would be great!
http://puu.sh/2biMZ
In XAML there is a very nice feature called Binding, which allows you to simply bind an object or a list of objects to visual element. This way, you don't have to "build" the graphical user interface manually in C# code.
This is a very large topic, so you should probably have a look at what is MVVM, it will help you leverage the power of Binding : http://channel9.msdn.com/Series/Building-Apps-for-Both-Windows-8-and-Windows-Phone-8-Jump-Start/Building-Apps-for-Both-Windows-8-and-Windows-Phone-8-03-Model-View-ViewModel
But for now, what you could is :
1/ Define your ListBox as following, with a DataTemplate for the ItemTemplate property :
<ListBox Grid.Row="1" x:Name="SalesListbox">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,5">
<TextBlock x:Name="SaleTitle" Text="{Binding name}" HorizontalAlignment="Center" Margin="0,0,0,5"/>
<TextBlock x:Name="SaleDescription" Text="{Binding description}" HorizontalAlignment="Center" MaxHeight="40" Margin="0,0,0,5" TextWrapping="Wrap"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The DataTemplate will tell how each item of the list should be rendered. You should also notice how we used Binding for the Text properties in each textblock. It's bound to name and description which are the name of the properties in your model.
And then you can populate your ListBox with your data :
var filterSaleList = new FilterSalesList();
var salesByFilters = await filterSaleList.FindSalesbyFilters();
SalesListbox.ItemsSource = salesByFilters.sales;

Use of DataTemplate

I'm quite new to C# and Windows Phone 7 for that sake, but none the less, I've thrown myself into trying to make a small app for myself. Here's my problem:
I'm trying to set up a DataTemplate that will position my Name and Drinks variables that I've declared in MainPage.xaml.cs. Here's my action when button1 is clicked:
private void button1_Click(object sender, RoutedEventArgs e)
{
string Name = participantName.Text;
int Drinks = 0;
listBox1.Items.Add(Name + Drinks);
}
And here is my DataTemplate from MainPage.xaml
<ListBox Height="Auto" HorizontalAlignment="Stretch" Margin="7,74,0,0" Name="listBox1" VerticalAlignment="Stretch" Width="Auto">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Height="132">
<TextBlock Text="{Binding Path=Name}" FontSize="35" />
<StackPanel Width="370">
<TextBlock Text="{Binding Path=Drinks}" FontSize="35" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The problem is that my data is not shown. It works perfectly without the DataTemplate, but as soon as I use it, my text simply doesn't get through. Your help is very much appreciated.
The template itself is ok. The bindings on the template, though, are currently incorrect.
When you add a new item to the list box, you are just adding a plain old string (which is currently missing a space, BTW.) Your bindings, though, expect the object in the list to have a Name property and a Drinks property, which of course the string class does not have.
The usual solution here is to logically separate your data model from your presentation, by creating a class to store the data itself (probably PersonDrink, with the appropriate Name and Drinks properties) and then adding those objects to the list.
You should read up on the MVVM pattern, as it provides an excellent way to ensure that changes in your data are reflected in your view, and visa versa.
http://amarchandra.wordpress.com/2011/12/18/binding-multiple-object-in-wp7-using-listbox/
Here is a sample for binding data using a datatemplate. I hope this might help you.

Categories