Home > Programming, Silverlight > Creating a Silverlight 4 FileMenu control from a ComboBox

Creating a Silverlight 4 FileMenu control from a ComboBox


Recently I had to create a simple FileMenu control. As you are all aware this is very similar to a ComboBox control.

The difference is that the ComboBox control cannot be used on the fly to contain a collection of MenuItems.

For this I had to create a custom ComboBox control which I called FileMenuItem. This control offers a Title dependency property to set the content for the Menu.

Edit: Renamed FileMenuItem to Menu because  it’s a more meaningful name and also added support for subitems using the previous post’s control SuperMenuItem . Also enhanced the SuperMenuItem by applying the latest hacks to make the IsEnabled property work all the time (EVEN in MVVM scenarios – not demoed here but works)  per David’s blog. Tks David, your posts are very meaningful 😉

New Source code: here

Old Source code: here

PS: See updated screens at the end of the page.

Also the Popup which the ComboBox originally had was replaced with the PART_Popup used in the MenuItem control template (as in the previous post).

The ItemContainerStyle (meaning the ComboBoxItem style) was replaced with a simpler style so it could accomodate the MenuItem (no mouse over effects no borders no nothing because the MenuItem already has that built-in).

Client xaml code looks like this:

<local:FileMenuItem HorizontalAlignment="Left" Margin="78,102,0,0" VerticalAlignment="Top" Width="60"
       ItemContainerStyle="{StaticResource ComboMenuItem}" Title="View">
   <local:FileMenuItem.Items>
      <toolkit:MenuItem Header="Test1"/>
      <toolkit:MenuItem Header="Test2"/>
      <toolkit:MenuItem Header="Test3"/>
      <toolkit:MenuItem Header="Test4"/>
   </local:FileMenuItem.Items>
</local:FileMenuItem>

So voila!

V1 screen:

V2 screen:

Advertisements
  1. No comments yet.
  1. 02/01/2011 at 2:12 pm

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: