We Keep Coding

TextBlock with text highlighting

Faced the need to select a fragment of text in TextBlock, namely certain keywords on which the ListBox was filtered, this text block itself and containing
XAML variant, title property is not bound
<ListBox Name="ProcedureList" ItemsSource="{Binding Path=ProceduresView.View}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Name="ProcedurePanel" PreviewMouseDown="ProcedurePanel_OnPreviewMouseDown">
<DockPanel Width="{c:Binding ElementName=MainPanel, Path=Width-40}">
<!--<TextBlock Name="MainText" TextWrapping="Wrap" FontSize="16" Text="{Binding Path=title}" HorizontalAlignment="Left" />-->
<htb:HighlightTextBlock Name="MainText" TextWrapping="Wrap" FontSize="16" Text="{Binding Path=title}" HorizontalAlignment="Left">
<htb:HighlightTextBlock.HighlightRules>
<htb:HighlightRule
IgnoreCase="{Binding IgnoreCase, Source={StaticResource SourceVm}}"
HightlightedText="{Binding Path=title, Converter={StaticResource getFilter}}">
<htb:HighlightRule.Highlights>
<htb:HighlightBackgroung Brush="Yellow"/>
</htb:HighlightRule.Highlights>
</htb:HighlightRule>
</htb:HighlightTextBlock.HighlightRules>
</htb:HighlightTextBlock>
</DockPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
A component written by our compatriot with open source is used
Component
Description of component
The commented code is an old TexBlock with no selection
The new HighlightTextBlock component perfectly selects the text if you use a static resource, as in the example, but when I try to bind it to the current text it can not find this field :(, I'm new in WPF help figure it out
HightlightedText="{Binding Path=title, Converter={StaticResource getFilter}}"
How correctly to anchor this property to title?
DataContext structure
public ObservableCollection<Procedure> Procedures { set; get; }
public CollectionViewSource ProceduresView { set; get; } = new CollectionViewSource();
....
Procedures = new ObservableCollection<Procedure>();
ProceduresView.Filter += Procedures_Filter;
ProceduresView.Source = Procedures;
....
public class Procedure : ObservableObject
{
....
public String title { get; set; }
....
}
....
// Simple filtering
void Procedures_Filter(object sender, FilterEventArgs e)
{
Procedure procedure = (Procedure) e.Item;
Boolean flag = false;
if (!string.IsNullOrEmpty(filter))
{
Setting.Filter sfilter = new Setting.Filter();
sfilter.type = "искать везде";
sfilter.text = filter;
ObservableCollection<Setting.Filter> arr = new ObservableCollection<Setting.Filter>();
arr.Add(sfilter);
if (Utils.AssignedProcedureFromFilter(procedure, arr)) flag = true;
}
else flag = true;
e.Accepted = flag;
}
Video with problem description
Simplified project emitting my functional
On the Russian-speaking forum they explained to me that:
Your case, in fact, is more serious. DataContext you, apparently, the
right one. But your Binding expression is inside the HighlightRules
property setter, which is not part of the visual tree (because it is
not available as a Child element of your control). And elements that
are not inside the visual tree, participate in bindings are only
limited: they do not inherit DataContext, nor access by name through
ElementName. As a solution, bind to an element via x: Reference. In my
(heavily cut) test case, HightlightedText = "{Binding Path =
DataContext.title, Source = {x: Reference MainText}} is triggered."
But, if directly replaced by this, a strange error works: 'Can not
call MarkupExtension. ProvideValue because of a cyclic dependency. The
properties inside the MarkupExtension can not reference objects that
reference the MarkupExtension result.
The workaround for the error was found here: you need to put your element in resources. We get this:
XAML, modified according to the recommendations
<ListBox Name="ProcedureList" ItemsSource="{Binding Path=ProceduresView.View}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Name="ProcedurePanel" PreviewMouseDown="ProcedurePanel_OnPreviewMouseDown">
<DockPanel Width="{c:Binding ElementName=MainPanel, Path=Width-40}">
<!--<TextBlock Name="MainText" TextWrapping="Wrap" FontSize="16" Text="{Binding Path=title}" HorizontalAlignment="Left" />-->
<htb:HighlightTextBlock Name="MainText" TextWrapping="Wrap" FontSize="16"
Text="{Binding Path=title}" HorizontalAlignment="Left">
<htb:HighlightTextBlock.Resources>
<htb:HighlightRule x:Key="HR"
IgnoreCase="{Binding IgnoreCase, Source={StaticResource SourceVm}}"
HightlightedText="{Binding Path=DataContext.title, Source={x:Reference MainText}, Converter={StaticResource getFilter}}">
<htb:HighlightRule.Highlights>
<htb:HighlightBackgroung Brush="Yellow"/>
</htb:HighlightRule.Highlights>
</htb:HighlightRule>
</htb:HighlightTextBlock.Resources>
<htb:HighlightTextBlock.HighlightRules>
<htb:HighlightRulesCollection>
<StaticResource ResourceKey="HR"/>
</htb:HighlightRulesCollection>
</htb:HighlightTextBlock.HighlightRules>
</htb:HighlightTextBlock>
</DockPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I was given advice on the restructuring of XAML, through resources, this partially solved the problem (I successfully got the title text in the converter), but the element ceased to perform its functions (allocation) During the discussion, it was suggested that the component itself should be finalized
#iRumba: In theory, the whole trick should not be necessary if you put
the HighlighRule collection (also) in a visual tree. Then the
DataContext will be automatically inherited and on idea the binding
through ElementName too will work.
#iRumba: I do not remember exactly. It seems, it is necessary to
specify to add all HighlightRule as LogicalChildren (for this purpose
on idea it is necessary to redefine protected internal override
IEnumerator LogicalChildren). This is a complicated, advanced
technique, yes.
Sorry for Google Translator

