Develop Reference

C# Windows Phone 8.1 specific Navigation in Listview

Hello i'm new in programming and i making a Football Windows Phone 8.1 Application using Web Services. i created a class Football.cs:
public int Id { get; set; }
public string Team1 { get; set; }
public string Team2 { get; set; }
public string Score { get; set; }
public string Place { get; set; }
public string Stadium { get; set; }
Then i generated a Web API 2 Controller using Entity Framework to create the DataBase and get the data from it.
Then i created a Windows Phone application, in the Mainpage.xaml here's the code :
<Page.Resources>
<DataTemplate x:Key="EmployeeDataTemplate">
<Grid Margin="12,12,12,0"
Width="376">
<TextBlock
FontSize="24"
Text="{Binding Team1}"/>
<TextBlock
FontSize="24"
HorizontalAlignment="Right"
Text="{Binding Team2}"/>
<StackPanel>
<TextBlock
FontSize="18.667"
HorizontalAlignment="Center"
Text="{Binding Score}" />
</StackPanel>
</Grid>
</DataTemplate>
</Page.Resources>
<Page.DataContext>
<Core:MainViewModel/>
</Page.DataContext>
<Grid>
<ListView x:Name="mainListView"
ItemsSource="{Binding EmployeesList}"
ItemTemplate="{StaticResource EmployeeDataTemplate}"
IsItemClickEnabled="True"
ItemClick="listView_ItemClick"/>
</Grid>
then i created a new BasicPage.xaml:
<Page.DataContext>
<Core:MainViewModel/>
</Page.DataContext>
<StackPanel>
<TextBlock Text="{Binding Place}" />
<TextBlock Text="{Binding Stadium}"/>
</StackPanel>
Can you help me please, i'm a beginner and i tried to make it but without success. All i want is when i click in a specific Item in the ListView, the Basic Page will display the Place and the Stadium to ONLY and ONLY to this specific Item, not the first one and not all of them. Thank you very much, i appreciate it

See my answer here, I use the Behaviours Sdk(how to add) in conjunction with a custom converter class to receive the tapped item in the list. I believe this is what you are looking for.

If you are using MVVM Light you can do this with generic RelayCommand<T> like this:
<ListView x:Name="mainListView"
ItemsSource="{Binding EmployeesList}"
ItemTemplate="{StaticResource EmployeeDataTemplate}"
IsItemClickEnabled="True"
Command={Binding ShowMathInfo, Source={StaticResource MainViewModel}}"
CommandParameter="{Binding }"/>
Then in your command execute method you will get item what you clicked on, then you will be able to pass this item to another page or what you need to do with it.

there's no propertie called Command under ListView.
or maybe it's not like this ? am i wrong ? sorry but i'm a really beginner

Bind Bitmap to XAML

In my XAML I have:
<Window.Resources>
<DataTemplate x:Key="CastTemplate">
<DockPanel Width="Auto">
<Image Source="{Binding image}" Width="10" Height="10"/>
<TextBlock Text="{Binding name}"/>
<TextBlock Text="{Binding character}"/>
</DockPanel>
</DataTemplate>
<Window.Resources>
<Grid HorizontalAlignment="Center">
<ItemsControl ItemTemplate="{StaticResource CastTemplate}" ItemsSource="{Binding SelectedItem.castInfoWithPics}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="3" Rows="2"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</Grid>
The binding points to a list of objects with the following properties:
public string name { get; set; }
public string character { get; set; }
public BitmapSource image { get; set; }
In my ViewModel, I assign the image property using:
cast.image = loadBitmap(bitmap);
I am using the loadBitmap function stated here: https://stackoverflow.com/a/1118557/2268507
The problem I'm having is that the image is not being displayed when I run my program. The name and character properties appear however.
I also don't seem to be receiving any Binding errors. Would anyone know what the issue might be?

are you sure you are using INotifyPropertyChangedin your View Model ?
it looks like you are setting your other properties in the constructor and then setting your Bitmap property later on. in that case you must Raise the PropertyChanged Event .

Data Binding in GridView

I'm trying to bind some data to a GridView in Windows 8.1's Hub control.
Currently, I have a DataTemplate set up under Page.Resources as follows:
<DataTemplate x:Key="Standard240x320ItemTemplateFAV">
<Grid HorizontalAlignment="Left" Width="320" Height="240">
<Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
<Image Source="{Binding FavImage}" Stretch="UniformToFill"/>
</Border>
<StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
<TextBlock Text="{Binding FavTitle}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextBlockStyle}" Height="48" Margin="15,0,15,0"/>
</StackPanel>
</Grid>
</DataTemplate>
I then have this HubSection:
<HubSection x:Name="FavHub" Padding="40,60,40,0" >
<DataTemplate>
<GridView
x:Name="itemGridView"
Margin="-4,-4,0,0"
AutomationProperties.AutomationId="ItemGridView"
AutomationProperties.Name="Items In Group"
ItemsSource="{Binding Items}"
ItemTemplate="{StaticResource Standard240x320ItemTemplateFAV}"
SelectionMode="Single"
IsSwipeEnabled="false"
IsItemClickEnabled="True"
ItemClick="ItemView_ItemClick">
</GridView>
</DataTemplate>
</HubSection>
I use this code to add the DataContext:
FavHub.DataContext = new FavData(Constants.getImage("1002"), "No Favourites");
Where the FavData class is:
public class FavData
{
public static string FavImage { get; set; }
public static string FavTitle { get; set; }
public FavData() { }
public FavData(string itemImageSet, string itemNameSet)
{
FavImage = itemImageSet;
FavTitle = itemNameSet;
}
}
However, no data shows up in the HubSection. What am I doing wrong?

