This version also includes minor UI changes, which I hope makes the app more user friendly. Do let me know what you think of it. Leave a rating if you enjoy using the app.

Do give it a go and provide a positive rating if you like the app

Add shortcuts of different cinemas or movies so that you can access those information quickly. Listing of all cinemas makes it easy for you to find the address and phone number of any cinemas.

Home

Movie List

Movie Details

Cinema Details

Favourite

Seat booking

Version 1.1 (7th Mar 2012)

• view movie trailers
• access seat booking directly

Version 1.0 (11th Feb 2012)

• initial release

You can set the text to wrap though by generating your own custom style, where you get to have more control of the text in the HyperlinkButton .

 
First open up your page in Expression Blend

 
Once Expression Blend is opened, right click on the HyperlinkButton and select “Edit Template – Edit a Copy”.

 
You will now notice that on the left hand corner, after expanding the tree, you get to a TextElement control. Select that and then expand the “Text” option on the right.

 
After expanding the “Text” option, you can now set the TextWrapping option.

 
Save the project and you’re done. You can now close Expression Blend. In Visual Studio, you will notice a new style has been added to your XAML at the top.

 
And there you have it, your HyperlinkButton is now text wrapped.

There is a workaround for this though, which should allow you to databind the IsEnabled value of the appbar button.

 
In this example, I have an appbar in my app, consisting of only 1 button. I also have a bool property “enableButton” in my ViewModel, which will either set the appbar button to enabled or disabled.

<phone:PhoneApplicationPage.ApplicationBar>
   <shell:ApplicationBar IsVisible="True" IsMenuEnabled="False" Mode="Default" ForegroundColor="White" BackgroundColor="#fc0000">
      <shell:ApplicationBarIconButton IconUri="/Images/appbar_refresh.png" Text="refresh" Click="refreshButton_Click" />
   </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

Since I cannot databind the “enableButton” property of my ViewModel directly to the appbar button, I will need to add this small piece of code first into my XAML.

<!--work around listener to enable/disable appbar icon-->
<CheckBox IsEnabled="{Binding enableButton}" IsEnabledChanged="toggle_Appbar" Visibility="Collapsed"  />

In my code behind, I then add the below code.

private void toggle_Appbar(object sender, DependencyPropertyChangedEventArgs e)
{
   (ApplicationBar.Buttons[0] as ApplicationBarIconButton).IsEnabled = (sender as CheckBox).IsEnabled;
}

What this 2 pieces of code do basically is, I first add a checkbox, to my page, and databind the IsEnabled property to my ViewModel. Since I do not really need to see this checkbox, I made it invisible. I added an event listener to this checkbox, which triggers everytime the IsEnabled property changes. I then add the event in my code behind, which sets the IsEnabled property of my appbar button to the same value as the checkbox. Now, every time the value in my ViewModel changes, the checkbox will reflect the same value, triggering the IsEnabledChanged event, which in turns set my appbar button to the correct state.

With this method, your appbar button will now be automatically updated whenever the value of your ViewModel property changes. Not exactly databinding but a clean workaround.

This lag happens because the UI thread is busy trying to bind all that data. The page will only get displayed once the data binding is done. The larger your list, the more noticeable the lag. In this scenario, you can minimize the lag, by delaying the load data for the ViewModel Items, until after the page gets displayed. This way, it will make your app look more responsive, as the page is loaded fast after you navigate to it, even if the page that gets loaded does not show any data yet.
 

Lets look at the default DataBound Application when you start a new project. You can see that the “LoadData” function is called in the “MainPage_Loaded” method.

// Load data for the ViewModel Items
private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
   if (!App.ViewModel.IsDataLoaded)
   {
      App.ViewModel.LoadData();
   }
}

The idea here is to wait for a short period, to give the page time to display (without any data though), before we do the “LoadData” function. You can do this by modifying the code, so that it looks like this.

// Load data for the ViewModel Items
private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
   // delay the load data so that page/animation can complete smoothly
   Thread t = new Thread(unused => delayedLoadData(1000));
   t.Start();
}
 
