.NET

Wire Framing WP7 Apps With Cacoo

Tim Murphy — Mon, 21 Nov 2011 22:21:20 GMT

While looking for a free alternative to Sketchflow I landed on the Cacoo web site. Any developer who decides to use the free Visual Studio tools may find themselves doing the same search. The base functionality of Cacoo is free although there are certain features that have fees attached to them such as extended stencils and templates.

Cacoo doesn’t seem to have a template for WP7. It does have templates for iOS and Android development so I started with the Android template and started modidfying it for WP7. Funny thing is since Android has the same hardware vendors as Windows Phone the basic frame looks just right (I would swear I was looking at my Samsung Focus).

Below is the start of a new mockup for the user group that I help run.

I found that while Cacoo doesn’t have all the icons I need I am able to insert them from the Windows Phone Toolkit folder. If I put them off to the side as you can see above. I can simply copy and paste them into the appropriate place as needed.

Beyond that I have customized the main frame frame so I can have my base to work from. In the future I intend to create this as a stencil and if it looks good enough I would consider making it public.

My use of this product is still in it’s early phase, but it seems like a great way to start. Maybe if you use this to get going you can earn enough from your resulting apps to pay for something with more bells and whistles in the future.

del.icio.us Tags: WP7,Windows Phone 7 development,design,Cacoo,wire frame

Styling Windows Phone Silverlight Applications

Tim Murphy — Thu, 10 Nov 2011 12:56:04 GMT

If you have not developed with styles in Silverlight/XAML then it can be challenging and resources can be sparse depending on how deep you get. One thing that you need to understand is what level you can apply styles and how much they can cascade. What I am finding is that this doesn’t go to the level that we are used to in HTML and CSS.

While styles can be defined at a page level if you want to share styles throughout your application they should be defined in the App.xaml file. This is of course analogous to placing a style in your HTML file versus an external CSS file. This is the type of style I will concentrate on in this post.

The first thing to look it how styles associate to elements. TargetType defines the object type that your style will apply to. In the example below the style is targeting the TextBlock object type.

<Style x:Key="TextBlockSmallGray" TargetType="TextBlock">

Next we use a Setter which allows you to apply values for specific attributes of the target object type. The setters can be a simple value or complex. The first example here is simply applying a color to the background property of the target.

<Setter Property="Background" Value="White"/>

The second setter example here is for the same property, but we are applying a the definition of a LinearGradientBrush.

<Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush>
                        <GradientStop Offset="0" Color="Black"/>
                        <GradientStop Offset="1" Color="White"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>

The last thing I want to cover here is that you can leverage the system styles and then override or extend them. The BasedOn attribute of the Style tag allows this sort of inheritance. In the example below I am going to start with the PhoneTextTitleStyle and then override properties as needed.

<Style x:Key="TextBlockTitle" BasedOn="{StaticResource PhoneTextTitle1Style}" TargetType="TextBlock">

So now that we have our styles defined applying it is fairly straight forward. Add the style name as a static resource to the style property of the element in your page and off you go.

<Grid x:Name="LayoutRoot" Style="{StaticResource PageGridStyle}">

So this is one step in creating consistency in your application’s look. In future posts I will dig a little deeper.

del.icio.us Tags: windows phone 7,mobile development,windows phone 7 development,.NET,software development,design,UX

October 2011 Chicago IT Architects Group Recap

Tim Murphy — Wed, 19 Oct 2011 13:48:49 GMT

It was another engaging presentation at this month’s CITAG meeting as Joe Hummel presented functional programming and its implementation using F#. Some times it is fun to attack a mind bending problem and this was one of those times. Leaning about functional programming caused about the same brain cramps as moving from procedural to object oriented for the first time. Of course when you start to get it the effect is almost euphoric. I would suggest that if you haven’t looked into functional programming that you should check out Joe’s information below.

Joe’s information
http://www.joehummel.net/downloads.html

Please be sure to join us for our next presentation and if you enjoyed this month please bring your colleagues next time.

del.icio.us Tags: Chicago Information Technology Architects Group,Joe Hummel,Functional Programming,F#

Windows Phone Silverlight Poor Man's Double-Tap

Tim Murphy — Fri, 07 Oct 2011 05:22:56 GMT

I have seen a lot of articles about gestures but they require third party libraries or complex coding approaches. What I am going to present here isn’t strictly elegant or necessarily the best approach, but this is the way we would catch this type of event when we were still dealing with message loops.

