Develop Reference

JumpList using SemanticZoom not working in Windows Phone 8.1

I followed the tutorial on this page: http://modernography.wordpress.com/2014/04/26/jumplists-in-windows-phone-8-1/
I have a collectionviewsource:
// artistdata
public CollectionViewSource ArtistList
{
get
{
var data = App.musicdata.Artists;
var groups = data.ToAlphaGroups(x => x.name);
_ArtistList = new CollectionViewSource();
_ArtistList.Source = groups; //groups is the result of using my extension methods above
_ArtistList.IsSourceGrouped = true;
return _ArtistList;
}
}
Which I bind to my XAML:
<PivotItem x:Name="artists" Margin="10,0">
<SemanticZoom Style="{StaticResource AlphaJumpListStyle}">
<SemanticZoom.ZoomedInView>
<ListView Background="Transparent" ItemsSource="{Binding ArtistList.View}" Loaded="ListviewLoaded">
<ListView.GroupStyle>
<GroupStyle HeaderTemplate="{StaticResource AlphaGroupHeaderTemplate}" HeaderContainerStyle="{StaticResource JumpListListHeaderContainerStyle}" HidesIfEmpty="True" />
</ListView.GroupStyle>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Grid.Column="1" Margin="10,5" Tapped="ArtistSelected">
<TextBlock FontFamily="Segoe WP" FontSize="22" Foreground="White" Text="{Binding name}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="{Binding ActualWidth, ElementName=parentElementName}"/>
<TextBlock FontFamily="Segoe WP" FontWeight="Light" FontSize="17" Foreground="#7FFFFFFF" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,-5,0,0">
<Run Text="{Binding amountofalbums}"/>
<Run Text="albums"/>
</TextBlock>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</SemanticZoom.ZoomedInView>
<SemanticZoom.ZoomedOutView>
<GridView ItemsSource="{Binding ArtistList.View.CollectionGroups}" Style="{StaticResource AlphaJumpListPickerStyle}" />
</SemanticZoom.ZoomedOutView>
</SemanticZoom>
</PivotItem>
It all displays correctly, I can open and close the JumpList.
BUT, when I tap on a letter in the zoomedoutview, the zoomedinview doesn't jump to that letter. Instead, it stays where it was?
I can't find the cause for this problem. Maybe the problem is that the SementicZoom is inside a Pivot?

I think the issue is caused because ListView and GridView are obtaining different instances of CollectionView. As the example shows, you should cache the first created instance.
The code should be:
public CollectionViewSource ArtistList
{
get
{
if(_ArtistList == null)
{
var data = App.musicdata.Artists;
var groups = data.ToAlphaGroups(x => x.name);
_ArtistList = new CollectionViewSource();
_ArtistList.Source = groups; //groups is the result of using my extension methods above
_ArtistList.IsSourceGrouped = true;
}
return _ArtistList;
}
}

How to update ListBoxItem property

I want to update DownloadingSpeed Property which is binded to TextBox in a ListBoxItem. I am generating ListBoxItems in c#. Please guide me how do i update Binding Content of TextBoxes within a ListItemBox in C#.
WPF LisBox Code
<ListBox Width="Auto"
Name="WebsiteList"
MouseUp="SelectedListItem"
SelectedIndex="0"
Grid.Column="1"
Grid.Row="2"
Grid.RowSpan="2"
Margin="0,0,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Width="920">
<StackPanel Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<Grid Width="920">
<TextBlock FontWeight="Bold" FontSize="18" Width="Auto">
<Hyperlink NavigateUri="http://google.com" FontStyle="Italic">
<Label Content="{Binding WebsiteTitle}" /><Label FontSize="10" Margin="0,0,0,3" Content="{Binding DirectorySize}" />
</Hyperlink>
</TextBlock>
<TextBlock Width="0" TextAlignment="right">
<TextBlock Visibility="Hidden" Text="{Binding DownloadID}"/>
<TextBlock Visibility="Hidden" Text="{Binding DirectoryPath}"/>
<TextBlock Visibility="Hidden" Text="{Binding CurrentTime}"/>
<TextBlock Visibility="Hidden" Text="{Binding CurrentDate}"/>
<TextBlock Visibility="Hidden" Text="{Binding GivenUrl}"/>
</TextBlock>
</Grid>
</StackPanel>
<StackPanel Orientation="Horizontal">
<Grid Width="920">
<ProgressBar Name="progress1" Maximum="100" Minimum="0" Value="30" Background="#FFF" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}}, Path=Width}" Height="10" />
</Grid>
</StackPanel>
<StackPanel Orientation="Horizontal">
<Grid Width="920">
<TextBlock HorizontalAlignment="Left" Width="Auto">Status: <TextBlock Text="{Binding Status}"/></TextBlock>
<TextBlock Width="Auto" TextAlignment="right">
<TextBlock Text="Downloading Speed: "/>
<TextBlock Name="DownloadingSpeed" Text="{Binding DownloadingSpeed}"/>
</TextBlock>
</Grid>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
In MainWindow.xaml.cs
private void GenerateList()
{
List<Download> WebsitesList = new List<Download>();
WebsitesList.Add(new Download() {DownloadID = ID, WebsiteTitle = WebTitle, Status = WebStatus, CurrentTime = CurrentTime,CurrentDate = CurrentDate, DownloadingSpeed = DownloadSpeed, DirectoryPath = path, DirectorySize = helper.GetDirectorySize(path),GivenUrl = url });
WebsiteList.ItemsSource = WebsitesList;
}
//get download speed and update DownloadingSpeed
private void updateDownloadingSpeed(object sender, EventArgs e)
{
interfaceStats = NetworkInterface.GetAllNetworkInterfaces()[0].GetIPv4Statistics();
downloadspeed = (interfaceStats.BytesReceived - previousbytesreceived) / 1024;
previousbytesreceived = NetworkInterface.GetAllNetworkInterfaces()[0].GetIPv4Statistics().BytesReceived;
Download.DownloadingSpeed = Math.Round(downloadspeed, 2) + " KB/s"; //Rounding to 2 decimal places and save in DownloadSpeed Property
}
In Download.cs
public class Download : INotifyPropertyChanged
{
private string _DownloadingSpeed = "0 kb/s";
public string DownloadingSpeed
{
get { return _DownloadingSpeed; }
set
{
if (_DownloadingSpeed == value)
return;
_DownloadingSpeed = value;
this.OnPropertyChanged("DownloadingSpeed");
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string propertyName)
{
if (this.PropertyChanged != null)
this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}

Add UpdateSourceTrigger for TextBlock.
<TextBlock Name="DownloadingSpeed" Text="{Binding DownloadingSpeed, UpdateSourceTrigger=PropertyChanged}"/>

You might find that your code works if you use WPF properly by defining properties and declaring XAML correctly. It is customary to have an ObservableCollection<T> property that you data bind to the UI collection control. You would then data bind it to the ItemsSource property of the control:
<ListBox ItemsSource="{Binding Items}" ... />
Then, when you want to update any properties of the items, you need to set the properties of the items. This:
Download.DownloadingSpeed = Math.Round(downloadspeed, 2) + " KB/s";
... is not setting the property of an item from the collection. To do that, you'd need to do something like this:
// Use whatever filter you want to find the correct item from the collection
Download downloadInstance = Items.Where(d => d.Name == "SomeName").First();
downloadInstance.DownloadingSpeed = Math.Round(downloadspeed, 2) + " KB/s";

Telling a pivot page which page to open on via xaml.cs

I navigate to my pivote page by doing this
this.NavigationService.Navigate(new Uri("/PivotScreen.xaml", UriKind.Relative));
Is there a simple way to tell it which pageto open on it there are 5 pages on that pivot?
Many Thanks,
-Code

A simple thisPivot.SelectedIndex = 0; should do it.
Edit
I will add code to clarify.
.xaml file
<controls:Pivot Name="thisPivot" Title="MY APPLICATION">
<!--Pivot item one-->
<controls:PivotItem Header="first">
<!--Double line list with text wrapping-->
<ListBox x:Name="FirstListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,17" Width="432" Height="78">
<TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</controls:PivotItem>
<!--Pivot item two-->
<controls:PivotItem Header="second">
<!--Triple line list no text wrapping-->
<ListBox x:Name="SecondListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,17">
<TextBlock Text="{Binding LineOne}" TextWrapping="NoWrap" Margin="12,0,0,0" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock Text="{Binding LineThree}" TextWrapping="NoWrap" Margin="12,-6,0,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</controls:PivotItem>
</controls:Pivot>
Code behind
// Constructor
public MainPage()
{
InitializeComponent();
// Set the data context of the listbox control to the sample data
DataContext = App.ViewModel;
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
}
// Load data for the ViewModel Items
private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
thisPivot.SelectedIndex = 1;
if (!App.ViewModel.IsDataLoaded)
{
App.ViewModel.LoadData();
}
}

Windows Phone 7 Navigation passing parameter

I have a list box like below.
<ListBox x:Name="CouponListBox" ItemsSource="{Binding Item}" SelectionChanged="CouponListBox_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding MerchantImage}" Height="73" Width="73" VerticalAlignment="Top" Margin="0,10,8,0"/>
<StackPanel Width="130">
<TextBlock Text="{Binding CustomerName}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
<TextBlock Text="{Binding MerchantName}" TextWrapping="Wrap" FontSize="20" Foreground="#FFC4C4C4" Padding="10" />
<TextBlock Text="{Binding Distance}" TextWrapping="Wrap" FontSize="16" Foreground="#FFC4C4C4" Padding="10" />
<TextBlock Text="{Binding DistanceInMinutes}" TextWrapping="Wrap" FontSize="16" Foreground="#FFC4C4C4" Padding="10" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
And I have a Change Event in .cs file which is
private void CouponListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
// If selected index is -1 (no selection) do nothing
if (CouponListBox.SelectedIndex == -1)
return;
// Navigate to the new page
System.Diagnostics.Debug.WriteLine("this is a test::" + CouponListBox.SelectedItem.ToString());
NavigationService.Navigate(new Uri("/DetailsPage.xaml?selectedItem=" + CouponListBox.SelectedIndex, UriKind.Relative));
// Reset selected index to -1 (no selection)
CouponListBox.SelectedIndex = -1;
}
In DetailsPage I could able to print the item Index. But What I want is Customer ID passed in the URL like
"/DetailsPage.xaml?selectedItem=" + CouponListBox.SelectedIndex + "&customerId=" + couponId
Can anyone please tell me where I should include customerId in my XAML file? and that who can I call it in the function.
Thank you,
Karthik

