Paging in wrapPanel

Here is the paging Functionality in Wrap Panel
I have added Wrap panel using the namespace system.windows.Controls.toolkit as shown in the image


Do not set width on wrap panel. Wrap panel loads image based on main page size changes
I have loaded images from xml and when the main window is resized paging changes based on that

public MainPage()
{
InitializeComponent();
this.SizeChanged += new SizeChangedEventHandler(MainPage_SizeChanged);
webClient = new WebClient();
webClient.OpenReadCompleted += new OpenReadCompletedEventHandler(webClient_OpenReadCompleted);
webClient.OpenReadAsync(new Uri("Application.xml", UriKind.RelativeOrAbsolute));
this.Loaded += new RoutedEventHandler(MainPage_Loaded);
}

void MainPage_SizeChanged(object sender, SizeChangedEventArgs e)
{
Paging();
}
private void Paging()
{
appHeight = this.ActualHeight;
appWidth = this.ActualWidth;
pageSize = Convert.ToInt32(Math.Floor(((this.ActualHeight) - 216) / 38));
if (pageSize != 0.0)
{
pagecount = Convert.ToInt32(Math.Ceiling(totalSize / pageSize));
PageStackPanel.Children.Clear();
myWrapPanel.Children.Clear();
if (pagecount != 1)
{
for (int i = 0; i <= pagecount; i++) {
HyperlinkButton href = new HyperlinkButton();
href.Content = i + 1;
href.Click += new RoutedEventHandler(href_Click);
PageStackPanel.Children.Add(href);
}
}
}
GetInteractivity(1);
}

void href_Click(object sender, RoutedEventArgs e)
{
HyperlinkButton hf = sender as HyperlinkButton; GetInteractivity(Convert.ToInt32(hf.Content));
}
void webClient_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)
{
try
{
xmlParser = new XMLParser(e.Result);
BindXML(); webClient.OpenReadCompleted -= new OpenReadCompletedEventHandler(webClient_OpenReadCompleted);
totalSize = interactivityList.Count; Paging();
GetInteractivity(1);
}
catch (Exception ex) { }
}
private void GetInteractivity(double pgSize)
{
myWrapPanel.Children.Clear();
int startVal = Convert.ToInt32((pgSize - 1) * pageSize);
int endVal = Convert.ToInt32((pgSize) * pageSize);
endVal = endVal > Convert.ToInt32(totalSize) ? Convert.ToInt32(totalSize) : endVal;
for (int i = startVal; i <=endVal;i++)
{
Image img = new Image();
img.Width = 160;
img.Height = 160;
string imgpath = interactivityList[i].imagePath.ToString();
Uri uri = new Uri(imgpath, UriKind.Relative);
ImageSource src = new BitmapImage(uri);
img.Source = src;
img.Tag = interactivityList[i].xapfilePath;
img.MouseLeftButtonDown += new MouseButtonEventHandler(image1_MouseLeftButtonDown);
Rectangle rect = new Rectangle();
rect.Width = 100;
rect.Height = 100;
myWrapPanel.Children.Add(img);
myWrapPanel.Children.Add(rect);
}
}
private void BindXML()
{
List elements = xmlParser.GetElements("Application");
if (elements.Count > 0)
{
for (int i = 0; i <= elements.Count; i++)
{
Interactivity interactivity = new Interactivity();
imageElement = elements[i].Element("ImagePath");
interactivity.imagePath = imageElement.Value.ToString();
xapElement = elements[i].Element("xapFilePath");
interactivity.xapfilePath = xapElement.Value.ToString();
interactivityList.Add(interactivity);
}
}
} public class Interactivity
{
public string imagePath { get; set; }
public string xapfilePath { get; set; }
}


NOTE:
Replace <= with <

LoadXap File Dynamically through HTML page

How to load xap file dynamically in silverlight?

We can use xap loader class method or else u can load xap file via html Page.Here is my example to load the xap file dynamically

Lets Create a sample application and bind the image in tat application .I have created the project in the name of sampleapplication .

Now i have created the other project name loadXAP to load sampleapplication XAP file.I have added MyPage.htm Page in the web project,and add the following code as in the image

and add div with the Id 'silverlightControlHost' in the body tag .Now place the sample application Xap file in the ClientBin folder of loadXap Application.Now i have place thumbnail of image and when i click on the image it redirects to MyPage.htm file with the XAP filename as Query string .Here is the screen shot of the application