Found a solution
public class SearchHightlightTextBlock : TextBlock
{
public SearchHightlightTextBlock() : base() { }
public String SearchText
{
get { return (String)GetValue(SearchTextProperty); }
set { SetValue(SearchTextProperty, value); }
}
private static void OnDataChanged(DependencyObject source,
DependencyPropertyChangedEventArgs e)
{
TextBlock tb = (TextBlock)source;
if (tb.Text.Length == 0)
return;
string textUpper = tb.Text.ToUpper();
String toFind = ((String)e.NewValue).ToUpper();
int firstIndex = textUpper.IndexOf(toFind);
String firstStr = "";
String foundStr = "";
if (firstIndex != -1)
{
firstStr = tb.Text.Substring(0, firstIndex);
foundStr = tb.Text.Substring(firstIndex, toFind.Length);
}
String endStr = tb.Text.Substring(firstIndex + toFind.Length,
tb.Text.Length - (firstIndex + toFind.Length));
tb.Inlines.Clear();
tb.FontSize = 16;
var run = new Run();
run.Text = firstStr;
tb.Inlines.Add(run);
run = new Run();
run.Background = Brushes.Yellow;
run.Text = foundStr;
tb.Inlines.Add(run);
run = new Run();
run.Text = endStr;
tb.Inlines.Add(run);
}
public static readonly DependencyProperty SearchTextProperty =
DependencyProperty.Register("SearchText",
typeof(String),
typeof(SearchHightlightTextBlock),
new FrameworkPropertyMetadata(null, OnDataChanged));
}
Use
<parser:SearchHightlightTextBlock SearchText="{Binding Path=title, Converter={StaticResource getFilter}}" Text="{Binding title}"/>

Trying to keep five set of image(png format) in continous animation