Use this:
if (this.NavigationContext.QueryString.ContainsKey("customerId"))
{
string customerId = this.NavigationContext.QueryString["customerId"];
}
if (this.NavigationContext.QueryString.ContainsKey("selectedItem"))
{
string selectedItem = this.NavigationContext.QueryString["selectedItem"];
}
in the usercontrol's Loaded or other appropriate event.

Pivot Control - issue with data binding

I've checked various examples of Pivots and think my implementation should work but it's having an issue.
Here is the XAML:
<controls:Pivot Title="Results" ItemsSource="{Binding baskets}">
<controls:Pivot.HeaderTemplate>
<DataTemplate>
<Grid x:Name="grid">
<TextBlock Text="{Binding basketName}" />
</Grid>
</DataTemplate>
</controls:Pivot.HeaderTemplate>
<controls:Pivot.ItemTemplate>
<DataTemplate>
<Grid>
<StackPanel Orientation="Vertical">
<TextBlock TextWrapping="Wrap" Text="{Binding basketItems.Count}"/>
</StackPanel>
</Grid>
</DataTemplate>
</controls:Pivot.ItemTemplate>
</controls:Pivot>
and the code-behind:
public ObservableCollection<Basket> baskets = new ObservableCollection<Basket>();
public pivotPage()
{
InitializeComponent();
//for testing purposes
baskets.Add(new Basket());
baskets.Add(new Basket());
}
The page renders blank, what am I doing wrong?

There is no indication in your code that you have set your DataContext. Try the following:
public ObservableCollection<Basket> baskets = new ObservableCollection<Basket>();
public pivotPage()
{
InitializeComponent();
this.DataContext = baskets;
//for testing purposes
baskets.Add(new Basket());
baskets.Add(new Basket());
}