Showing the system ProgressIndicator in a Windows Phone 8.1 XAML app 6. April 2014 Shawn Windows Phone (0) If you have built a Windows Phone app before, you probably used the ProgressIndicator to indicate to the user that something was being done. The ProgressIndicator could show indeterminate dots floating from left to right to indicate that you have no idea how long the operation will take to complete. Or it would show a progress bar that would tell the user how much progress has been made. You could show the ProgressIndicator in code, but most likely used xaml. <shell:SystemTray.ProgressIndicator> <shell:ProgressIndicator IsIndeterminate="True" Text="Loading" IsVisible="{Binding Loading}" /> </shell:SystemTray.ProgressIndicator> The new Windows Phone 8.1 Apps for XAML also includes the ability to show progress with a ProgressIndicator, now called StatusBarProgressIndicator. Unlike Phone apps built with Silverlight, the new Phone 8.1 SDK does not include a way to interact with the StatusBarProgr... [More]
Add a persistent element to every page of your phone apps 21. February 2014 Shawn Windows Phone (0) Adding ad controls to apps is a pretty common thing. Some apps have ads on every page of the app. Some apps only have ads on some pages. When you want to have ads on one page you have to manually add the control to each page. Wouldn’t it be cool to only add it once and it shows up on all of your pages? This is exactly what someone recently asked on Stack Overflow. This is possible to do and quite simple. First, add a new style to your App.xaml resources and name it AdPhoneApplicationFrameStyle. <Style x:Key="AdPhoneApplicationFrameStyle" TargetType="toolkit:TransitionFrame"> <Setter Property="IsTabStop" Value="False"/> <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/> <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeNormal}"/> <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilyNormal}"/> <Setter Property="HorizontalAlignm... [More]
Place your app title in the System Tray 11. February 2014 Shawn Windows Phone (0) I’ve been using the new Bing apps a lot and I really like how the app name is in the SystemTray. This looks awesome and frees up valuable space for your app! I have found that sometimes I remove the app title from pages to allow for more content. Accomplishing this for your apps is soooo simple! All you need to do is comment out the TextBlock that you are using for your title, and add the following bit of xaml to your page (outside of any grids and such) <shell:SystemTray.ProgressIndicator> <shell:ProgressIndicator Text="My Application" IsVisible="True" IsIndeterminate="False"/> </shell:SystemTray.ProgressIndicator> Make sure you have set the SystemTray to be visible by setting the IsVisible property to true. You still get the advantage of the text going away when the user taps the tray. If you do this, you will need to rethink how you show that the app is loading. The ProgressIndicator is suppose to be used to show tha... [More]
Crop and resize any image to create a lockscreen for your phone with the [RTM] Nokia Imaging SDK 27. January 2014 Shawn Windows Phone (0) Awhile back I blogged about this same topic but with the beta version of the Nokia Imaging SDK. When Nokia released the RTM of their Imaging SDK, this functionality changed. We’ll take a look at how to accomplish this same functionality with the new Imaging SDK.The good news we will be able to reuse the GetRandomImage method that picked a photo from the phones library. private Picture GetRandomImage() { var rand = new Random(DateTime.Now.Millisecond); MediaLibrary library = new MediaLibrary(); var album = library.RootPictureAlbum; int albumIndex = rand.Next(0, album.Albums.Count - 1); album = album.Albums[albumIndex]; var pictureIndex = rand.Next(0, album.Pictures.Count - 1); var picture = album.Pictures[pictureIndex]; return picture; } We will also be able to reuse the GetCropArea method without any change... [More]
Synching the scroll position of two LongListSelectors 16. January 2014 Shawn Windows Phone (0) I was looking at Stackoverflow and found a question asking about how to sync two LongListSelectors so that their scroll position was always the same. I thought this was so cool that it was worth sharing it with the masses. First create a new class called MyLongListSelector. Unlike the ListBox, the LLS does not use a ScrollViewer to scroll the content. Instead, it uses a ViewportControl. We need to override the OnApplyTemplate and hook into the ViewportChanged event of the ViewportControl . public class MyLongListSelector : LongListSelector { private ViewportControl _viewport; public override void OnApplyTemplate() { base.OnApplyTemplate(); _viewport = (ViewportControl)GetTemplateChild("ViewportControl"); _viewport.ViewportChanged += OnViewportChanged; } } Within the event handler for the ViewportChanged event, we’ll se... [More]
Strongly type your settings saved in IsolatedStorageSettings 9. January 2014 Shawn Windows Phone (0) When creating an app you’ll need some way to save user settings. In Windows Phone (and Windows Store) Apps there are four possible ways to save settings. Key/Value pairs in IsolatedStorageSettings Save a file in IsolatedStorage Save values in a local database Save values in the cloud Usually everyone starts by saving values into IsolatedStorageSettings, and for the most part, it’s probably the best way to go. If you are creating a music app, you can not use IsolatedStorageSettings. The AudioPlayerAgent simply will not get the correct setting values. If you are creating an app with a background agent, you should consider not using IsolatedStorageSettings for the same reason as before. You are less likely to have a problem with incorrect values with a normal background agent than you are when using an audio agent. While using the IsolatedStorageSettings can be easy, the code can get ugly fast. You may have usage scattered throughout your code. public MainPage... [More]
Creating simple page transitions using Storyboards: Fly away transition 18. December 2013 Shawn Windows Phone (0) This is the third post is a series about creating simple page transitions using Storyboards. We’ve created two basic page transitions with the slide and turnstile transition. Now it’s time to get a little more complex. The mail app has what I like to call a “fly away” transition. When you tap an email, the subject flies away and the email slides up. This transition is a little more complex. Instead of animating the entire page, we only animate one control that is contained within one item of a ListBox. When the selection changes we need to animate the “header” of the selected item. The problem is that the SelectedItem of a ListBox is the bound item, and not the UI representation of that item. Good news is if we are displaying items with any type of ItemsControl, we can get the container for the bound item. An ItemsControl has a ItemContainerGenerator property that returns an instance of an ItemContainerGenerator. The ItemContainerGenerator has a ContainerFromItem method that r... [More]
Creating simple page transitions using Storyboards: Turnstile transition 16. December 2013 Shawn Windows Phone (0) In my last post, I talked about creating a simple transition to slide a page in or out. While that transition was functionality I needed for my app, Santa Calls, I thought it would be fun to do more of these posts. For this post we’ll create a turnstile transition. The turnstile transition is like a page turning. For the turnstile transition, we need to use the animate the Projection of the page. We’ll set the Projection to be a PlaneProjection. To get the rotation to turn like a page would, we need to rotate around the vertical, or y-axis. The RotationY property of the PlaneProjection is how we accomplish this. public static async Task TransitionInTurnstile(this FrameworkElement source) { await source.Turnstile(75, 0); } public static async Task TransitionOutTurnstile(this FrameworkElement source) { await source.Turnstile(0, -90); } private static async Task ... [More]
Creating simple page transitions using Storyboards: Slide transition 15. December 2013 Shawn Windows Phone (0) I recently updated my app Santa Calls to include a settings page that would allow the user to delay a call or pin lock the application. When navigating to this page I wanted a nice transition, but I wanted the tree in the background to remain. To accomplish this I set the background of these pages to be the tree image and moved the content in/out when needed. I would not be able to accomplish this type of transition using an SDK like the Windows Phone Toolkit or Telerik unless I set the application background to be the tree. I did not want to do this because the phone call pages do not have this same background. The transitions are pretty simple and can be used by any page to move content up/down. I created a handy extension method that can be used by any FrameworkElement. To slide the content up into view, we need to create a Storyboard with a DoubleAnimation that will move the content (assumed to be a page) from the bottom of the page to the top. public static... [More]
Update: Creating a custom MessageBox for your Windows Phone apps. 25. November 2013 Shawn Windows Phone (0) I was looking at my site traffic and noticed that one of my most popular posts was about creating a custom MessageBox. This post was written two years ago and continues to get a lot of traffic. Since writing that post, I’ve updated my MessageBox a lot. I’ve changed it to use async/await, modified the style, corrected some bugs, and added functionality. Since I’ve made a lot of changes, and that post continues to get a lot of readers, I thought it would be good to give the latest version. I continue to use a UserControl approach for this because I don’t want any overriding of styles. It has a set look, and should not be allowed to be changed (aside from the use of static resources). The xaml only need a small change to the bottom margin. Instead of 12 all around, it needed 18 on the bottom. I also changed the name of the first Grid from MessagePanel to LayoutRoot, this wasn’t needed, but made some code behind easier to understand what element was being modified. <Grid x:Cla... [More]