How to Customize Visual Studio 2010 Start Page - Part 2 (Updated)

March 10, 2010 at 1:01 PM

On my previous post, I showed that you can actually customize your Visual Studio 2010 Start Page (StartPage.xaml).

For this post, I will show you how you can actually do the simple changes if you are not familiar with WPF-XAML Code.

To change the Visual Studio 2010 Start Page from default design,
Visual Studio 2010 Default Start Page 

to your own design,

My Customized Start Page

is very simple.

First of all, you need to locate the "StartPage.xaml" as mention in previous post.

Once you have it, you can open it with Micrsoft Expression Blend or Visual Studio 2010 to do the design.

What I did to my own simple version of Start Page is changing the default logo and add 2 more additional tabs.

My Customized Start Page

To change the default logo

You need to locate the following default code in your StartPage.xaml ,

   1:                <Image Grid.Column="0"
   2:                Grid.Row="0"
   3:                Grid.ColumnSpan="3"
   4:                Source="{Binding Background.Logo}"
   5:                HorizontalAlignment="Left"
   6:                VerticalAlignment="Top"
   7:                Width="1600" />

and change it to

   1:               <Image Source="{sp:StartPageRelative mvplogovert.jpg}"
   2:               Margin="0,0,0,24"
   3:               Grid.ColumnSpan="2" />

The StartPageRelative attribute will actually tell Visual Studio 2010 to locate the file in your My Document\Visual Studio 2010\StartPages\ folder.

So, you will need to place your neccessary images to the folder.

You should now have your Start Page with your own logo.

Customized Start Page Logo

To add new tab

Again, locate the following section of code at end of your StartPage.xaml,

   1:             </Tabcontrol> 
   2:        </Grid> 
   3:     </Grid> 
   4:</Grid> 

Before the </Tabcontrol> , add the following code to create new tab.

   1: <TabItem Header="Seok Chern's Blog"
   2:        Height="Auto" Style="{DynamicResource StartPage.TabItemStyle}
   3:         x:Uid="ALM_Tab"
   4:DataContext="{Binding Links.Content, Converter={StaticResource StringToXmlDataProviderConverter}}">
   5:                     <Grid>
   6:  
   7:                    <Grid.RowDefinitions>
   8:                     <RowDefinition Height="Auto"></RowDefinition>
   9:                    <RowDefinition Height="*"></RowDefinition>
  10:                    </Grid.RowDefinitions>
  11:                    <ScrollViewer Grid.Row="1"
  12:                Margin="12,6,0,0"
  13:                VerticalScrollBarVisibility="Auto"
  14:                HorizontalAlignment="Stretch"
  15:                VerticalAlignment="Stretch"
  16:                Style="{DynamicResource StartPage.ScrollViewerStyle}">
  17:             <WebBrowser Height="Auto"
  18:              Width="Auto" 
  19:              Source="http://blog.scnetstudio.com/" />
  20:             </ScrollViewer>
  21:                     </Grid>
  22:                 </TabItem>

You can modify Header="Seok Chern's Blog" to any name you want to be as your header.

And for the <WebBrowser Source="http://blog.scnetstudio.com/" /> you can change to any page that you wanna load.

Of course you will need to have internet connection to load your page if you are pointing an internet URL address. :P

Happy StartPage.xaml editing :D

Tested and work well with Visual Studio 2010 RC1

Updated on 12 April 2010 - Work fine with Visual Studio 2010 RTM :D

 

Posted in: MVP | Technical Stuff

Tags: , ,