avatar

Unity 3.5 Island Demo (blue/green water color)

by on Wednesday, April 18th, 2012, under Unity Game Development

Hey everyone, here’s a video showing how to get the blue / green underwater color to work in the Island Demo under Unity3D 3.5.

The UnityScript can be downloaded here:
WaterLightmapFog.zip

Tags: , , , ,

Wednesday, April 18th, 2012 Unity Game Development No Comments
avatar

Demonstration of my studio’s audio recording quality

by on Tuesday, September 22nd, 2009, under Listen, Music

Here is a voice recording created using the equipment in my studio. I should note that the studio has received no acoustical design at this point (no dampening foam installed and no careful mic positioning). The studio is approximately 10ft x 12ft with the mic near a corner (2ft from the 10ft wall, 4ft from the 12ft wall; I am facing the corner during recording). The quality of playback will also be affected by the quality or your headphones or monitors (speakers, not screens). Its also hard to compare how “life-like” this is if you have not heard my voice in person.

This recording uses a practical 24bit resolution with a 44.1kHz sample rate (CD Quality is 16bit/44.1kHz). The M-Audio Fast Track Pro actually supports up to 24bit/96kHz.

http://www.jadeskaggs.com/wp-content/uploads/2009/09/vocal-demo.aif

Tags: , , , , , ,

Tuesday, September 22nd, 2009 Listen, Music 2 Comments
avatar

Creating a custom glass listbox with XAML in WFP

by on Saturday, August 8th, 2009, under Computer Programming, Tutorials

WPF XAML Glass ListBox

WPF XAML Glass ListBox

Our next adventure into the Windows Presentation Foundation (WPF) will take us through creating a glass style for a listbox with XAML.  Much of what we will do here is an extension of our first XAML tutorial about creating a glass button.  I you haven’t done that tutorial, I would recommend it as it will explain a lot of the stuff we are doing here.    Our list box requires considerably more effort to change its look because we don’t only style a single control like a button.  We have to style the list box itself, the list box items, the scroll buttons and the “thumb” between them, and build the layout template for the scrollbar.   So, without further ado, lets get started!

Add a new Resource Dictionary to your project and name it “GlassListBox.xaml”.  Now, add the following style for our ListBox inside of your ResourceDictionary tags in the GlassListBox.xaml file.

  <Style x:Key="GlassListBox" TargetType="{x:Type ListBox}">
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListBox}">
          <Border BorderBrush="#99FFFFFF" 
                  Background="#88000000" 
                  BorderThickness="4" 
                  CornerRadius="20,20,20,20">
             <ScrollViewer Margin="0" Focusable="false">
                <StackPanel Margin="10" IsItemsHost="True">
                </StackPanel>
              </ScrollViewer>
          </Border>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

This will be the background of our list box that contains everything. We added a ScrollViewer control to allow scrolling when the contents within the control go beyond the controls borders. A StackPanel is then placed inside the scroll viewer and this will be the container that holds any items we bind to the list (items like “Metroid”, “Zelda”, etc. will stack up in the stack panel).

Next, add the following style for the ListBoxItem control just below your ListBox’s closing Style tag (but still inside the ResourceDictionary tags).

  <Style x:Key="{x:Type ListBoxItem}" 
         TargetType="{x:Type ListBoxItem}">
    <Setter Property="Height" Value="66" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListBoxItem}">
          <Button Name="ListItem" 
                  Style="{DynamicResource GlassButton}" 
                  Width="Auto" 
                  Height="Auto">
            <ContentPresenter Name="listItemContent" 
                              Grid.RowSpan="2" 
                              HorizontalAlignment="Left" 
                              Width="300" 
                              Margin="0,0,0,0" />
          </Button>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

Our list box will contain buttons so a user could scroll through options and click on one to proceed to the next screen. We greatly simplify our code here by calling upon the style we created in the GlassButton XAML tutorial. The last thing we need to add is the ContentPresenter which will display our ListItem text, which in the picture above, is the name of a video game.

NOTE: You may need to manually adjust the ContentPresenter Width to suit your layout needs as I have not found a way to make the list items automatically expand with the control yet. If you know how to do this, please leave a comment so I can update this post and give you creds!

