WinPhanDev

A year in the like of MSicc – my review of 2013

dev smurf

2013 was a year with a lot of surprises. It was a year full of community work for me as well as a huge learning year in development. But my year had also dark clouds on heaven. This post is my personal review of 2013 – you can like my impressions or not.

I started the year with releasing my first Windows 8 app ever, along with an huge update to my blog reader app for Windows Phone. I wrote several blog posts and started also development of my NFC Toolkit app for Windows Phone (Archive: January). I also ran a beta test for my NFC Toolkit, and finished my series about the parts that should help other developers  to write a blog reader app for both Windows and Windows Phone (Archive February & Archive March).

Then in April, the first time I had dark clouds hanging deeply in my life, affecting all parts – family, community work and also my 9to5 job. My wife had once again problems with her back, caused by slipped discs. It went as far as she needed to rest in hospital for a pain therapy. Luckily this therapy was helping her and our life went back to normality (knocking on wood).

I also started a new series on the WinPhanDev blog – Why we started developing (WWSDEV). We are collecting stories from developers, and posting them over there to motivate other developers and keep the community spirit alive. Just have a look, we have really great stories over there.

In the last days of April/beginning of May, Iljia engaged me to start using Windows Azure Mobile Services to make an app idea reality: TweeCoMinder was born. It is a very special and unique app, interesting for those that don’t want to miss their special counts on Twitter, supported by real push notifications via WAMS for both Live Tiles and Toast Notifications. I learned a lot during setting up my WAMS for the app, and I did also write some blog posts about that (AzureDev posts).

Because of TweeCoMinder, I stopped developing my NFC app for that time, and did only bug fixing updates to my other apps.

In August (at least in the spare time I had), I moved my blog completely to run in a Windows Azure VM. I did it to get more control over the whole system and to learn more about running a web service. I still need to write my blog posts about setting the VM with LAMP on Azure, but I just didn’t have time for that until now. In August/September I also had again very very dark clouds hanging around, with my wife was very ill (you can’t even imagine how happy I am about the fact she has this part behind her). But our daily live is still affected by this – we just learned to arrange us with the new situation.

In October, I got back to my NFC Toolkit to finish it finally. The app has some cool and unique features utilizing NFC tags, and I am quite satisfied with my download numbers. NFC Toolkit is my main project for the moment.

But also on my 9to5 job I came to write code. I was asked to write an internal app for Windows Phone (Telefónica has a partnership with Microsoft, and so the company is flooded with Windows Phones). I used this to learn more about speech recognition on Windows Phone, as this is part of the application (Make your app listening to the user’s voice).

And finally, I also started with my very first Android app using Xamarin while porting the Windows Phone app I wrote before. I recently started to blog about my experiences with Xamarin (read more here).

In between all those projects, I made a basic reader app for the fan blog “This is Nokia”, using a PCL project for both Windows Phone 8 and Windows 8. I also wrote a simple car dashboard app to integrate it in my NFC Toolkit app as well as Mix, Play & Share, which was written on a lonely Saturday night while my kids where sleeping an my wife was at her best friend.

Through the year, I learned a lot of coding, but also a lot about people. I made some very positive experiences – but also bad ones. I am always willing to help (if my still growing knowledge enables me to do so) – but sharing a feature rich app to another person isn’t helping – if you want to learn about development, there are plenty ways to do so. We have really great developers that blog about their experiences in our community, and by understanding how to code, you truly learn. Just using an already working app and restyling it, is the wrong way.

Well, that is what my year was about – a lot of coding, learning and again coding.

Dear followers, friends, WinPhans & WinPhanDevs – thank you for being with me this year. Let’s make 2014 an even more exciting year.

I wish you all “a good slide into the new year”, as we say here in Germany. May god bless you and your families also in the new year.

Posted by msicc in Editorials, 0 comments

[Updated] Why Windows Phone apps deserve a custom uri scheme (and how to add a simple launch uri)

app2app_Windows_Phone

Microsoft introduced custom uri schemes or uri associations in Windows Phone 8 along with the ability to launch apps based on a file type.

Sadly, this feature is not used across a broad range of apps yet. Why am I so interested in that point? I am going to explain you.

First, there is one big issue: You can share any app via NFC, and launch any app from the Store via NFC tag that has a launch app record. But you cannot launch any apps from your app – just those that have implemented a custom uri scheme. On the other two big operating systems, sharing between apps is meanwhile a standard feature used by a lot of developers.

Most of the settings pages have one of those uri schemes, for example the Wi-Fi settings page can be launched with this simple line of code:

await Windows.System.Launcher.LaunchUriAsync(new Uri("ms-settings-wifi:"));