I'm trying to keep five set of image(png format) in continuous animation which should occupy full screen and after clicking on that popup it should disappear.
There is same image with different position its feel like it is moving up and down continously. In the below code I have used only one image "good_job.png" as popup .But how to use five different image to show in motion up and down.Any help would be appreciated.
Xaml
<RelativePanel x:Name="contentPanel" Grid.Row="1">
<Canvas RelativePanel.AlignTopWithPanel="True">
<Popup x:Name ="ppup" IsOpen = "False" IsLightDismissEnabled = "True"
Width="420" VerticalAlignment="Top"
>
<Image Source = "Assets/good_job.png" Canvas.ZIndex="1" Width="420" />
</Popup>
<Popup x:Name ="ppup1" IsOpen = "False" IsLightDismissEnabled = "True"
Width="320" VerticalAlignment="Center">
<Image Source = "Assets/wrong_ans.png" Canvas.ZIndex="1" Width="420" />
</Popup>
</Canvas>
</RelativePanel>
<Image x:Name="image1" Source="Assets/LearnColor/Object/ob_0_0.png" Height="150" Width="160" RelativePanel.AlignLeftWithPanel="True" Margin="30,40,0,0" Tapped="image1Tap" d:LayoutOverrides="Width, LeftMargin, RightMargin" />
C# Code
if ((image1.Source as BitmapImage).UriSource == new Uri("ms-appx:///Assets/LearnColor/Object/ob_0_0.png", UriKind.Absolute) && (objNameWritten1.Text == "Banana"))
{
ppup.Height = Window.Current.Bounds.Height;
ppup.IsOpen = true;
mediaElement1.Source = new Uri("ms-appx:///Audio/wow good job.mp3");
mediaElement1.AutoPlay = true;
}

Note: This answers is untested and quickly thrown together. I submitted it because I was asked in the comments.
First create a way to loop through the images.
private int CurrentImageId = 0;
private List<string> Images = new List<string>() { "image1", "image2", "image3", "image4", "image5" };
private string NextImage() {
CurrentImageId = (CurrentImageId + 1) % 5;
return Images[CurrentImageId];
}
Then use a timer to reasign the ImageSource at an interval.
var timer = new Timer(100);
timer.Elapsed += (sender, args) => Images.ImageSource = NextImage();
timer.Start();

Binding data in stackpanel