Next, we add in a third style for the scroll up and scroll down buttons in the scroll bar.

  <Style x:Key="ScrollBarLineButton" TargetType="{x:Type RepeatButton}">
    <Setter Property="Focusable" Value="false"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type RepeatButton}">
          <Border x:Name="RepeatButtonBorder" 
                    CornerRadius="14,14,14,14" 
                    BorderThickness="4,4,4,4" 
                    RenderTransformOrigin="0.5,0.5" 
                    BorderBrush="#88FFFFFF">
            <Border Background="#88000000"  
                    CornerRadius="14,14,14,14" 
                    x:Name="background">
              <Grid>
                <Grid.RowDefinitions>
                  <RowDefinition Height="0.4*"/>
                  <RowDefinition Height="0.6*"/>
                </Grid.RowDefinitions>
 
                <Path HorizontalAlignment="Center"
                      Grid.RowSpan="2"
                      VerticalAlignment="Center"
                      Stretch="UniformToFill" 
                      Margin="10,18,10,18"
                      Fill="White" 
                      Data="{Binding Path=Content,
                      RelativeSource={RelativeSource TemplatedParent}}" />
              </Grid>
            </Border>
          </Border>
          <ControlTemplate.Triggers>
            <Trigger Property="IsPressed" Value="true">
              <Setter Property="RenderTransform" 
                      TargetName="RepeatButtonBorder">
                <Setter.Value>
                  <TransformGroup>
                    <ScaleTransform ScaleX="0.9" ScaleY="0.9"/>
                  </TransformGroup>
                </Setter.Value>
              </Setter>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

Most of this should look familiar if you have completed the GlassButton tutorial with the exception of the type of control used and how we display the controls contents. For the arrow buttons on the scroll bar, we are using a RepeatButton control. The actual contents of the button (the up arrow and down arrow) are set by using the “Path” tag (a control that lets us draw with coordinates, explained in detail later). The data attribute allows us to bind content in the ScrollBar ControlTemplate later. By doing this, we are able to use this same style for both buttons without hard-coding the contents.

Our next style is very simple since this style is designed to be invisible. I’ll explain below :)

  <Style x:Key="ScrollBarPageButton" TargetType="{x:Type RepeatButton}">
    <Setter Property="IsTabStop" Value="false"/>
    <Setter Property="Focusable" Value="false"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type RepeatButton}">
          <Border Background="Transparent" />
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
Default Page Button

Default Page Button

This style is for the scroll bar page button, which is the area between the line buttons at the top and bottom, and the “thumb” (the button in the middle that you can click and drag). Its the area you click to scroll a page at a time. We want this to be transparent to give the appearance that you are clicking on the scroll bar itself, otherwise, it would appear that there is an actual button there which would be very unusual looking (see graphic on the right for a glimpse of the scroll bar without the transparent page button style applied).

Next, we define a style for the scroll bar thumb (the slider in the middle of the scroll bar).

  <Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}">
    <Setter Property="IsTabStop" Value="false"/>
    <Setter Property="Focusable" Value="false"/>
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Thumb}">
          <Border x:Name="Border" 
                          CornerRadius="14,14,14,14" 
                          BorderThickness="4,4,4,4" 
                          BorderBrush="#88FFFFFF">
            <Border Background="#88000000" 
                    CornerRadius="13,13,13,13" 
                    x:Name="background">
              <Grid>
                <Grid.RowDefinitions>
                  <RowDefinition Height="0.4*"/>
                  <RowDefinition Height="0.6*"/>
                </Grid.RowDefinitions>
 
                <Border Grid.Row="0" CornerRadius="13,13,0,0">
                  <Border.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                      <GradientStop Color="#08FFFFFF" Offset="0"/>
                      <GradientStop Color="#88FFFFFF" Offset="1"/>
                    </LinearGradientBrush>
                  </Border.Background>
                </Border>
 
              </Grid>
            </Border>
          </Border>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

There is nothing new here that haven’t already covered, so lets move on to defining the scroll bar control template.

