Media Remote 1.2 early preview

After spending some serious amount of time learning how sockets work I have now rewritten the Media Remote server to work with both the new and old client for Windows Phone 7.

I have also started working on the new client, Media Remote 1.2, that will be for the Windows Phone Mango update. The client now also relies on socket connection instead of using the WebClient’s request methods. This makes the connection a lot more stable, and the delays in updates and button presses that could be noticed before are almost gone! It also connects most faster when the application is started or resumed. (Of course it supports instant resume in Mango too).

The hardest part was making that I had close to no experience using sockets before and furthermore I have implemented the client using BackgroundWorkers to handle the connection, so the UI wont freeze (kind of nice… Blinkar), which I also had to learn. The server is already using threads, but it was more of a challenge to get it to work in client because the results from the BackgroundWorker needed to be shown in the UI.

But now for some sneak peak screenshots of the client, which also got a refresh in the UI:

screenshot_0

I would love to hear your thoughts about the new UI, it is made to look more like the new Zune interface. Where would you want to have the volume buttons?

More info to come soon! Ler

ListPicker inside ScrollViewer WP7 Toolkit Mango

Today I was going to add a ScrollViewer to my project, the problem is that inside the ScrollViewer control I had a ListPicker. Shouldn’t be a problem, right?

But unfortunatly that seems to be a known issue in the August release of the WP7 Toolkit. To resolve this I found a solution over att the Silverlight Toolkit website that seems to work. What you have to do is edit the source of the WP7 toolkit, more precisly the file ListPicker.cs. Here is how you do it:

On line 881, change the following:

if (IsValidManipulation(e.OriginalSource, e.ManipulationOrigin.X, e.ManipulationOrigin.Y)
     && 0 < Items.Count)
{
   if (Open())
   {
      e.Handled = true;
   }
}

To this:

Point point = new Point(e.ManipulationOrigin.X, e.ManipulationOrigin.Y);
if (e.ManipulationContainer != e.OriginalSource)
{
   var trans = e.ManipulationContainer.TransformToVisual((UIElement)e.OriginalSource);
   point = trans.Transform(point);
}
 
if (IsValidManipulation(e.OriginalSource, point.X, point.Y) && 0 < Items.Count)
{
   if (Open())
   {
      e.Handled = true;
   }
}

Credit for this goes to Drachen23 at CodePlex.

Source: http://silverlight.codeplex.com/workitem/9332

Note: The solution also mention, to handle the Tap event of the ListPicker does not seem to work, it correctly opens the ListPicker, but does not always react when user wants to close it in Expanded Mode.

Custom ringtones in WP7 Mango

One of the many news in WP7 mango is that you can add your own ringtones to the phone. In this blog post I will show you how it is done!

First choose the ringtone you want to use, there are a few requirements that need to be fulfilled:

- The file needs to be in either mp3 or wma format.
- The file can NOT be DRM protected
- Filesize must be smaller than 1MB
- The song has to be 39 seconds or shorter

The first two requirements are quite easy to get past, but the two last stops you from having most of your music as ringtones. The best way to fix this is to use a free audio editor such as Audacity and cut out the part of the song you want as the ringtone.

Now, you need to import the music file into your Zune collection as usual (drag and drop the file onto Zune music collection view, for example). When you have done that you will need to right click the song and choose “Edit” and change the tracks “Genre” to “Ringtone” (without “, and as one word”). There might already exist a category called “Ring Tone”, but that one won’t work as it has to be without the space.

set_genre

Now sync the song with your phone as usual, by dragging it to the device in the lower left corner of Zune or right click the file and choose “Sync with [device_name]”. The ringtone will now show up under Custom Ringtones (at the top) when choosing ringtones in WP7 in the settings menu. Because the genre is Ringtone the file won’t show up in the music hub, which is also nice.

Hope you enjoyed this quick guide!

Whats coming in the future?

So as I wrote in the last post I’m currently working on making my apps ready for Mango release, and I thought I would share some inside info with you.

Currently I’m working on a remake of SMS-Tickets, which will be completly free (currently $0.99), and let you pin your tickets to the start screen!

As for my most popular app Media Remote I also plan to let users pin artists/tracks/albums to the start screen, much like you can do in Zune. Also the possibility to save several server IP’s will be introduced. (Great when you want to control multiple computers). I’m also thinking about rewriting it to using the new Socket support in Mango to get better performance!

As for the other apps you will have to wait a while before I reveal the future plans!

Changing font size in panorama title and headers

So, it was a while since the last time, unfortunately had too little time to develop apps, but hoping that will change soon. I’m currently working on upgrading my apps to Windows Phone Mango, so they support multitasking and some cool new features such as multiple live tiles.

But now I’m going to show how to change the panorama title and the headers of the panorama items in WP7, something that took me a while to figure out, because changing the fontsize property doesn’t do the trick.

Instead you first need to make a custom template in your App.xaml file in the <Application.Resources> tag, like this:

<application.resources>
        <datatemplate x:key="SmallPanoramaTitle">
            <contentpresenter>
                <textblock text="{Binding}" fontsize="50" margin="0,70,0,0" />
            </contentpresenter>
        </datatemplate>
</application.resources>

This creates a templete we can use to change the font size of either the title (like in this case) or the headers. Now set the TitleTemplete property of the panorama control in your MainPage.xaml file, like this, to apply the template:

<controls:panorama title="my application" titletemplate="{StaticResource SmallPanoramaTitle}">

This will give the following result when running the application:

 small_title

You can also choose to change the size of all headers by setting the HeaderTemplate instead of TitleTemplate for the panorama control:

<font size="2"><controls:panorama title="my application" headertemplate="{StaticResource TinyPanoramaTitle}"></font>

Giving the following result if you reduce the font-size alittle or make another template for the headers (like I have done here):

 tiny_headers

You can also change individual headers by setting their HeaderTemplate instead of the panorama controls HeaderTemplate, like in the screenshot below. By changing the template you can change the most properties of the title and headers, like moving it using the margin property:

moved_header

Hope you enjoyed this quick tutorial! You can download the project here (for Windows Phone 7.1 Beta 2).