Traduction▲
Ce tutoriel est la traduction la plus fidèle possible du tutoriel original de Peter Bull, Microsoft Silverlight 4 - RSS Reader with Out-of-Browser Mode and Elevated Trust.
Introduction▲
RSS Reader vous permet d'accéder au contenu des flux RSS en utilisant la prise en charge du Service Model Syndication dans Silverlight. Par ailleurs, ce lecteur possède un mode hors navigateur optionnel pour la navigation dans tout flux de syndication compatible.
Lecteur de flux RSS avec le mode hors navigateur et les privilèges élevés▲
Étape 1▲
Démarrez Microsoft Visual Web Developer 2010 Express, ensuite sélectionnez Fichier puis Nouveau Projet… Sélectionnez Visual Basic ensuite Application Silverlight dans les modèles installés, sélectionnez un emplacement si vous le souhaitez, puis entrez un nom pour le projet et appuyez sur OK :
Étape 2▲
Une nouvelle fenêtre Nouvelle application Silverlight devrait apparaître, décochez la case Héberger l'application Silverlight sur un nouveau site Web, puis sélectionnez la Version de Silverlight ciblée :
Étape 3▲
Une page vierge nommée MainPage.xaml devrait alors apparaître :
![Image non disponible](./images/image4.png)
Étape 4▲
Sélectionnez Projet ensuite Ajouter une référence… La fenêtre Ajouter une référence devrait apparaître, sélectionnez System.ServiceModel.Syndication dans la liste .NET :
Étape 5▲
Ajouter la référence à System.ServiceModel.Syndication en cliquant sur OK.
Faites un clic droit sur la page ou sur l'entrée pour MainPage.xaml dans l'Explorateur de solutions et choisissez l'option Afficher le code. Dans la vue de code au-dessus de la ligne Partial Public Class MainPage tapez le code suivant :
Imports
System.ServiceModel.Syndication
Imports
System.Windows.Data
Imports
System.Text.RegularExpressions
Imports
System.Windows.Browser
![Image non disponible](./images/image6.png)
Étape 6▲
Puisque nous en sommes à la vue de code, en dessous du End Class pour la classe Partial Public Class MainPage tapez les classes suivantes :
Public
Class
LinkFormatter
Implements
IValueConverter
Public
Function
Convert
(
ByVal
value As
Object
, ByVal
targetType As
Type
, _
ByVal
parameter As
Object
, _
ByVal
culture As
System.Globalization.CultureInfo
) As
Object
_
Implements
IValueConverter.Convert
Return
DirectCast
(
value, System.Collections.ObjectModel.Collection
(
Of
SyndicationLink)).FirstOrDefault.Uri
End
Function
Public
Function
ConvertBack
(
ByVal
value As
Object
, ByVal
targetType As
Type
, _
ByVal
parameter As
Object
, _
ByVal
culture As
System.Globalization.CultureInfo
) As
Object
_
Implements
IValueConverter.ConvertBack
Throw
New
NotImplementedException
(
)
End
Function
End
Class
Public
Class
HtmlSanitiser
Implements
IValueConverter
Implements
IValueConverter
Public
Function
Convert
(
ByVal
value As
Object
, ByVal
targetType As
Type
, _
ByVal
parameter As
Object
, _
ByVal
culture As
System.Globalization.CultureInfo
) As
Object
_
Implements
IValueConverter.Convert
Dim
_convert As
String
_convert =
Regex.Replace
(
TryCast
(
value, String
), "<.*?>"
, ""
) ' Remove HTML Tags
_convert =
Regex.Replace
(
_convert, "\n+\s+"
, vbLf
&
vbLf
) ' Remove Spaces
_convert =
HttpUtility.HtmlDecode
(
_convert) ' Decode HTML Entities
Return
_convert
End
Function
Public
Function
ConvertBack
(
ByVal
value As
Object
, ByVal
targetType As
Type
, _
ByVal
parameter As
Object
, _
ByVal
culture As
System.Globalization.CultureInfo
) As
Object
_
Implements
IValueConverter.ConvertBack
Throw
New
NotImplementedException
(
)
End
Function
End
Class
Étape 7▲
Retournez au concepteur de vues pour MainPage en sélectionnant l'onglet MainPage.xaml.
Puis dans la section Tous les contrôles Silverlight de la Boîte à outils, sélectionnez le contrôle Canvas :
Étape 8▲
Dessinez un Canvas sur la page, ensuite dans le volet XAML au-dessus de </Grid> modifiez la ligne Canvas1 comme ceci :
<Canvas
Height
=
"65"
Width
=
"400"
VerticalAlignment
=
"Top"
HorizontalAlignment
=
"Left"
Name
=
"Toolbar"
></Canvas>
Voir ci-dessous :
![Image non disponible](./images/image9.png)
Étape 9▲
Puis dans la section Contrôles Silverlight communs de la Boîte à outils, sélectionnez le contrôle TextBox :
Étape 10▲
Dessinez un TextBox sur le Canvas et dans le volet XAML, en dessous de la balise <Canvas> et au-dessus de </Canvas>, modifiez TextBox1 comme ceci :
<TextBox Canvas.
Left
=
"6"
Canvas.
Top
=
"6"
Height
=
"23"
Width
=
"237"
Name
=
"Location"
/>
Voir ci-dessous :
![Image non disponible](./images/image11.png)
Étape 11▲
Puis dans la section Contrôles Silverlight communs de la Boîte à outils, sélectionnez le contrôle Button :
Étape 12▲
Dessinez un bouton sur la barre d'outils du Canvas à côté du TextBox, en glissant le bouton de la Boîte à outils sur le Canvas, ensuite dans le volet XAML entre les balises <TextBox> et </Canvas> modifiez la ligne <Button> comme ceci :
<Button Canvas.
Left
=
"249"
Canvas.
Top
=
"6"
Height
=
"23"
Width
=
"75"
Name
=
"Go"
Content
=
"Go"
/>
Voir ci-dessous :
![Image non disponible](./images/image13.png)
Étape 13▲
Sélectionnez Debug ensuite l'option Build RSSReader du menu :
![Image non disponible](./images/image14.png)
Étape 14▲
Puis dans le volet XAML pour MainPage.xaml, en dessous de la section
x:Class="RSSReader.MainPage"
tapez le code XAML suivant :
xmlns:app="clr-namespace:RSSReader"
![Image non disponible](./images/image15.png)
Étape 15▲
Puisque nous en sommes au volet XAML pour MainPage.xaml, au-dessus de la balise <Grid> et en dessous de la balise <UserControl>, tapez le code XAML suivant :
<UserControl.Resources>
<
app
:
HtmlSanitiser
x
:
Key
=
"HtmlSanitiser"
/>
<
app
:
LinkFormatter
x
:
Key
=
"LinkFormatter"
/>
</UserControl.Resources>
Encore une fois, toujours dans le volet XAML pour MainPage.xaml, en dessous de la balise <Button> et au-dessus de la balise </Canvas>, tapez le code ComboBox XAML suivant :
<ComboBox Canvas.
Left
=
"6"
Canvas.
Top
=
"36"
Height
=
"23"
Width
=
"318"
ItemsSource
=
"{Binding}"
Name
=
"Title"
>
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock
Text
=
"{Binding Title.Text,Converter={StaticResource HtmlSanitiser}}"
/>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
Voir ci-dessous :
![Image non disponible](./images/image16.png)
Étape 16▲
Toujours dans le volet XAML, en dessous de </Canvas> et au-dessus de la balise </Grid>, tapez le code XAML suivant :
<ScrollViewer
Height
=
"235"
Width
=
"400"
Margin
=
"0,65,0,0"
VerticalAlignment
=
"Top"
HorizontalAlignment
=
"Left"
>
<StackPanel
Orientation
=
"Vertical"
x
:
Name
=
"Content"
>
<HyperlinkButton
FontSize
=
"16"
TargetName
=
"_blank"
Content
=
"{Binding Title.Text,Converter={StaticResource HtmlSanitiser}}"
NavigateUri
=
"{Binding Links,Converter={StaticResource LinkFormatter}}"
/>
<TextBlock
FontSize
=
"14"
TextWrapping
=
"Wrap"
Text
=
"{Binding PublishDate}"
/>
<TextBlock
TextWrapping
=
"Wrap"
FontSize
=
"14"
Text
=
"{Binding Summary.Text,Converter={StaticResource HtmlSanitiser}}"
/>
</StackPanel>
</ScrollViewer>
Voir ci-dessous :
![Image non disponible](./images/image17.png)
Étape 17▲
Faites un clic droit sur la page ou sur l'entrée pour MainPage.xaml dans l'Explorateur de solutions et choisissez l'option Afficher le code. Dans la vue de code du constructeur Public Sub New(), en dessous de la ligne InitializeComponent(), tapez le code suivant :
Location.Text
=
"http://feeds.feedburner.com/cespageblog"
![Image non disponible](./images/image18.png)
Étape 18▲
Retournez au concepteur de vues en sélectionnant l'onglet MainPage.xaml, ou faites un clic droit sur la page ou sur l'entrée pour MainPage.xaml dans l'Explorateur de solutions et choisissez l'option Concepteur de vues.
Double-cliquez sur le bouton Go et tapez ceci dans le Sub Go_Click :
Dim
_client As
New
WebClient
AddHandler
_client.OpenReadCompleted
, Sub
(
s As
Object
, args As
OpenReadCompletedEventArgs)
If
Not
args.Cancelled
Then
Try
Dim
_reader As
XmlReader =
XmlReader.Create
(
args.Result
)
Dim
_feed As
SyndicationFeed =
SyndicationFeed.Load
(
_reader)
Title.DataContext
=
_feed.Items
Title.SelectedIndex
=
0
Catch
ex As
Exception
MessageBox.Show
(
ex.ToString
, "RSS Reader"
, MessageBoxButton.OK
)
End
Try
End
If
End
Sub
_client.OpenReadAsync
(
New
Uri
(
Location.Text
))
Étape 19▲
Retournez au concepteur de vues en sélectionnant l'onglet MainPage.xaml, ou faites un clic droit sur la page ou sur l'entrée pour MainPage.xaml dans l'Explorateur de solutions et choisissez l'option Concepteur de vues.
Double-cliquez sur le ComboBox « Title » et tapez ceci dans le Sub Title_SelectionChanged :
Content.DataContext
=
CType
(
CType
(
sender, ComboBox).SelectedItem
, SyndicationItem)
Étape 20▲
Enregistrez le projet maintenant que vous avez terminé l'application Silverlight. Sélectionnez Debug ensuite Démarrer le débogage ou cliquez sur Démarrer le débogage :
![Image non disponible](./images/image21.png)
Une fois que vous l'aurez fait, ce qui suit apparaîtra dans une nouvelle fenêtre du navigateur :
![Image non disponible](./images/image22.png)
Étape 21▲
Si vous cliquez sur Go, qu'ensuite vous sélectionnez un titre pour un élément de flux RSS, le contenu de cet élément de flux RSS apparaîtra :
![Image non disponible](./images/image23.png)
Étape 22▲
Fermez l'application et la fenêtre du navigateur en cliquant sur le bouton Fermer en haut à droite du navigateur Web pour Arrêter l'application.
Étape 23▲
Il y a un problème avec ce lecteur de flux RSS, car il ne fonctionne uniquement que s'il y a un fichier spécial appelé la politique d'accès client, situé sur le serveur où le flux RSS se trouve. Toutefois, il est possible d'accéder à n'importe quel flux RSS, en suivant les étapes optionnelles suivantes. Sélectionnez Projet ensuite Propriétés… La fenêtre Propriétés devrait apparaître, cochez la case Permettre l'exécution de l'application hors navigateur, et assurez-vous également que la version de Silverlight ciblée soit Silverlight 4 :
Étape 24▲
Toujours au niveau de la fenêtre Propriétés, cliquez sur le bouton Paramètres hors navigateur…, définissez Largeur à 400 et Hauteur à 300, ensuite cochez la case Privilèges élevés requis lors d'une exécution hors du navigateur :
Étape 25▲
Confirmez les paramètres en cliquant sur OK.
Enregistrer le Projet une nouvelle fois, car vous avez terminé la mise à jour de l'application Silverlight. Sélectionnez Debug ensuite Démarrer le débogage ou cliquez sur Démarrer le débogage :
![Image non disponible](./images/image27.png)
Une fois que vous l'aurez fait, ce qui suit apparaîtra dans une nouvelle fenêtre du navigateur :
![Image non disponible](./images/image28.png)
Étape 26▲
Pour accéder à n'importe quel flux RSS cela fonctionne uniquement en mode hors navigateur avec les privilèges élevés pour accéder à un flux sans politique d'accès client ou d'accès interdomaines. Faites un clic droit sur l'application dans le navigateur et choisissez l'option Installer l'application RSS Reader sur cet ordinateur… pour afficher l'écran d'installation :
![Image non disponible](./images/image29.png)
Étape 27▲
Cochez les cases Start menu et/ou Desktop pour ajouter un raccourci à l'application dans l'un ou les deux emplacements, et ensuite cliquez sur le bouton Installer, ce qui suit apparaîtra alors dans une nouvelle fenêtre :
![Image non disponible](./images/image30.png)
Étape 28▲
Il sera possible de saisir dans la zone d'emplacement n'importe quelle URL de flux RSS ou l'adresse RSS, et le lecteur de flux RSS pourra y accéder.
Fermez l'application et la fenêtre du navigateur en cliquant sur le bouton Fermer en haut à droite de la fenêtre de l'application et du navigateur Web pour Arrêter l'application.
Conclusion▲
Ceci est une application de lecture de flux RSS simple, vous pouvez essayer de personnaliser l'application pour la rendre plus utile. Vous pouvez aussi y ajouter plusieurs éléments de syndication afin d'afficher plus d'informations. De plus avec la prise en charge hors navigateur, vous n'êtes pas limité aux flux RSS qui ont une politique d'accès client. Utilisez l'application comme base pour votre propre lecteur flux RSS, c'est à vous de voir !
Liens▲
Remerciements▲
Je tiens ici à remercier Peter Bull de m'avoir autorisé à traduire son tutoriel.
Je remercie tomlev pour sa relecture technique et ses propositions.
Je remercie également FirePrawn pour sa relecture orthographique et ses propositions.