I don’t know if other developers just don’t know about this feature or if they don’t think it is necessary. I talked to a lot of users of my app NFC Toolkit for Windows Phone 8, and all asked me to add the possibility to launch a desired app at the end of my profiles (if you don’t know, my profiles launch programmable sequence of settings pages).

Searching for a solution to satisfy my user, I spent a few days with researching of all possibilities and talking to other developers. Some of them wanted use cases for adding that feature, here are three:

  • Every day I leave for work, I disable Wi-Fi, activate Bluetooth and switch the cellular connection from 2G to 3G/4G. I often use Nokia Music to listen to music while driving to work (about 45 minutes). This is one of the use cases.
  • The second scenario should be also familiar to some of you: I switch off all data connections because otherwise, my phone would ring very often during the night. In the morning, I switch them back on and check for news with a feed reader app. This would fit perfectly into a profile that I save on a NFC tag or launch via secondary tile.
  • Third one: there are a lot of blog reader apps out there. Sure, Windows Phone has social networks built in – but only Facebook (user only), Twitter and LinkedIn. What if I want to share to another network, for example Geeklist? Then I have to copy and paste instead of just hitting the share button.

There are more use cases, but I am leaving you with these three for the moment.

Back to the conversations I had with my users. They want and deserve a great user experience. This blog post is part of my efforts to provide users their deserved user experience.

Sadly, for a handful of developers it is not as easy to gain some attention for this. This is why I am trying to get DVLUP on board. By creating a challenge for this, more developers would join to earn the XP. The winners in this case are the users out there, because this way, their user experience will be improved. I know this should be done by Microsoft. In the meantime, it is up to us developers to improve. That’s why I ask you to vote for my idea case on DVLUP here: http://www.dvlup.com/Feedback?query=custom+uri+scheme+to+all+apps%21# (the first entry in the list is the one to vote).

There is one reason left why you should add a custom uri scheme to your app. This point is for you, the developer reading this article. You have a free possibility to promote your app across other apps. The most important point: it takes only 5 minutes to add a simple launch uri scheme.

Do you already have a custom uri scheme for your app? Great, then add it to this list: URI Association Schemes List – Nokia Developer Wiki. This way, other developers can use them to interact with your app and bring you new users, too.

To close this article, I want to show you how to add a simple custom uri launch scheme. I have done this with my app Mix Play & Share recently (update submitted, will add it to the list above as soon as it certified).

A simple launch uri – the code

First, open your WMAppManifest.xml by right-clicking on it and Open with… =>XML (Text) Editor.

After the </Tokens> Element, add the following code:

<Extensions>
     <Protocol Name="your-custom-uri-scheme-here" NavUriFragment="encodedLaunchUri=%s" TaskID="_default" />
</Extensions>

Save and close the Document.

Add a new class to your project. Add the following code in your class:

    class UriSchemeMapper : UriMapperBase
    {
        private string tempUri;

        public override Uri MapUri(Uri uri)
        {
            tempUri = System.Net.HttpUtility.UrlDecode(uri.ToString());

            // updated code begins here:
            if (tempUri.Contains("your-custom-uri-scheme-here"))
            {
                return new Uri("/MainPage.xaml", UriKind.Relative);
            }
            //updated code ends here
            return uri;
        }
    }

To make your app using this custom uri scheme, you just have to add another line of code after the declaration of your RootFrame in App.xaml.cs:

//Handle custom uri scheme
RootFrame.UriMapper = new UriSchemeMapper();

That’s all, your app now is able to be launched by other apps!

You can also add more advanced custom uri schemes (up to 10 per app), to read more about it, check MSDN: http://msdn.microsoft.com/en-us/library/windowsphone/develop/jj206987(v=vs.105).aspx#BKMK_URIassociations

I hope after reading this post, you understand why I think it is important to add a custom uri scheme. With the simple code above, you’re done in 5 minutes.

Update 12/14/2013:

I needed to update the UriMapper class above, because without handling a scheme without parameters we will have no guarantee that the app launches. In my tests it works sometimes and sometimes not, but to make sure your app launches, please handle this case properly.

 

Until then, happy coding!

Posted by msicc in Dev Stories, windev, 9 comments

Add your app: List of uri associations for Windows Phone

While development of my NFC Toolkit, I came to the point where I needed to launch apps from my code.

On Windows Phone, this is only possible via custom uri association and needs to be implemented by the developer of an app.

If you want your app to be launchable from other apps, you need to implement a custom uri assocation like descriebed here in the MSDN Documentation.