You'll need to bind a list, like a List<FavData> or an ObservableCollection<FavData> to the Hub.
Right now, you've got a GridView that among many other attributes, includes initialization of the ItemsSource property. This property is used as the source for a list of items.
<GridView x:Name="itemGridView"
ItemsSource="{Binding Items}"
</GridView>
The binding is specified as {Binding Items} which means that for whatever object is bound currently to the Hub, grab the List stored on the Items property. As you currently had set a single FavData instance to the Hub via the DataContext property, and it did not have a property called Items, there was nothing to display.
So, my suggestion is to create a list of FavData instances and bind that to the Hub instance instead. If you want to directly bind the list rather than store the list in another "parent" object, you'll also need to adjust the Binding to refer to "self" rather than a specific property. For that, you just use the syntax: {Binding}. It just means, "bind to me." So, the GridView will look for the list of items directly on the bound object (the list of FavData).
<GridView x:Name="itemGridView"
ItemsSource="{Binding}"
</GridView>
And in the C#:
List<FavData> favs = new List<FavData>();
favs.Add(new FavData(Constants.getImage("1002"), "No Favourites"));
FavHub.DataContext = favs;

Bind outside ItemsSource of DataTemplate, Windows phone

In my Windows Phone 8 I have LongListSelector and ItemTemplate specified for that. In code behind I set the ItemsSource for this LongListSelector. In item template I want to bind value to outside ItemsSource. How to do that?
<DataTemplate x:Key="template">
<TextBlock Text="{Binding name}"/>
<TextBlock Text="{Binding country}"/>
</DataTemplate>
...
<phone:LongListSelector x:Name="list" ItemTemplate="{StaticResource template}">
</phone:LongListSelector>
C#
string country = "Japan";
this.list.ItemsSource = items;
So how to bind country to outside ItemsSource? The country is accessor in my "code behind" phoneApplicationPage.

It would be best that you make your models so that inside template you have to bind only to that item model.
Anyway it is possible to bind also outside of itemSource:
xaml:
<phone:PhoneApplicationPage.Resources>
<DataTemplate x:Key="ItemTemplate">
<StackPanel>
<TextBlock Text="{Binding Name}"/>
<!-- this binds to the layoutRoot's dataContext, which can be setted to be "code behind" -->
<TextBlock Text="{Binding DataContext.Outside, ElementName=LayoutRoot}"/>
</StackPanel>
</DataTemplate>
</phone:PhoneApplicationPage.Resources>
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot">
<phone:LongListSelector ItemsSource="{Binding Items}"
IsGroupingEnabled="False"
ItemTemplate="{StaticResource ItemTemplate}">
</phone:LongListSelector>
</Grid>
In cs you have of course properties:
public ObservableCollection<Model> Items{get; set;}
public string Outside { get; set; }
Also layoutRoot's datacontext should be setted somewhere in cs:
LayoutRoot.DataContext = this;

Listview bound via ElementName stays empty

I'm stuck again at some data-binding issue.
This time I want to bind a ListView to the SelectedItem of a GridView. I already suceed with this type of data-binding but now my ListView, which should show some details about my selected item in my GridView just stays empty. There are no items in it although they should exist.
The GridView binds just fine at the property in my MainViewModel.Substituting the ElementName attribute with x:Resouces doesn't seem to be an option, because it doesn't work either.
The source view:
<GridView x:Name="gridViewOrderYears"
ItemsSource="{Binding SelectedCustOrders, Mode=TwoWay}"
HorizontalAlignment="Left"
Grid.Row="1"
VerticalAlignment="Top"
Width="316"
Height="63"
Margin="657,316,0,0"
SelectionMode="Single">
<GridView.ItemTemplate>
<DataTemplate>
<Grid>
<Border BorderThickness="1" BorderBrush="Aquamarine">
<StackPanel>
<TextBlock Text="{Binding Year}" FontSize="20"/>
<TextBlock Text="{Binding OrderCount}"/>
</StackPanel>
</Border>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
this View doesnt bind:
<ListView HorizontalAlignment="Left"
Height="231"
Margin="657,401,0,0"
Grid.Row="1"
VerticalAlignment="Top"
Width="316"
DataContext="{Binding SelectedItem, ElementName=gridViewOrderYears}">
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding DoneOrders.Order_Date, ElementName=gridViewOrderYears}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
SelectedCustOrders porperty is an IList<OrderYears>.
OrderYears is following data value object defined in my MainViewModel:
public class OrderYears
{
public int? Year { get; set; }
public IList<Orders> DoneOrders { get; set; }
public int OrderCount { get; set; }
}

I think the problem is in the ListView binding, because you try to bind to a property named "Orders", which does not exist in the OrderYears object. You have a property named DoneOrders which you can bind to (don't confuse the property name with the type of elements inside the list!), but if you bind a TextBlock to a IList you will just get the guid for the IList object.
Try something like this, replacing you ListView with a ListBox (which is enough for what you are trying to do here):
<ListBox DataContext="{Binding ElementName=gridViewOrderYears,
Path=SelectedItem.DoneOrders}"
DisplayMemberPath="Order_Date"/>
There is no need to create a template, the items inside the ListBox will be displayed like a TextBlock. Note that you can benefit from binding to nested properties like MainProperty.SubProperty.
Let me know if this was helpful, bindings can be such a headache when you are starting...

Finally I got it.
After hours of trial-and-error finally substituting DataContext with ItemsSource did the trick... Sometimes things are easier than you think :)