Our ControlTemplate will define how the scroll bar is built. It defines where the arrow buttons, page buttons, and the thumb controls are positioned, and it also establishes the content of the arrow buttons (the arrow image).

  <ControlTemplate x:Key="VerticalScrollBar" TargetType="{x:Type ScrollBar}">
    <Grid Width="60" >
      <Grid.RowDefinitions>
        <RowDefinition MaxHeight="60"/>
        <RowDefinition Height="0.00001*"/>
        <RowDefinition MaxHeight="60"/>
      </Grid.RowDefinitions>
      <Border Grid.RowSpan="3" CornerRadius="18" Background="#88000000" />
      <RepeatButton Grid.Row="0" 
              Command="ScrollBar.LineUpCommand"
              Style="{StaticResource ScrollBarLineButton}"
              Content="M 0 4 L 8 4 L 4 0 Z" />
      <Track Name="PART_Track" Grid.Row="1" IsDirectionReversed="true">
        <Track.DecreaseRepeatButton>
          <RepeatButton Style="{StaticResource ScrollBarPageButton}" 
                        Command="ScrollBar.PageUpCommand" />
        </Track.DecreaseRepeatButton>
        <Track.Resources>
          <!-- Thumb's minimum height is half of this metric -->
          <sys:Double x:Key="{x:Static 
                              SystemParameters.VerticalScrollBarButtonHeightKey}">
            120
          </sys:Double>
        </Track.Resources>
        <Track.Thumb>
          <Thumb Style="{StaticResource ScrollBarThumb}" />
        </Track.Thumb>
        <Track.IncreaseRepeatButton>
          <RepeatButton Style="{StaticResource ScrollBarPageButton}" 
                        Command="ScrollBar.PageDownCommand" />
        </Track.IncreaseRepeatButton>
      </Track>
      <RepeatButton Grid.Row="3"
              Style="{StaticResource ScrollBarLineButton}"
              Command="ScrollBar.LineDownCommand"
              Content="M 0 0 L 4 4 L 8 0 Z"/>
    </Grid>
  </ControlTemplate>

Our ScrollBar control template uses a grid with 3 cells. The first contains the “scroll up” RepeatButton, the second cell contains a Track control for page scrolling and the thumb control, and the third cell contains the scroll down RepeatButton. Take a look at the first RepeatButton defined in the grid, the scroll up button, and I will explain the three attributes we are setting:

  1. Style: The style we defined earlier as ScrollBarLineButton
  2. Command: ScrollBar.LineUpCommand tells the control that when we click this button, it should scroll the list up by the amount set in the “SmallChange” property of the control
  3. Path Markup Example

    Path Markup Example

  4. Content: M 0 4 L 8 4 L 4 0 Z will display an up arrow. I know what you are thinking… What the?!? Well, this is actually drawing a shape using XAML path markup! The letters M, L, and Z will define a starting point (M), create a line to the next point (L), and end the drawing by connecting the current point to the starting point (Z). So, we are starting our drawing for the up arrow with M at coordinate 0,4 (M 0 4), then we draw a line to coordinate 8,4 (L 8 4), followed by a line to coordinate 4,0 (L 4 0), and finally we close up the shape (Z). If you would like to learn more about XAML Path Markup, take a look at this MSDN article:
    XAML Path Markup Syntax

You might remember in our style for the ScrollBarLineButton, we set the Data attribute to use a “RelativeSource” of the TemplatedParent’s Content to supply the control content. This is fulfilled by the Content attribute we just assigned.

In the second cell, we define a Track element with three parts. A page up button, the thumb, and a page down button. Remember that the style we use for the page up and page down buttons is simply a transparent style so that you don’t see an actual button. The command attribute tells the control what it should do when each button is clicked, and the rest this control should be pretty self explanatory.

In the third cell, we define the scroll down button. Again, nothing new here that we didn’t discuss with the scroll up button.

Finally, we define the style that lays out the ScrollBar onto the ListBox control.

  <Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}">
    <Setter Property="OverridesDefaultStyle" Value="true"/>
    <Style.Triggers>
      <Trigger Property="Orientation" Value="Vertical">
        <Setter Property="Width" Value="60"/>
        <Setter Property="Height" Value="Auto" />
        <Setter Property="Template" Value="{StaticResource VerticalScrollBar}" />
      </Trigger>
    </Style.Triggers>
  </Style>

This should all be pretty self explanatory as well :).

To use the control, you will need to add a reference into your App.xaml file so the program knows about the control. Inside of the <ResourceDictionary.MergedDictionaries> tags, just add the following line:

<ResourceDictionary Source="GlassListBox.xaml"/>

That’s it, your GlassListBox is ready to be used. Just add it to your form and roll. But remember, you might need to manually adjust the ListBoxItem width as I had mentioned above.

You can download this project here!

Tags: , , , , ,

Saturday, August 8th, 2009 Computer Programming, Tutorials 5 Comments
avatar

Music by Jade Skaggs – City Lights

by on Saturday, July 25th, 2009, under Listen, Music


City Lights is my second original music production to be released to the public. This track has a very distinct feel to it and it reminds me particularly of driving through an unfamiliar city at night time, being awe-stricken by the magnificent lights and structures surrounding me.

Download

Jade Skaggs – City Lights (320 kbps mp3)

Jade Skaggs – City Lights (24 bit, 44.1k sample rate AIFF lossless)

Please share your comments!

Tags: , , , , , ,

Saturday, July 25th, 2009 Listen, Music No Comments
avatar

Music by Jade Skaggs – Til Himlen

by on Sunday, July 19th, 2009, under Listen, Music


Til Himlen is my first original music production to be released to the public. The name is derived from the Danish language, and it means “to heaven”, which is a representation of the uplifting nature of this track. I developed the track using only the equipment I have in my studio, and it took me about 16 hours to put it together (though I have years of practice producing music as a hobby).

Download

Jade Skaggs – Til Himlen (320 kbps mp3)

Jade Skaggs – Til Himlen (24 bit, 44.1k sample rate AIFF lossless)

Please share your comments!

Tags: , , , , , ,

Sunday, July 19th, 2009 Listen, Music No Comments
avatar

Creating custom glass buttons with XAML in WPF

by on Monday, May 4th, 2009, under Computer Programming, Tutorials

WPF XAML Glass Button

Glass Button

Today, we are going to take a look at how one would create a custom style for a WPF (Windows Presentation Foundation) button control. We will change the bland default button into a glass button! When working with the Windows Presentation Foundation to style a button, we simply create an XAML document to hold the style, and then we will apply the style within the form designer (much like how CSS styles are applied to HTML elements). So, lets get started! :)

Create a resource dictionary in your WPF Application project by right-clicking on your project in the Solution Explorer, and choosing Add -> New Item.  Select Resource dictionary and name it GlassButton.xaml

wpf-xaml-create-a-resource-dictionary

In the newly created resource dictionary, we will define a Style that we can apply to our buttons to change the way they look.  Initially, your GlassButton.xaml file will have only the following code:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
 
</ResourceDictionary>

We want to add a Style element so that we can change the properties of our control:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Style x:Key="GlassButton" TargetType="{x:Type Button}">
    <Setter Property="FontSize" Value="42" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
 
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
</ResourceDictionary>

The styles “x:Key” attribute is what we will use to identify the style later when we apply it to a button control. The “TargetType” attribute declares what type of control our style will be used for, and in our case, it is the button. At this point, we have a couple of default properties setup for our control; the font is enlarged and the foreground color is changed to white. Next, we need to change the template property for the control to make it look like a glass button. You will notice that this property is structured a little bit differently. That is because we are defining the template inline and this requires the creation of a complex object, the ControlTemplate.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Style x:Key="GlassButton" TargetType="{x:Type Button}">
    <Setter Property="FontSize" Value="42" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Border x:Name="ButtonBorder" 
                  CornerRadius="25" 
                  BorderThickness="4" 
                  Background="#AA000000"  
                  BorderBrush="#99FFFFFF"
                  RenderTransformOrigin="0.5,0.5">
              <ContentPresenter x:Name="ButtonContentPresenter"
                                VerticalAlignment="Center"  
                                HorizontalAlignment="Center"/>
          </Border>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
</ResourceDictionary>

Now that we have the template declared, lets walk through what we did. First, we laid out the main border and the tinted background of the button by using a “Border” element. We gave the button border a name (used later) and we also gave our button rounded corners by setting the CornerRadius to 25 units on each corner. You could also set the radius unit of each individual corner by specifying “25,25,25,25” which will define the top-left radius and continue clockwise around to the other corners.