I use WPF and c#.
I have an issue regarding binding and visibility.
I have a tree which is bound to obsCol1. Then I have a form in a grid whose datacontext is set to `
DataContext="{Binding ElementName=tree, Path=SelectedItem}">`
Inside that form I have 3 identical subforms if you will. Each of the 3 subforms is a groupbox inside of which is a horizontal stack panel in which there is a label textbox label textbox button.
<GroupBox Grid.Column="3" Grid.Row="8" Grid.ColumnSpan="3">
<GroupBox.Header>Reklama 1</GroupBox.Header>
<StackPanel Name="Rek1" DataContext="Reklame" Orientation="Horizontal">
<Label Grid.Column="3" Grid.Row="10" HorizontalAlignment="Right" VerticalAlignment="Top">Datum post/zam</Label>
<xctk:DateTimePicker x:Name="dtReklama1"
Grid.Row="10"
Grid.Column="4"
Height="25"
Margin="3"
Padding="3"
VerticalAlignment="Top"
HorizontalAlignment="Left"
Width="150" Value="{Binding Path=Opr_brendiranje}"/>
<Label Grid.Column="3" Grid.Row="8" HorizontalAlignment="Right" VerticalAlignment="Top">Dimenzija</Label>
<extToolkit:WatermarkTextBox x:Name="Reklama" Grid.Row="8"
Grid.Column="4"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Width="100"
Height="25"
Padding="3"
Margin="3"
AcceptsReturn="True"
Validation.ErrorTemplate="{StaticResource ValidationTemplate}"
Validation.Error="Validation_Error">
<extToolkit:WatermarkTextBox.Watermark>
<TextBox Text="Reklama" Margin="4,2,2,0" FontWeight="Regular" Foreground="Silver" BorderThickness="0"/>
</extToolkit:WatermarkTextBox.Watermark>
<extToolkit:WatermarkTextBox.Text>
<Binding Path="RekDimenzije" UpdateSourceTrigger="PropertyChanged" NotifyOnValidationError="True"/>
</extToolkit:WatermarkTextBox.Text>
</extToolkit:WatermarkTextBox>
<Button Grid.Column="5" Grid.Row="9" Height="20" Width="15" Click="Dodaj_Reklamu" VerticalAlignment="Top" FontWeight="Bold" Margin="5" >+</Button>
</StackPanel>
</GroupBox>
So now I need to bind this but the issue is that these subforms use a different class from the form itself. They are an entity in and of itself. So I was wondering if there was any way to bind them independently somehow like itemsource the groupbox or the stack panel or soemthing. I tried using itemscontrol and binding to it but that did not work it would bind the itemsource but if the itemsource was empty the control would dissapear therefore not allowing the user to add it.
Any help would be appreciated.
Update:
Ok so I have a single usercontrol.
On the left side is a tree that uses a HierarchicalDataTemplate that is bound to 2 different classes one of which OrgSredstva is OrgClass with Sredstva class contained within.
<TreeView.ItemTemplate>
<HierarchicalDataTemplate ItemsSource="{Binding Path=Org_Sredstva}">
<HierarchicalDataTemplate.ItemContainerStyle>
<Style TargetType="{x:Type TreeViewItem}">
<Setter Property="Focusable" Value="False"/>
</Style>
</HierarchicalDataTemplate.ItemContainerStyle>
<TextBlock Text="{Binding Path=Organizacije_Naziv}"/>
<HierarchicalDataTemplate.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=Ossr_Naziv}"/>
</DataTemplate>
</HierarchicalDataTemplate.ItemTemplate>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
This all works as complicated as it sounds the tree works fine.
On the right side is a grid that like i described above has datacontext set to whatever is selected in the tree. I need this so that when the selection changes in the tree the form changes with it. The issue is that neither of the classes the tree is bound to is the class the form should be bound to. So the grid can't find the data because the textbox bindings aren't in that observable collection but another one. The way I solved this is to bind every textbox.text property in codebehind so
public void OdabranoDrvo()
{
OdabranaOrg = this.View.tree.SelectedItem as Organizacije;
if (OdabranaOrg != null)
{
string orgId = OdabranaOrg.Organizacije_Sifra;
IEnumerable<Opremljenost> odabranaOpr = from fn in _oprema
where fn.Opr_org_sifra == orgId
select fn;
var ob = new ObservableCollection<Opremljenost>(odabranaOpr);
if (ob.Count > 0)
{
foreach (Opremljenost opr in odabranaOpr)
{
this.View.Povrsina.Text = opr.Opr_Povrsina.ToString();
this.View.RadnoVrijeme.Text = opr.Opr_RadnoVrijeme;
if (opr.Opr_Vlasnik == 1)
{
this.View.LutRad.IsChecked = true;
this.View.ImeVlasnika.IsReadOnly = true;
}
else
{
this.View.LutRad.IsChecked = false;
this.View.ImeVlasnika.IsReadOnly = false;
}
this.View.ImeVlasnika.Text = opr.Opr_ime_vlasnik;
if (opr.Opr_brojilo == 1)
{
this.View.Brojilo.IsChecked = true;
}
else
{
this.View.Brojilo.IsChecked = false;
}
if (opr.Opr_ventilacija == 1)
{
this.View.Ventilacija.IsChecked = true;
}
else
{
this.View.Ventilacija.IsChecked = false;
}
this.View.dtBrendiranje.Value = opr.Opr_brendiranje;
this.View.dtKrecenje.Value = opr.Opr_krecenje;
this.View.Napomena.Text = opr.Opr_napomena;
this.View.BrojAparata.Text = opr.Opr_broj_aparata.ToString();
this.View.BrojRuleta.Text = opr.Opr_broj_ruleta.ToString();
this.View.UkupanBrojKlima.Text = opr.Opr_uku_br_klima.ToString();
this.View.BrojKlimaLutrija.Text = opr.Opr_br_kl_lut.ToString();
this.View.UkupanBrojTv.Text = opr.Opr_uku_broj_tv.ToString();
this.View.BrojTvLutrija.Text = opr.Opr_broj_tv_lut.ToString();
this.View.BrojTvPartneri.Text = opr.Opr_broj_tv_partneri.ToString();
this.View.StrujnaSnaga.Text = opr.Opr_struja_ang_snaga.ToString();
_slikeOpr = Ap.GlavniRepository.UcitajSlikeZaOpremu(opr.Opr_Id);
this.View.Thumbnails.ItemsSource = _slikeOpr;
_reklame = Ap.GlavniRepository.UcitajReklameZaOpremu(opr.Opr_Id);
int i = _reklame.Count();
if (i == 2)
{
this.View.Rek2.Visibility = Visibility.Visible;
this.View.Rek3.Visibility = Visibility.Collapsed;
}
else if (i == 3)
{
this.View.Rek2.Visibility = Visibility.Visible;
this.View.Rek3.Visibility = Visibility.Visible;
}
else
{
this.View.Rek2.Visibility = Visibility.Collapsed;
this.View.Rek3.Visibility = Visibility.Collapsed;
}
this.View.Reklame.DataContext = _reklame;
}
}
else
{
this.View.Povrsina.Text = "0";
this.View.RadnoVrijeme.Text = String.Empty;
this.View.LutRad.IsChecked=false;
this.View.ImeVlasnika.Text = String.Empty;
this.View.Brojilo.IsChecked = false;
this.View.Ventilacija.IsChecked = false;
this.View.dtBrendiranje.Value = DateTime.Now;
this.View.dtKrecenje.Value = DateTime.Now;
this.View.Napomena.Text = String.Empty;
this.View.BrojAparata.Text = "0";
this.View.BrojRuleta.Text = "0";
this.View.UkupanBrojKlima.Text = "0";
this.View.BrojKlimaLutrija.Text = "0";
this.View.UkupanBrojTv.Text = "0";
this.View.BrojTvLutrija.Text = "0";
this.View.BrojTvPartneri.Text = "0";
this.View.StrujnaSnaga.Text = "0";
this.View.Thumbnails.ItemsSource = null;
this.View.Rek2.Visibility = Visibility.Collapsed;
this.View.Rek3.Visibility=Visibility.Collapsed;
}
}
}
The original question i resolved by creating a new grid inside my preexisting grid and just setting the data context for that inner grid to what I needed it to be. Now I find that all the bindings seem to work at least on reading from database, haven't tested inserting into database yet.
I realise this is all very ugly but I couldn't figure out a way to actually bind it while it still working as it should...

Telerik RadJumpList using DataVirtualizationMode.Automatic

I have a problem where im trying to use a Telerik Jump List with DataVirtualizationMode.Automatic, but i can't get it to work. The reason why i want to use this, is because i want my app to only download the data(games) which is in the current view of the Jump List control and not the whole data everytime. For example if i have searched for "Batman", and its returning 50 games, i don't want it to download and load all the games, only those i can see in the Jump List control.
Here is a sample of using DataVirtualizationMode.Automatic from Telerik, but i couldn't get it to work with my app: http://www.telerik.com/help/windows-phone/raddataboundlistbox-features-datavirtualization-automatic.html
Below is my Jump List control which i want to use with data virtualization.
MainPage.xaml:
<phone:PivotItem Header="Browse">
<Grid>
<telerikPrimitives:RadTextBox Name="txtSearch" HorizontalAlignment="Left" VerticalAlignment="Top" Height="80" Width="390"/>
<telerikPrimitives:RadImageButton Name="imgBtnSeachGame" VerticalAlignment="Top" HorizontalAlignment="Right" ButtonShape="Ellipse" BorderThickness="2" Margin="0,8,0,0" Click="imgBtnSeachGame_Click"></telerikPrimitives:RadImageButton>
<Controls:RadJumpList Name="jlGameList" ItemsSource="{Binding}" Tap="jlGameList_Tap" Margin="0,90,0,0" DataVirtualizationMode="Automatic">
<Controls:RadJumpList.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="20"></RowDefinition>
</Grid.RowDefinitions>
<Border Grid.Row="0" Background="{StaticResource PhoneAccentBrush}"
Padding="{StaticResource PhoneTouchTargetOverhang}"
Margin="0,0,0,0">
<TextBlock Name="tblGameTitle" Style="{StaticResource PhoneTextGroupHeaderStyle}" ManipulationStarted="tblGameTitle_ManipulationStarted" ManipulationCompleted="tblGameTitle_ManipulationCompleted">
<Run Text="{Binding GameTitle}"></Run>
</TextBlock>
</Border>
<Grid Background="#242424" Grid.Row="1">
<Image Name="imgGameList" Margin="0,0,0,0" Stretch="Fill" HorizontalAlignment="Left" VerticalAlignment="Top" Height="96" Width="96">
<Image.Source>
<BitmapImage UriSource="{Binding BoxArtFrontThumb}"
CreateOptions="BackgroundCreation" DecodePixelHeight="96" DecodePixelWidth="96" />
</Image.Source>
</Image>
<TextBlock Margin="110,0,0,0" Text="Platform" FontWeight="Bold" TextWrapping="Wrap" Foreground="YellowGreen" FontSize="{StaticResource PhoneFontSizeNormal}"/>
<TextBlock Name="txtPlatform" Margin="110,20,0,0" Text="{Binding Platform}"></TextBlock>
<TextBlock Text="Release Date" FontWeight="Bold" Margin="110,46,0,0" Foreground="YellowGreen" FontSize="{StaticResource PhoneFontSizeNormal}"/>
<TextBlock Name="txtReleaseDate" Margin="110,66,0,0" Text="{Binding ReleaseDate}"></TextBlock>
<!--</StackPanel>-->
</Grid>
<Grid Grid.Row="2"></Grid>
</Grid>
</DataTemplate>
</Controls:RadJumpList.ItemTemplate>
</Controls:RadJumpList>
</Grid>
</phone:PivotItem>
Below is where i bind my DataContext to my GetGamesListItems ObservableCollection in my GameData class. The imgBtnSearchGame_Click event method is being called when a user have typed for example "Batman" in my textbox txtSearch and tapped the button, it will then send the text to my GetGamesListData method.
MainPage.cs:
GameData gd = new GameData();
public MainPage()
{
InitializeComponent();
jlGameList.DataContext = gd.GetGamesListItems;
}
private void imgBtnSeachGame_Click(object sender, RoutedEventArgs e)
{
if (!string.IsNullOrEmpty(txtSearch.Text))
{
gd.GetGamesListData(txtSearch.Text, "", "");
}
}
Below is where i download the data in XML for the game name searched for. For example if it is "Batman" it will find and return all games with "Batman". The "BoxArtFrontThumb" Property is where im storing all the images for each game and is using async, because sometimes there can be quite alot of images it has to download and show.
GameData.cs
public void GetGamesListData(string name, string platform, string genre)
{
var webClient = new WebClient();
webClient.DownloadStringCompleted += GetGamesListRequestCompleted;
webClient.DownloadStringAsync(new Uri("http://thegamesdb.net/api/GetGamesList.php?name=" + name));
}
private async void GetGamesListRequestCompleted(object sender, DownloadStringCompletedEventArgs e)
{
if (e.Error == null)
{
GetGamesListItems.Clear();
var feedXml = XDocument.Parse(e.Result);
var gameDataTasks = feedXml.Root.Descendants("Game").Select(
async x => new GetGamesList
{
ID = (int)x.Element("id"),
GameTitle = (string)x.Element("GameTitle"),
ReleaseDate = (string)x.Element("ReleaseDate") ?? "N/A",
Platform = (string)x.Element("Platform") ?? "N/A",
BoxArtFrontThumb = new Uri(await GetBoxArtFrontThumbAsync((int)x.Element("id")), UriKind.RelativeOrAbsolute),
}).ToList();
var gameData = await Task.WhenAll(gameDataTasks);
foreach (var item in gameData)
{
GetGamesListItems.Add(item);
}
}
}
Below is where its finding and storing the images for the games.
public async Task<string> GetBoxArtFrontThumbAsync(int id)
{
var client = new HttpClient();
var result = await client.GetStringAsync("http://thegamesdb.net/api/GetArt.php?id=" + id);
var feedXml = XDocument.Parse(result);
var gameData = feedXml.Root.Descendants("Images").Select(x => new GetArt
{
BoxArtFrontThumb = new Uri(GetBoxArtFrontThumb(x), UriKind.RelativeOrAbsolute),
}).ToList();
return gameData.Single().BoxArtFrontThumb.ToString();
}
private static string GetBoxArtFrontThumb(XElement gameNode)
{
string data = "http://thegamesdb.net/banners/" + (string)gameNode.Descendants("boxart")
.FirstOrDefault(b => (string)b.Attribute("side") == "front");
if (data == "http://thegamesdb.net/banners/")
{
data = "/NoImage.jpg";
}
return data;
}
I really hope i explained this well enough and hope that there is someone that can help me solve this problem. Thanks.

