Le mode plein écran de Silverlight

Une application Web ressemblera plus à un logiciel de bureau si elle s'affiche en plein écran plutôt qu'à l'intérieur du navigateur.

Comment passer en plein écran

Le propriété FullScreen affiche un contrôle ActiveX en plein écran. Cette propriété s'applique à la balise <div> que nous avons définie comme conteneur dans nos exemples, et qui est suivie du constructeur agHost().
Lorsqu'une interface est présentée en plein écran, on revient au mode ordinaire en pressant la touche Echap.

Cliquer sur l'image suivante pour la voir en plein écran:

Le code XAML:

<Rectangle 
  Height="240" 
  Width="320" 
  Stroke="Black" 
  StrokeThickness="1"
  MouseLeftButtonDown = "javascript:enlarge"	
 >

Le code XAML complet.

On associe à l'évènement MouseLeftButtonDown, autrement dit, clic sur le bouton gauche de la souris, la fonction JavaScript "enlarge"...

Le code JavaScript:

Pour accéder au contrôle, il faut disposer d'une variable JavaScript qui le représente. On utilisera cette ligne qui suit l'appel du constructeur agHost(). On dénommera notre variable "application":

var application = document.getElementById("agControl1");

L'argument agControl1 est l'identifieur donné au contrôle ActiveX comme second paramètre de la fonction agHost().

Pour passer en plein écran, on attribue la valeur true (vrai) à la propriété FullScreen.

function enlarge(sender, args)
{
    application.fullScreen = true;
}

On peut aussi basculer entre les valeurs true et false (vrai et faux):

function enlarge(sender, args)
{
    application.fullScreen = ! application.fullScreen;
}

Le fait de passer en plein écran ou revenir en mode navigateur déclenche un évènement FullScreenChanged. On associe donc à cet évènement une fonction JavaScript pour faire quelque chose lorsque l'utilisateur change le mode écran:

FullScreenChanged = "javascript:faireQuelqueChose";

Cela suppose qu'une fonction JavaScript faireQuelqueChose() soit définie à cet effet.