Note that I said units and not pixels. One of the benefits of the Windows Presentation Foundation is it will display graphics based on the dpi setting of your device. For example, if your dpi settings are correct in your OS, a button that is 1″ wide on a 15″ screen running at 1024×768 would also be exactly 1″ wide on a 20″ screen running at 1024×768. If the controls were pixel based, the first button would be 1″ wide and the later button would be about 1 1/3″ wide.

Next we set the width of all borders to 4 units wide and apply some colors to the element. The colors used are in HTML color format, but there is a twist. XAML colors support an alpha channel (a.k.a. transparency) so the hexadecimal value we use represents the alpha, red, green and blue channels. Since we want our button background to look a little tinted, we will use the color black and make it partially transparent (#AA000000 – In decimal, this is Alpha=170, Red=0, Green=0, Blue=0). We also want the border to be white and partially transparent, so we use #99FFFFFF. The final property we set for the main border element is the RenderTransformOrigin. This is a percent based x,y value that indicates where the control will be pinned down when a transform later changes the control. We will discuss this more later, but for now, set the origin to the center of the control, 0.5, 0.5 (x origin is 50% across, y origin is 50% down).

WPF XAML Flat Glass Button

WPF XAML Flat Glass Button

The “ContentPresenter” element is the last item we add in this step. This element is what will display the text on the face of the button, so we obviously will want this inside the border. All we do here is give it a name for good practice and center the text.

Now you have a simple button style that looks like a flat piece of glass. If you want to use this style now so that you can see what it looks like, skip ahead to the “Applying our style to a control” section.

Now its time to add a little depth to our button and make a reflection on it so it looks curved and shiny. To do this we will update the code as follows:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Style x:Key="GlassButton" TargetType="{x:Type Button}">
    <Setter Property="FontSize" Value="42" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Border x:Name="ButtonBorder" 
                  CornerRadius="25" 
                  BorderThickness="4" 
                  Background="#AA000000"  
                  BorderBrush="#99FFFFFF"
                  RenderTransformOrigin="0.5,0.5">
            <Grid>
              <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="1.7*"/>
              </Grid.RowDefinitions>
              <Border Grid.Row="0" CornerRadius="23,23,0,0">
                <Border.Background>
                  <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <GradientStop Color="#08FFFFFF" Offset="0"/>
                    <GradientStop Color="#88FFFFFF" Offset="1"/>
                  </LinearGradientBrush>
                </Border.Background>
              </Border>
              <ContentPresenter x:Name="ButtonContentPresenter"
                                VerticalAlignment="Center"  
                                HorizontalAlignment="Center" 
                                Grid.RowSpan="2" />
            </Grid>
          </Border>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
</ResourceDictionary>

We have added a Grid element to our style because a Border element can only have one child, but we want a reflection and a content presenter. The grid can have multiple children and it will allow for proper placement of our reflection. The Grid has 2 rows defined, and the only attribute we set for each row is the height. Note the ” * ” in use. What this will do is make sure all rows fill up 100% of the grid. The number in front of the asterisk is a multiplier, so in our case, row 2 is 1.7 times the height of row one. If I had used 2*, the second row would be twice as high as the other row (i.e. 2/3 the height of the grid).

Now we add a border object to simulate the reflection. You can see that we are binding the border to the first row in the grid by setting the Grid.Row attribute to 0, and we are also making the top-left and top-right corners rounded to fit into the outer border. With this border element, we are setting the background property to resemble the reflection, but we don’t use a simple color like we have done in the past. We instead define a LinearGradientBrush to blend from a mostly transparent white to a partially transparent white. The StartPoint and EndPoint attributes of the LinearGradientBrush are percent based x,y coordinates that will determine where the blending starts, ends, and in what direction the blend will occur. Using 0.5,0 will start at the top center, and 0.5,1 will stop at the bottom center of the border object. There are also 2 GradientStops defined here that represent the transparent white and the semi-transparent white colors that the gradient will use. The offset attribute will determine (as a percent based decimal) where the color should occur. For our case, we want the transparent white to occur at the beginning of the gradient, and the semi-transparent white to occur at the end. Imagine if your gradient had 3 colors, you might put them at offsets of 0, 0.5, and 1 to see an equal blend distance between each color.

Finally, we move the content presenter element into the grid object and add the attribute Grid.RowSpan=”2″ so that it can span the entire height of the grid.

Now we have a pretty glass button, but it wouldn’t do much if you were to click on it. We will create a trigger to shrink the button a little bit so it looks like it is depressing when you click on it. Update your code as follows:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Style x:Key="GlassButton" TargetType="{x:Type Button}">
    <Setter Property="FontSize" Value="42" />
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type Button}">
          <Border x:Name="ButtonBorder" 
                  CornerRadius="25,25,25,25" 
                  BorderThickness="4,4,4,4" 
                  Background="#AA000000"  
                  BorderBrush="#99FFFFFF"
                  RenderTransformOrigin="0.5,0.5">
            <Grid>
              <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="1.7*"/>
              </Grid.RowDefinitions>
              <Border Grid.Row="0" CornerRadius="23,23,0,0">
                <Border.Background>
                  <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                    <GradientStop Color="#08FFFFFF" Offset="0"/>
                    <GradientStop Color="#88FFFFFF" Offset="1"/>
                  </LinearGradientBrush>
                </Border.Background>
              </Border>
              <ContentPresenter x:Name="ButtonContentPresenter"
                                VerticalAlignment="Center"  
                                Grid.RowSpan="2" 
                                HorizontalAlignment="Center"/>
            </Grid>
          </Border>
          <ControlTemplate.Triggers>
            <Trigger Property="IsPressed" Value="True">
              <Setter Property="RenderTransform" TargetName="ButtonBorder">
                <Setter.Value>
                  <TransformGroup>
                    <ScaleTransform ScaleX="0.9" ScaleY="0.9"/>
                  </TransformGroup>
                </Setter.Value>
              </Setter>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