For the app that I have been working on I need to take action on the double-tap of a list item. The first question you have to ask your self is what a double-tap really is. It is in simplest terms it is two taps within a specified amount of time. Given that I created a page level variable that holds a DateTime. If you set it each time the MouseEnter event fires and check it against the previous value you can imply a double tap. The code below is about as simple as it gets.

private void list_MouseEnter(object sender, MouseEventArgs e)
{
    DateTime tempTapTime = DateTime.Now;
    if(tempTapTime.Subtract(_lastTapTime).TotalMilliseconds < 250)
    {
        if (listEvaluations.SelectedIndex > -1)
        {
            // Do something
        }
    }
    else
    {
        _lastTapTime = tempTapTime;
    }
}

This may be kicking it old school but it gets the job done. Evaluate it against the other options out there and see what works best for the particular situation.

del.icio.us Tags: Windows Phone 7,WP7,software development,silverlight

Laying Out Windows Phone 7 ListBoxes

Tim Murphy — Fri, 02 Sep 2011 05:24:14 GMT

A listbox can be a very boring display surface, but it doesn’t have to be. Ok, so it may never be exciting. At least we can create a more flexible output.

The first element you need to learn about his the ItemTemplate which is in turn composed of a DataTemplate. As this combo implies it is bound to each item/data row. We will start organizing your base layout with a Grid control.

Within the Grid you can add a RowDefintions group. A RowDefinition helps when you want components to be stacked for a particular data row. The main attribute for a RowDefinition is it’s Height. There is no name attribute, but we will get to that point toward the end of this article.

<Grid.RowDefinitions>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="*"/>
</Grid.RowDefinitions>

The other main layout organization is kept in the ColumnDefinitions group. ColumnDefinition elements are best used for defining the width. I only created column definitions where they differ from full width of the row. In the case of this example the first of the two rows.

<Grid.ColumnDefinitions>
     <ColumnDefinition Width="300"/>
     <ColumnDefinition Width="90"/>
 </Grid.ColumnDefinitions>

Now that you have all of definition setup lets put it to use. In this example we have a project list. Each project has a name, a score and a description. We will add a group of TextBlock controls for each data element. They do not need to be in any particular order and I will show why next.

Now we can assign row and column associations to each TextBlock. Both rows and columns are assigned using a zero based index from the sequence they are defined in the XMAL. At this point the layout is set.

Grid.Row="0" Grid.Column="0"

The last thing we need to do is Databind the components of the list. Set the Text attribute of each TextBlock to an appropriate field of the object your are binding to each object.

Text="{Binding ProjectName}"

The final code is listed below.

<ListBox Height="330" HorizontalAlignment="Left" Margin="32,20,0,0" Name="listEvaluations" VerticalAlignment="Top" Width="397" ItemsSource="{Binding}" MouseEnter="listEvaluations_MouseEnter"> 
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="300"/>
                    <ColumnDefinition Width="90"/>
                </Grid.ColumnDefinitions>
                <TextBlock HorizontalAlignment="Left" Grid.Row="0" Grid.Column="0" Name="ProjectName" Text="{Binding ProjectName}" FontSize="{StaticResource PhoneFontSizeLarge}"></TextBlock>
                <TextBlock HorizontalAlignment="Right" Grid.Row="0" Grid.Column="1" Name="ProjectTotal" Text="{Binding Total}" FontSize="{StaticResource PhoneFontSizeLarge}"></TextBlock>
                <TextBlock Name="ProjectDescription" Grid.Row="1" Text="{Binding Description}" FontSize="{StaticResource PhoneFontSizeSmall}"></TextBlock>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

And here is what the result looks like.

There is a lot more you can do with this approach by using other controls in your template, but this should give you the basic concepts you need.

del.icio.us Tags: Windows Phone 7,WP7,Software Development

WCF Deployment To IIS

Tim Murphy — Mon, 29 Aug 2011 11:03:54 GMT

If you are developing you WCF service for web service deployment under IIS and coding with the Visual Studio web server you are in for a rude awakening when it comes time to deploy your solution. Ok, so that is a little over dramatic, but there are a few steps and precautions you need to know about.

Below are the main steps to deploying your application to IIS assuming WCF is already installed and registered.

The first step is to create an application pool. Make sure that for your .NET 3.5 WCF service that the application pool is set to the 2.0 .NET framework.

Next you need to create a new site. The application pool for this site should be the one that you just created.

So here is that precaution I was talking about earlier. You run into a number of hurdles if you try to share a site with a WCF service and another application. The easiest way around that is to deploy each service project to its own site. I am still working on how to get them to co-exist and will post that information when I have it resolved.

