Nothing but .net

Silverlight: How to do navigation easily

Here's a trick to a question I have heard a few times already: how to perform easy navigation in Silverlight 1.1?
This problem can be partially solved using hidden panels: you click on a button, Panel1 is hidden and Panel2 becomes visible. This is a trick that is often done in ASP.net too.
Well, this trick can also be done in Silverlight, using the Control class. This class makes it possible to have a piece of XAML that has been loaded dynamically, act as a Control, that can be shown or hidden to do navigation (or actually, fake navigation).
Consider the following code. I have a panel, Panel1, that inherits from Control. Inside the constructor, XAML is read from a resource (ie, a XAML file).

public class Panel1 : Control

    {

        FrameworkElement myPanel;

        Rectangle button;

        public Panel1()

        {

            System.IO.Stream s = this.GetType().Assembly.GetManifestResourceStream("App1.MyPanel.xaml");

            button = this.InitializeFromXaml(new System.IO.StreamReader(s).ReadToEnd());

            button = (Rectangle)myPanel.FindName("button");

        }

    }

 

Now, in the main code behind page, we'll instantiate the constructor of the Panel1 class, and we'll add the controls it generates dynamically (from the XAML that is) to the existing XAML.


Panel1 p = new Panel1();

this.Children.Add(p);


If we later want to remove the panel, the following line does the trick.

this.Children.Remove(p);


Posted on Sunday, 30 September 2007 07:49 by gill  |  Comments (9)
Filed under:   Tips and Tricks | Silverlight

Related posts

Comments

October 4. 2007 02:13

trackback

Trackback from WynApse

Silverlight Cream for October 3, 2007 -- # 99

WynApse

March 20. 2008 12:09

vamsi

Hi,

I am trying to implement navigation between two xaml files.

I need to traverse from one page to another after firing event from button.

How? any idea.

pls mail me..

vamsi

September 15. 2008 04:53

Trisha

Thanks for the example..

Trisha

November 30. 2008 22:45

mahesh a

hi vasmi,
you can use the RootVisual property, Please have look


private void Navigation_Click(object sender, RoutedEventArgs e) {
App.Current.RootVisual = new NewPage();
}

mahesh a

May 4. 2009 03:31

Programmable Thermostats

Thanks a lot for showing this example.I got the idea now

Programmable Thermostats

May 21. 2009 10:02

Lordsam

Hello,

Am a new guy concerning the development and specially with C#. Anyway, what should i write after i use the RootVisual property to make the navigation happen.

Lordsam

June 16. 2009 01:28

            <dds:DomainDataSource x:Name="dds"                        LoadMethodName="LoadSuperEmployees"                       AutoLoad="True"                       LoadSize="20">                 <dds:DomainDataSource.DomainContext>                     <App:LoginDomainContext></App:LoginDomainContext>                 </dds:DomainDataSource.DomainContext>                  <dds:DomainDataSource.GroupDescriptors>                     <data:GroupDescriptor PropertyPath="Publishers" />                     <data:GroupDescriptor PropertyPath="Origin" />                 </dds:DomainDataSource.GroupDescriptors>                  <dds:DomainDataSource.FilterDescriptors>                     <data:FilterDescriptorCollection>                         <data:FilterDescriptor PropertyPath="Origin"                                                    Operator="StartsWith">                             <data:ControlParameter PropertyName="Text"                                                     RefreshEventName="TextChanged"                                                    ControlName="originFilterBox">                             </data:ControlParameter>                         </data:FilterDescriptor>                     </data:FilterDescriptorCollection>                 </dds:DomainDataSource.FilterDescriptors>               </dds:DomainDataSource>

<ddsLaughingomainDataSource x:Name="dds"
LoadMethodName="LoadSuperEmployees"
AutoLoad="True"
LoadSize="20">
<ddsLaughingomainDataSource.DomainContext>
<App:LoginDomainContext></App:LoginDomainContext>
</ddsLaughingomainDataSource.DomainContext>

<ddsLaughingomainDataSource.GroupDescriptors>
<data:GroupDescriptor PropertyPath="Publishers" />
<data:GroupDescriptor PropertyPath="Origin" />
</ddsLaughingomainDataSource.GroupDescriptors>

<ddsLaughingomainDataSource.FilterDescriptors>
<data:FilterDescriptorCollection>
<data:FilterDescriptor PropertyPath="Origin"
Operator="StartsWith">
<data:ControlParameter PropertyName="Text"
RefreshEventName="TextChanged"
ControlName="originFilterBox">
</data:ControlParameter>
</data:FilterDescriptor>
</data:FilterDescriptorCollection>
</ddsLaughingomainDataSource.FilterDescriptors>


</ddsLaughingomainDataSource>

<dds:DomainDataSource x:Name="dds" LoadMethodName="LoadSuperEmployees" AutoLoad="True" LoadSize="20"> <dds:DomainDataSource.DomainContext> <App:LoginDomainContext></App:LoginDomainContext> </dds:DomainDataSource.DomainContext> <dds:DomainDataSource.GroupDescriptors> <data:GroupDescriptor PropertyPath="Publishers" /> <data:GroupDescriptor PropertyPath="Origin" /> </dds:DomainDataSource.GroupDescriptors> <dds:DomainDataSource.FilterDescriptors> <data:FilterDescriptorCollection> <data:FilterDescriptor PropertyPath="Origin" Operator="StartsWith"> <data:ControlParameter PropertyName="Text" RefreshEventName="TextChanged" ControlName="originFilterBox"> </data:ControlParameter> </data:FilterDescriptor> </data:FilterDescriptorCollection> </dds:DomainDataSource.FilterDescriptors> </dds:DomainDataSource>

July 3. 2009 01:50

SEO

Excellent post.I want to thank you for this informative read, I really appreciate sharing this great post. Keep up your work.

SEO

July 3. 2009 07:41

Income protection

Hi,

If you create a new Silverlight 2.0 project in Visual Studio, you’ll get a project that contains an Application class and a UserControl ‘page’ class. The Application class creates an instance of the page class and sets it as the root visual. Unless you’re building a really small app with a very simple UI, you’ll likely need to add other pages and user controls to your application and then implement navigation by manually hiding, showing or replacing bits of the UI within the root page. In other words, you’re pretty much on your own when it comes to navigation in Silverlight. This is a bit of a pain and means that you have to write code that’s closely tied to the UI and hard to test.

Income protection

Add comment


(Will show your Gravatar icon)  

  Country flag

[b][/b] - [i][/i] - [u][/u]- [quote][/quote]



Live preview

July 3. 2009 20:43