// delay the load data by a few ms (background run))
private void delayedLoadData(int delay)
{
   System.Threading.Thread.Sleep(delay);
 
   // marshal back background thread to UI thread
   Deployment.Current.Dispatcher.BeginInvoke(() =>
   {
      App.ViewModel.LoadData();
   });
}

What this piece of code change does is, upon page load, it runs the “delayedLoadData” in the background, so that it will not hog the UI thread. This “delayedLoadData” method, which is now running in the background, takes in a parameter 1000 (1 second), and waits for this 1 second to complete, before running the “LoadData” function back in the UI thread. The 1 second delay, should give enough time for your page to get displayed without any data, or if you are using the silverlight toolkit animation, enough time for the animation to complete. The “LoadData” function should then kick in after the short delay. Even if there is now a 1-2 second lag before the data is eventually displayed, the user should not notice any lag, since your page is already displayed (with animations running smoothly even). This indeed gives your app a more responsive feel to it. Adjust the time to delay according to the complexity of your ViewModel items.

One improvement is the fast app switching. You can now multi task and switch back to the app and it will open immediately. The other improvement is that when listing cars from your search results, the next set of results will automatically load when you scroll down to the list.

The font size of the panaroma/pivot title is too big. How do I change the size, or even add an image to the title, while still maintaining the default margins…

It really is simple to do this. Lets look at the default panorama/pivot title.

When you create a new Panorama project, the XAML for the title is as below. As you can see the title of the page is set as “my application”

<controls:Panorama Title="my application">
   <controls:Panorama.Background>
      <ImageBrush ImageSource="PanoramaBackground.png"/>
   </controls:Panorama.Background>
   ....
</controls:Panorama>

To change the size and style of this title, add an extra piece of code such that it looks like this.

<controls:Panorama>
   <controls:Panorama.Title>
      <Grid Height="249">
         <TextBlock Text="my application" Margin="0" FontSize="187" />
      </Grid>
   </controls:Panorama.Title>
   <controls:Panorama.Background>
      <ImageBrush ImageSource="PanoramaBackground.png"/>
   </controls:Panorama.Background>
   ....
</controls:Panorama>

As you can see, I have created an extra XAML block entirely for the title. The default font size of the title is 187 and you can now change it to whatever size, color or style. The grid height of 249 is to ensure that the margins for the rest of the page remains the same even if you change the font size. If you want to include an image in your title, you can just add it under the grid.

For Pivot title, its similar too, but in the case for pivot, you add it under each pivot item as a header.

<controls:PivotItem >
   <controls:PivotItem.Header>
      <Grid Height="95">
         <TextBlock Text="first" FontSize="72" />
      </Grid>
   </controls:PivotItem.Header>
   ...
</controls:PivotItem>

Here, the default font size is 72 and the grid size is 95 to maintain the default page margins.

In case anyone is wondering how I got this phone when its not even launched yet, this was given to me free, courtesy of Nokia Singapore

Look what just came in the morning. A new update for my Lumia 800

The Nokia App Highlights makes it easy for a first time WP7 user to find apps to download. It shows the popular apps others are downloading, as well as local apps. My BusGuide and XINMSN app have made it here Stomp mobile is somewhere below though.

The Nokia Drive which comes with the phone looks like a very useful app to have too. Settings for 2D/3D view etc..

The review is now completed and I am quite flattered by her positive review of the app.

My first impression of the app is how slick it looks and how vastly different it is from the website. I am really impressed. I appreciate that the website to app adaptation is not a literal copy and paste- that would have been easy to do.

The app definitely streamlined the full functionalities of the website and notably all other content except the news stories have been waylaid.

I also do appreciate her frank opinions on the shortcomings of the app. There are some aspects I’m hoping to improve on and will work on that for the next release

News stories load quickly however the photos loaded really slowly making browsing through photos quite a frustrating affair. I noticed a lack of loading activity so it becomes a little disconcerting because there is no feedback as well.

If you do use my STOMP app, do let me know how you find it and how I can improve it further. Do leave a ratings on Marketplace too