Lastly, at a minimum you need to copy the bin directory, web.config and .svc files to the physical directory that your new site references. This configuration should work in most cases. In the future I will address some of the common alternate configuration. Stay tuned.

del.icio.us Tags: WCF,Windows Communication Foundation,Deployment

Creating Emails For Windows Phone 7

Tim Murphy — Mon, 22 Aug 2011 20:31:04 GMT

There are many reasons that you may want to add email capability to your Windows Phone 7 application. There are a number of ways you can communicate information out from an application.

The mechanism for sending email from your WP7 application is the EmailComposeTask API. The difference between this API and the one that you would use for an ASP.NET application is that it opens a screen to allow the user to select an account to use and then creates a message which the user then has to send. This makes sense since the we are talking about end user applications and not server processes.

Below is a quick look at the code required to send an email using the EmailComposeTask.

EmailComposeTask emailTask = new EmailComposeTask();

// Not setting the "To" property will prompt the user
//emailTask.To = "jqsample@somemail.com";

emailTask.Subject = "Your subject";

emailTask.Body = "Here is where the body goes.";
emailTask.Show();

There are two drawbacks that I would like to see addressed. The first is that you cannot create a HTML body. The second is that you can’t attach a file. Hopefully these will be addressed in future versions.

del.icio.us Tags: WP7,Windows Phone 7,Software Development,Email

The Power Of Windows Phone 7 Tasks

Tim Murphy — Fri, 19 Aug 2011 14:04:59 GMT

One of the things that is important to learn when you are developing any application is how it will interact with the environment it lives in. I’m not talking about simply interacting with files or database but with major resources. With WP7 there are a number of things such as the photos, browser, maps and the phone itself that your application may be concerned with.

The WP7 development API includes a number of access points to give your application greater reach. These APIs can be found here.

They APIs fall into the following main areas:

Contacts
Bing Maps
Camera
Email
Market Place
Messaging

In future posts I will explore some of these APIs. Stay tuned.

del.icio.us Tags: Windows Phone 7,WP7,Software Development,.NET

WCF Service Development Basics

Tim Murphy — Thu, 18 Aug 2011 07:44:35 GMT

Part of the fun of being a consultant is that the technology you use changes from day to day. Recently it is WCF which, while knowing the concepts of since it came out I haven’t used up until now.

The nice thing is that it really isn’t any harder to develop for than a normal ASP.NET web service. A couple of the attributes change and which project type you start with is different, but it is still message based services.

Just like the method of a web service needs a Webmethod attribute a method in a WCF service requires a OperationContract attribute. The main difference is that you start by defining your operations in an interface. Once you have an interface like the extract below you simply create an implementation class based on the interface.

[ServiceContract]
public interface IMyServices
{
    [OperationContract]
    MyCustomReturn GetMyData(MyDataRequest dataRequest);

To get your WSDL and its associated XSD to generate in a way that is intelligible by other developers you need to effectively use the DataContract and DataMember attributes. The resulting class will look similar to the extract below.

[DataContract]
public class MyCustomReturn
{
    [DataMember]
    public string UserEmail;
    [DataMember]
    public string BusinessUnitId;
    [DataMember]
    public ClientAddressInfo ClientAddressInformation;

Once you have this base the rest of the development is straight up .NET. The other thing you need to know is how to get at your WSDL and XSD. The WSDL is the easy part. Add “?wsdl” to the URL for your .svc file.

Finding the XSD isn’t that difficult. If you look in the WSDL definition there is a tag for <wsdl:types>. Within this tag you will find an <xsd:imports> that ties back to your service’s namespace. Normally this is just adding a query string of “?xsd=xsd2” to your service URL.

Lastly you need to learn how to use the WCF Test Client. The one way I have found to launch it is to make sure your service code file is active in the Visual Studio editor and hit F5.

This tool will allow you to do most of you basic testing of the service you just built.

Enjoy!

del.icio.us Tags: WCF,Windows Communication Foundation,.NET Development

Windows Phone 7 TextBox InputScope

Tim Murphy — Wed, 17 Aug 2011 20:16:04 GMT

I originally started looking for how to make a TextBox have autocomplete capability. Strangely all the articles said that it couldn’t be done. The last thing you want is for your applications to make your users struggle entering information when every other application gives them a quicker entry method. So what is the solution?

The TextBox tag has an InputScope property which if you set it to Text it builds a dictionary list as the user types. For the other InputScope types it mainly changes the keyboard defaults.

In all this one small change can have a large impact on the usability of your app.

del.icio.us Tags: WP7,Windows Phone 7,Software Development