locked
Silverlight tip – Afficher une page web dans une application Silverlight RRS feed

  • Discussion générale

  • Pour afficher une page web dans une application Silverlight, nous avons deux approches différentes : pour les applications qui ne sont pas hébergées dans une application ASP.NET, nous allons utiliser le contrôle WebBrowser ; pour les applications affichées dans une page ASP.NET, nous devons utiliser un contournement, car le contrôle WebBrowser n’est plus disponible.

     

    Dans ce tutoriel nous allons analyser les deux cas.

      

     

    Application non-hébergée

     

    Créez une application Silverlight et décochez l’option de début, qui vous demande si vous voulez l’héberger dans un site web. Cette application sera indépendante.

     

    Dans l’explorateur de solution de Visual Studio, sélectez « Properties » dans le menu contextuel de l’application.

     

    Dans la page de propriétés du projet, dans l’onglet « Silverlight », cochez l’option « Enable running application out of the browser ». Ensuite, cliquez sur le bouton « Out-of-Browser Settings… ».

     

    La fenêtre « Out-of-Browser Settings » vous donne la possibilité de choisir le nom de la fenêtre Silverlight, les dimensions et de configurer d’autres options.

     

    Dans cette fenêtre, c’est important de cocher l’option « Require elevated trust when running outside the browser ».

     

     

     

    Apres avoir défini les propriétés du projet, ajoutez un contrôle WebBrowser sur la page. Le dernier pas est de définir sa propriété « Source » avec une adresse web.

     

    Pour naviguer à des adresses différentes, on peut aussi utiliser la méthode Navigate, dans le code.

    private void button1_Click(object sender, RoutedEventArgs e)

            {

                this.webBrowser1.Navigate(new Uri("http://www.microsoft.com"));

            }

     

     

     

    Application hébergée

     

    Pour les applications hébergées, on ne peut pas utiliser le contrôle WebBrowser. Pour afficher des pages web dans ces applications, nous allons définir un composant « iframe » dans la page asp.net et nous allons l’utiliser dans l’application Silverlight.

     

    Créez une nouvelle application Silverlight, mais cette fois ne décochez pas l’option « Host the Silverlight application in a new website ». Une application web ASP.NET sera créée dans la même solution que votre projet Silverlight.

     

    Dans la page de test de l’application ASP.NET, nous allons ajouter un composant « iframe » :

     

    Modifiez la page principale de l’application Silverlight en ajoutant un nouveau Grid :

    <UserControl x:Class="SilverlightApplication48.MainPage"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

        mc:Ignorable="d"

        d:DesignHeight="300" d:DesignWidth="400">

     

        <Grid x:Name="LayoutRoot" Background="White">

     

            <Grid x:Name="FrameHost" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"

           Margin="10" Background="White" LayoutUpdated="Grid_LayoutUpdated">

            </Grid>

     

        </Grid>

    </UserControl>

     

     

    Dans la page de code (MainPage.xaml.cs), ajoutez une méthode pour définir la position de la page web :

     

    private void ShowPreview()

            {

                GeneralTransform gt = FrameHost.TransformToVisual(Application.Current.RootVisual as UIElement);

                Point offset = gt.Transform(new Point(0, 0));

                int controlLeft = (int)offset.X;

                int controlTop = (int)offset.Y;

                HtmlElement m = HtmlPage.Document.GetElementById("MyFrame");

                if (m != null)

                {

                    m.SetStyleAttribute("left", controlLeft.ToString() + "px");

                    m.SetStyleAttribute("top", controlTop.ToString() + "px");

                    m.SetStyleAttribute("visibility", "visible");

                    m.SetStyleAttribute("height", FrameHost.ActualHeight.ToString() + "px");

                    m.SetStyleAttribute("width", FrameHost.ActualWidth.ToString() + "px");

                    m.SetStyleAttribute("z-index", "1000");

                }

            }

     

     

    Pour définir l’adresse de la page à afficher, ajoutez la propriété « src » au composant « iframe » dans l’application ASP.NET :

    <iframe id="MyFrame" style="visibility:hidden; position:absolute"

                src="http://www.microsoft.com"><b>Frame... >:) </b></iframe>

     

     

    Maintenant, vous pouvez démarrer l’application et la page web sera visible.

     

    Si vous voulez modifier l’adresse de la page affichée, ajoutez un nouveau bouton Silverlight et écrivez ce code pour l’évènement click :

    private void button1_Click(object sender, RoutedEventArgs e)

            {

                HtmlElement m = HtmlPage.Document.GetElementById("MyFrame");

                m.SetProperty("src", @"http://msdn.microsoft.com/fr-fr/default.aspx");

            }

     

    Pour plusieurs tips&tricks sur Silverlight, consultez Silverlight tips - formation Silverlight, articles et didacticiels

    jeudi 30 septembre 2010 14:56