Although you are using JumpList, the mechanism for Virtualizing the data is the same as the DataBoundListBox. (You can find more information here in the DataBoundListBox docs. There is a good tutorial using an OData service.)
In order for the Automatic mode to work properly, you need to be using Telerik's VirtualizingDataCollection object and initialize it with the proper arguments (count and page size).
I don't see this in the code you have provided above, can you please open a support ticket so that I can investigate further? See my comment above for the link. Let me know the ticket number and I'll provide further assistance.

how to navigate from a listbox in windows phone 7 application

I am building an application for Windows Phone 7 where in a ListBox I am showing data from the web service.
The WebService contains the following data:
News Title, News Description, Date Start and image path.
In the list box I am showing News Title, Date Start and image path.
Now on clicking an item from the list box I want to navigate to another page which should show all the three details along with news description.
My xaml is:
<ListBox Name="listBox1" SelectionChanged="listBox1_SelectionChanged">
<!-- SelectionChanged="listBox1_SelectionChanged"-->
<ListBox.ItemTemplate>
<DataTemplate>
<Button>
<Button.Content>
<ScrollViewer HorizontalScrollBarVisibility="Auto" Height="80" Width="400">
<StackPanel Orientation="Horizontal" Margin="0,0,0,0">
<Image Source="{Binding ImageBind }" Height="80" Width="120"/>
<StackPanel Orientation="Vertical">
<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>
</StackPanel>
</StackPanel>
</ScrollViewer>
</Button.Content>
</Button>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
The .cs file is:
public News()
{
InitializeComponent();
KejriwalService.aapSoapClient client = new KejriwalService.aapSoapClient();
client.getarvindNewsCompleted += new EventHandler<KejriwalService.getarvindNewsCompletedEventArgs>(client_getarvindNewsCompleted);
client.getarvindNewsAsync();
progressName.Visibility = System.Windows.Visibility.Visible;
}
void client_getarvindNewsCompleted(object sender, KejriwalService.getarvindNewsCompletedEventArgs e)
{
string result = e.Result.ToString();
List<Newss> listData = new List<Newss>();
XDocument doc = XDocument.Parse(result);
progressName.Visibility = System.Windows.Visibility.Collapsed;
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;
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);
}
listBox1.ItemsSource = listData;
}
Now in a new page say newsdetails.xaml i want to navigate from this page and show the complete details.
Please help.
I am stuck in this as I am new in this domain.
I am almost done with my app if this is done.
private void listBox1_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (listBox1.SelectedIndex == -1)
return;
var item = listBox1.SelectedItem as Newss;
if (!IsolatedStorageSettings.ApplicationSettings.Contains("SelectedObject"))
{
IsolatedStorageSettings.ApplicationSettings["SelectedObject"] = item;
NavigationService.Navigate(new Uri("/NewsDetails.xaml", UriKind.Relative));
}
}

Define static global variables in that page where your listbox selection change event is:
public static string title;
public static string news_description;
On listbox selection change assign these variables:
private void listBox1_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (listBox1.SelectedIndex == -1)
return;
var item = listBox1.SelectedItem as Newss;
if (!IsolatedStorageSettings.ApplicationSettings.Contains("SelectedObject"))
{
IsolatedStorageSettings.ApplicationSettings["SelectedObject"] = item;
title=item.News_Title;
news_description=item.News_Description;
NavigationService.Navigate(new Uri("/NewsDetails.xaml", UriKind.Relative));
}
}
And in your navigation NewsDetails.cs page Access these items like this:
string Title=YourPageName.title;//
string Description=YourPageName.news_description;
show these values as you want