</ResourceDictionary>

In this update, we have created a trigger event that will occur when the buttons “IsPressed” property is true. When this occurs, we will apply a RenderTransform to the element named “ButtonBorder”. In our particular case, we are using a ScaleTransform to scale down the size of our button border to 90% when pressed. If you remember correctly, we set a RenderTransformOrigin to the center of the button in a previous code snippet. This will center the transform action so the button will appear to adjust evenly around the edges with the center locked in place. If we did not set this, the button would do all scaling while pinned in the top left corner, and only the right side and the bottom would visibly move. If that doesn’t make sense, just try it and you’ll see what I mean. 😉

Applying our style to a control

To use our GlassButton style, we must now add a resource reference into our App.xaml file. My App.xaml looks like the following; I have only added the <ResourceDictionary Source=”GlassButton.xaml”/> line:

<Application x:Class="Demo.App"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  StartupUri="Window1.xaml">
  <Application.Resources>
    <ResourceDictionary Source="GlassButton.xaml"/>
  </Application.Resources>
</Application>

Finally, open the XAML code for your window and add a button element with the style attribute set to “{DynamicResource GlassButton}” (note that GlassButton is the x:Key value we set for the style element). In my particular application, the line of code looks like this:

    <Button Style="{DynamicResource GlassButton}" 
            Grid.Column="1" 
            Margin="0,0,18.577,17.148" 
            Name="button1" 
            Height="91.456" 
            VerticalAlignment="Bottom" 
            HorizontalAlignment="Right" 
            Width="207.764">Button</Button>

Now when you run your application, you will have a beautiful glass button!

Tags: , , , , ,

Monday, May 4th, 2009 Computer Programming, Tutorials 7 Comments
avatar

A review of “Good to Great” by Jim Collins

by on Sunday, April 19th, 2009, under Books, Business, Reviews

Good to Great

Good to Great

The book “Good to Great: Why Some Companies Make the Leap… and Others Don’t” is all about identifying the things that differentiate good companies and great companies.  This may sound a bit obvious in the title, but there is something very different about this book in comparison to many of the other books I have read.  The “identifying” part indicates that these differences are based on studies, data, and real world evidence, not the authors “opinions” on what makes a great company.  These studies consist of many good companies, great companies, and even extinct companies, and they take a deep look into what internal changes occur as a good company transitions to a great company.

I love the way this book looks historically at the actual data to determine which criteria will identify a great company, what makes that company meet said criteria, and then includes the relevant data with every technique and characteristic that the great companies employ to show how these things promote greatness.  This book seems to hold very little bias (if any) to the authors preconceived notions of greatness, and focuses on the brutal facts.  I am confidant that the research team has identified consistent and accurate differences between the great companies and everyone else, and then manages to explain why these concepts help great companies while, in their absence, they hinder good companies.

