Demo 7 Project (Video Clips)

Programmably shows a set of online videos and poster images for the videos. You use finger swipe to browse and play the videos.

What you will see on iPhone

In this demo, two videos (video URL) are shown. Only one video poster image (1, above) is in display on the iOS device. Tap the play button (2, above) to play the video in full screen. You can swipe horizontally (3, below) to browse the video list.

The videos can be of any online videos with a URL link or delivered directly from iQuipment PC.

Note: Since the iPhone has a limit for how much memory each app can allocate, ideally the poster image should be smaller the better. It improves the download speed and performance. It also less likely for iQuipment app to be kicked out by the iOS "memory police" for using up too much memory.

What you should do

Launch and run Demo 7.exe and iQuipment PC. If you need help on this, review the demo 1 help chapter.

On your iOS device (1, above, a text field on iQuipment app), enter the URL for the Demo7 iPhone View For example: http://10.0.0.2/iPhone/xml/demo7.xml. View Demo1 example if you don't know how to find the URL. Tap the "Go" key.

If all goes well, you should see the video list as shown above.

Code highlights

In iQuipment PC, open the demo7.xml file. It employs a "videoClips.dynamic" controller. Expand "array.title" sub node, you will see the video titles comes from the value of "video Titles" exposed variable. In the "array.video" sub node, the video URLs is linked to the value of another exposed variable "videoClips." The video's poster image is determined by the value of "posterImage" exposed variable.

Launch Demo7 Visual Studio project. Open Form1.cs. The key actions take place at the following function:

private void richTextBox_posterImage_TextChanged(object sender, EventArgs e)
{
INFOMATO.WCF.DataExchangeService.servicePostData("myVideoView", "posterImages", richTextBox_posterImage.Text);
}

where the poster image URLs are tied to the RichTextBox "richTextBox_posterImage" (1, above),

private void richTextBox_videoTitles_TextChanged(object sender, EventArgs e)
{
INFOMATO.WCF.DataExchangeService.servicePostData("myVideoView", "videoTitles", richTextBox_titles.Text);
}

where the video URLs are tied to the RichTextBox "richTextBox_titles" (2, above), and

private void richTextBox_videoTitles_TextChanged(object sender, EventArgs e)
{
INFOMATO.WCF.DataExchangeService.servicePostData("myVideoView", "videoTitles", richTextBox_titles.Text);
}
where the video titles are tied to the RichTextBox richTextBox_titles (3, above). Try enter a different set of videos and poster images into the Demo application.

Previous Lesson: Demo 6 Project (Multiple Devices Handling) Table of Contents Next Lesson: Demo 8 Project (Toolbar)