Users are demanding often apps to be launched from other apps – it is not much work to do, so I recommend you are implementing those features into your app(s). Over time,  your app will be getting more recognition amongst users of other apps and improves the user experience a lot.

To make it easier for everyone of us, please add your app here: http://developer.nokia.com/Community/Wiki/URI_Association_Schemes_List

Let’s make this list a basic resocurce for everyone of us!

Until then, happy coding!

Posted by msicc in Dev Stories, windev, 3 comments

How to modify the Background of a Telerik RadListPicker Control

In one of my current projects, I needed to change the Background of the Popup on a Telerik RadListPicker control. While it took me some time, I want to share how to achieve that to make it easier for you.

First, you need to create a copy of the RadListPicker Template. You can use either Blend or Visual Studio 2012 to achieve this.

In Blend just go to the menu and choose Object -> Edit Style -> Edit a Copy. In Visual Studio, right click on your RadListPicker in the Designer Window and choose Edit Template -> Edit a Copy.

Now you will find a new Style within your Application.Resources in App.xaml.

To change the style you have to modify two parts, the PopupHeader and the Popup itself.

To change the Background of the PopupHeader search for telerikPrimitives:RadWindow x:Name=”Popup” . Under that, you will find a Grid.

In this Grid, you will need to set the Background to the desired Color or Brush you want to use:

<Grid Background="#FF0A0D38" telerik:RadTileAnimation.ContainerToAnimate="{Binding ., ElementName=PopupList}">

To change the Background of the List in you ListPicker, you will have to style the Background of the underlying RadDataBoundListBox Control:

<telerikPrimitives:RadDataBoundListBox x:Name="PopupList" CheckModeDeactivatedOnBackButton="False" DisplayMemberPath="{TemplateBinding DisplayMemberPath}" IsCheckModeActive="{Binding SelectionMode, Converter={StaticResource SelectionModeToBooleanConverter}, RelativeSource={RelativeSource TemplatedParent}}" telerik:InteractionEffectManager.IsInteractionEnabled="True" ItemContainerStyle="{TemplateBinding PopupItemStyle}" Grid.Row="1" Style="{TemplateBinding PopupStyle}">
   <telerikPrimitives:RadDataBoundListBox.Background>
      <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
          <GradientStop Color="#FF0A0D38" Offset="0"/>
          <GradientStop Color="#FF9FCFEC" Offset="1"/>
      </LinearGradientBrush>
   </telerikPrimitives:RadDataBoundListBox.Background>
</telerikPrimitives:RadDataBoundListBox>

As you can see, the I changed the Background to a GradientBrush to match the rest of the application.
The result looks like this:

wp_ss_20131021_0001

As always, I hope this will be helpful for some of you.

Happy coding!

Posted by msicc in Dev Stories, windev, 1 comment

How to save a List or a Collection on a NFC tag

 

WP8_NFC_PostLogo

As I am currently working again on my NFC app, I needed to save an ObservableCollection to a tag. My first attempts resulted in a heavily overlong string that I wasn’t able to save.

Anyways, after a short convo on Twitter, I went for the right way – serialize to JSON.

The first thing you’ll need for that is the JSON.NET library, which you can get here or via the NuGet package manager in Visual Studio.

After that, you will be able to save your List or ObservableCollection in a few easy steps.

One thing I need to recommend is to make the names in your class/viewmodel as short as possible. Here is my example:

public class ListItems
    {
        //ListItems
        public string i { get; set; }
        //isChecked
        public bool iC { get; set; }
    }

You will need every space you can get on your tag, so you really should go for a similar way like I did above.

After you are done with that, you only need one line of code to convert your List/Collection for writing on your tag:

var ListToSave = JsonConvert.SerializeObject(ItemsList);

Now you will be able to save it as a Text record or  whatever record type you need to save it to.

Deserializing the JSON string works also with only one line of code:

ItemsList = JsonConvert.DeserializeObject<ObservableCollection<ListItems>>(StringFromYourTag);

Then you set the ItemsSource of your ListBox to that (or whatever else the List/Collection is for).

I my case, I was able to save a Collection of 25 items to my tag (writable size 716 bytes) with having still about 200 bytes left in this way.

As always, I hope this will be helpful for some of you.

Happy coding!

Posted by msicc in Dev Stories, windev, 0 comments

New Series: Getting productive with Windows Azure Mobile Services (WAMS)

WAMS

Now that my current app project is near to go live, I will start a new series about how to get productive with Windows Azure Mobile Services (WAMS).

I will cover some interesting topics in this series, which are not really documented in the very well written “Getting started” series from the Azure team itself.

These topics are (list is subject to be updated if needed):

First, if you want to get  started, you should check out this link: http://www.windowsazure.com/en-us/develop/mobile/tutorials/get-started-wp8/

The tutorial makes you very easy and fast using WAMS.

What can you expect from this series? As always, I will add some of my personal experiences during my journey of creating my app. There were a lot of small stones in my way, and I will also tell you how to remove them. And of course I hope that my posts will help some of you to get their own WAMS story started.

Happy coding everyone!

Posted by msicc in Azure, Dev Stories, 0 comments

How to use and customize “pull to refresh” on Telerik RadDataBoundListBox

If you are following me and my development story a little bit, you know that I am building a new app (ok, it’s RTM already).

I wanted to add a manual refresh button to my MainPage, but there was no place left on the AppBar. So I started thinking about alternatives. As I am using a lot of Telerik controls, I found something that perfectly suits my needs: RadDataBoundListBox .

Wait… what?

You read it right, I am using a ListBox that holds only one item. The reason is very easy: It has the “pull to refresh” feature built in. But it is not all about adding it and you are fine.

raddataboundlistbox-features-pulltorefresh

The first thing we need to do is to set the “IsPullToRefreshEnabled” property to “True”. Honestly I don’t like the controls arrow as well as I wanted to remove the time stamp line on it.

Luckily, we are able to modify the control’s style. Just right click on the RadDataBoundListBox in the designer window and extract the “PullToRefreshIndicatorStyle”.

Screenshot (187)

After choosing whether you want the new Style to be available only on one page or in your app over all, name the new Style as you like. This will add the XAML code as a new style to your application/page resources. Now the fun begins. The first thing I changed was the arrow.

To do this,  I added the beloved metro arrow in a circle (go for the “ContentPresenter  with the name “PART_Indicator””) – done:

<Viewbox xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<Grid>
 <Grid Name="backgroundGrid" Width="48" Height="48" Visibility="Visible">
   <Path Data="M50.5,4.7500001C25.232973,4.75 4.75,25.232973 4.7500001,50.5 4.75,75.767029 25.232973,96.25 50.5,96.25 75.767029,96.25 96.25,75.767029 96.25,50.5 96.25,25.232973 75.767029,4.75 50.5,4.7500001z M50.5,0C78.390381,0 101,22.609621 101,50.5 101,78.390381 78.390381,101 50.5,101 22.609621,101 0,78.390381 0,50.5 0,22.609621 22.609621,0 50.5,0z" Stretch="Fill" Fill="#FFF4F4F4" Name="Stroke" Visibility="Visible" />
     </Grid>
       <Path Data="F1M-224.887,2277.19L-240.615,2261.47 -240.727,2261.58 -240.727,2270.1 -226.173,2284.66 -221.794,2289.04 -202.976,2270.22 -202.976,2261.47 -218.703,2277.19 -218.703,2235.7 -224.887,2235.7 -224.887,2277.19z" Stretch="Uniform" Fill="#FFFFFFFF" Width="26" Height="26" Margin="0,0,0,0" RenderTransformOrigin="0.5,0.5">
         <Path.RenderTransform>
             <TransformGroup>
                <TransformGroup.Children>
                  <RotateTransform Angle="0" />
                     <ScaleTransform ScaleX="1" ScaleY="1" />
                 </TransformGroup.Children>
              </TransformGroup>
          </Path.RenderTransform>
   </Path>
</Grid>
</Viewbox>

No we are going to  remove the time stamp. If you simply delete the TextBlock, you will get a couple of errors. The TextBlock is needed in the template. What works here is to set the Visibility to Collapsed. As the control has different Visual States, we need to set the Visibility of every occurrence of  “PART_RefreshTimeLabel” in every state to collapsed. Finally we need to do the same at the TextBlock itself to hide the time stamp line.

Ready… or not?

Now we have our style ready to be used, right? Let’s have a look how it looks when we are using our control right now:

(link for app users)

As you can see, the behavior of the Pull to refresh – control is not like expected. In this state, we have to throw it up first, then it will recognize the pull gesture. To get rid of this, we need to adjust two additional things.

The first thing we need to do is set the “UseOptimizedManipulationRouting” property to “False”.

Second, after setting the ItemsSource of the RadDataBoundListBox, we need to bring the first item into view. You can do this very easily:

RadDataBoundListBox.BringIntoView(ItemsSourceName.First());

After that, we have finally a customized and smooth Pull to refresh function on our RadDataBoundListBox:

(link for app users)

At this point I want to give a special thanks to Lance and Deyan from Telerik for their awesome support on this case.

Happy coding everyone!

Posted by msicc in Dev Stories, windev, 0 comments