As an aspiring entrepreneur, this book has really helped me to define my business ideas and to identify how I can best pursue them.  I have enjoyed the stories about great companies in their infancy since I can relate to them the most, and I was very happy to hear that my venture plans thus far are quite similar to how Hewlett-Packard got started (declaring at a high level what the company would do, and later trying out a number of products in very unrelated markets before deciding on which markets and products to target.)

Summary

This is one book that I have already started rereading as I feel there is a lot of valuable information here that warrants a second absorbtion.  So needless to say, I would recommend Good to Great to anyone who is either running a businesses currently, or who intends to run one in the future.  The book has changed my thought process in how to handle business, and I am confident that it can help your business too.  Even if your company has already transitioned to greatness, the insight into other great companies holds plenty of value, and more likely than not, it will reveal some new ideas.

Tags: , ,

Sunday, April 19th, 2009 Books, Business, Reviews No Comments
avatar

A review of “The 4-Hour Workweek” by Timothy Ferriss

by on Tuesday, April 7th, 2009, under Books, Reviews

The 4-Hour Workweek

The 4-Hour Workweek

The title of this book attracted me at first sight.  I mean, who could resist the idea of a four hour workweek?  This book is certainly an interesting read for anyone who is an entrepreneur as it covers a number of topics around working more effectively, and then automating your duties in ways that, realistically, only an entrepreneur in certain industries can.

For the employee, the author details many ideas built around focusing intensely so that you can complete more work within smaller amounts of time.  Ideas like only checking your business email once or twice per day, avoiding office interruptions by wearing a telephone headset so people will assume you are on the phone, saying no to meetings, and so on.  Once you learn how to be hyper-productive, you can try to use this as a bargaining point for reduced hours to help free up your time.  Later in the book, the author discusses how you can convince your employer to let you work from home which will leave you capable of traveling while you are working.  This methodology is clearly only valid for certain industries, and it would tend to leave one far from a 4 hour work week.

The title gains much credibility in the entrepreneurs perspective.  The author makes some very good points that help reduce the time required to run your business (like NOT actively pursuing your customers who consume 95% of your time and only generate 5% of your revenue).  If you run a nutritional supplement company (as Mr. Ferriss does), it is much easier to unload your duties and still be able afford your cost of living.  There are also many great resources in the book for starting up a business, marketing processes, manufacturing, and managing customer service all with the goal of automation in mind.

Summary

This book is very inspirational and quite funny as well; I cannot tell you how many times I have busted up laughing while reading it.  I love the part where the author walks you through a fill-in-the-blank method of getting fired.  Many people who have read this book claim that it has changed their life, and I can see that.  I do think about my time a little bit differently now as it is the one thing that we cannot “reverse” once we lose it.  We shouldn’t be working so hard during the most physically capable years of our life so that we can relax only in our old age (assuming we live that long).  As an entertaining, insightful, and motivating read, I would recommend this book to anyone who wants to run their own business someday.

Tags: , ,

Tuesday, April 7th, 2009 Books, Reviews No Comments
avatar

A review of “How to Win Friends and Influence People” by Dale Carnegie

by on Sunday, April 5th, 2009, under Books, Reviews, Self Improvement, Well-Being

How to Win Friends and Influence People

How to Win Friends and Influence People

I recently picked up this book to learn how to become a more effective speaker not knowing that I would take so much away from it.  The lessons in this book seem to extend far beyond the limits of speaking, and I find that it is a very good read for anyone who assumes a leadership role in business and in life.  Whether you are leading a team of employees through a tight deadline or a group of children to the dentist, this book will help you decide how to handle many situations and get the results you want.  Dale Carnegie introduces his ideas while also providing many useful (and true) stories that illustrate how to execute the techniques.

The main point I take away from this book is to always make the interactions you have with people a positive experience for those people.  For example, don’t criticize people directly for doing things wrong, but rather focus on their strong points and subtly indicate ways they can improve.  Make them think that the ideas of what needs improvement were their ideas and they will run with them.  Don’t argue with people; you can never win an argument.  If you’re wrong, you will lose, and even in you are right, you will have left the other person with damaged pride and you ultimately spent all of your time arguing rather than getting anything done.  If you simply admit that you may be wrong (even if you know you are not) and if you emphasize the points in their argument that you agree with, the situation will be diffused and the other person will start listening to you with an agreeable attitude.  This is one area where I know I struggle because I am “always right” in my own mind.  It will be interesting to see how my interactions change with people.

After reading this book, it is clear to me that some of my past employers (and my current employer) have a grasp on the concepts presented in this book.  Maybe they have even read it.  The interesting thing about the companies who utilize the techniques in this book is that their employees generally work towards the common interest of the company, not just for a paycheck.  The general mood amongst employees is positive and turnover rates are lower.  Of my departments current employees, the average employment term is approximately 8 years.  I honestly believe that there is nothing more important to this factor than the leadership techniques of the management and the owners.  We are all friends outside of work and most of us enjoy coming into the office on a day to day basis.

The more recent revisions of the book have four major sections which cover the following concepts in depth.

Fundamental Techniques in Handling People

  1. Don’t criticize, condemn or complain.
  2. Give honest and sincere appreciation.
  3. Arouse in the other person an eager want.

Six Ways to Make People Like You

  1. Become genuinely interested in other people.
  2. Smile.
  3. Remember that a man’s Name is to him the sweetest and most important sound in any language.
  4. Be a good listener. Encourage others to talk about themselves.
  5. Talk in the terms of the other man’s interest.
  6. Make the other person feel important and do it sincerely.

Twelve Ways to Win People to Your Way of Thinking

  1. Avoid arguments.
  2. Show respect for the other person’s opinions. Never tell someone they are wrong.
  3. If you’re wrong, admit it quickly and emphatically.
  4. Begin in a friendly way.
  5. Start with questions the other person will answer yes to.
  6. Let the other person do the talking.
  7. Let the other person feel the idea is his/hers.
  8. Try honestly to see things from the other person’s point of view.
  9. Sympathize with the other person.
  10. Appeal to noble motives.
  11. Dramatize your ideas.
  12. Throw down a challenge.

Be a Leader: How to Change People Without Giving Offense or Arousing Resentment

  1. Begin with praise and honest appreciation.
  2. Call attention to other people’s mistakes indirectly.
  3. Talk about your own mistakes first.
  4. Ask questions instead of giving direct orders.
  5. Let the other person save face.
  6. Praise every improvement.
  7. Give them a fine reputation to live up to.
  8. Encourage them by making their faults seem easy to correct.
  9. Make the other person happy about doing what you suggest.

Summary

I think that everyone could benefit from reading this book.  Some of the stories provided seem to be a little far fetched to think their results would be common, but that is my only criticism and I would call this book “money well spent”.

Tags: , , ,

Sunday, April 5th, 2009 Books, Reviews, Self Improvement, Well-Being No Comments
avatar

A tip for preventing identity theft

by on Wednesday, April 1st, 2009, under Financial

File Sharing Identity TheftSo, I was watching the news on TV tonight and they did a special on preventing identity theft.  I found out that one of the easiest ways to get any random persons information is by finding tax return documents on popular file sharing networks.  I couldn’t believe my eyes when I loaded up a very common file sharing application and performed a search. The returns I found were all prepared by a particular, but VERY popular, tax application. I will not mention which tax application publicly, nor will I mention which file sharing network because I do not wish to bring ill repute to either.

I contacted a few of the people who’s tax returns were publicly available to let them know about the issue. They were all very grateful to hear from me and I advised them to uninstall the file sharing applications. Most of these people were elderly and had children who were using the computer to download music over the file sharing networks. Unfortunately, I cannot call everyone on an individual basis, and there are legal concerns involved in what I was doing, regardless of intent. So, I decided to do my part by sharing this knowledge with my readers here.

Make sure your file sharing applications are configured so that they do not share sensitive (or copyrighted) data. I would also recommend that you do NOT keep documents like this on your computer. Back them up to a CD or some other media and delete them from your PC. I don’t want to be calling you someday (well, at least not about this).

Good luck out there…

Tags: , , , ,

Wednesday, April 1st, 2009 Financial 1 Comment