Résumé du chapitre 27. Renderers personnalisés
Télécharger l’exempleNotes
Ce livre a été publié au printemps 2016 et n’a pas été mis à jour depuis. Il y a beaucoup dans le livre qui reste précieux, mais certains éléments sont obsolètes, et certains sujets ne sont plus entièrement corrects ou complets.
Un Xamarin.Forms élément tel qu’il Button est rendu avec un bouton spécifique à la plateforme encapsulé dans une classe nommée ButtonRenderer. Voici la version iOS de ButtonRenderer, la version Android de ButtonRenderer, et la version UWP de ButtonRenderer.
Ce chapitre explique comment écrire vos propres convertisseurs pour créer des vues personnalisées qui mappent à des objets spécifiques à la plateforme.
Hiérarchie de classes complète
Il existe quatre assemblys qui contiennent le code spécifique à la Xamarin.Forms plateforme. Vous pouvez afficher la source sur GitHub à l’aide de ces liens :
- Xamarin.Forms. Plateforme (très petite)
- Xamarin.Forms. Plate-forme. iOS
- Xamarin.Forms. Plate-forme. Android
- Xamarin.Forms. Platform.UAP
Notes
Les WinRT assemblys mentionnés dans le livre ne font plus partie de cette solution.
L’exemple PlatformClassHierarchy affiche une hiérarchie de classes pour les assemblys valides pour la plateforme en cours d’exécution.
Vous remarquerez une classe importante nommée ViewRenderer. Il s’agit de la classe à partir de laquelle vous dérivez lors de la création d’un renderer spécifique à la plateforme. Il existe dans trois versions différentes, car il est lié au système d’affichage de la plateforme cible :
Le iOS ViewRenderer<TView, TNativeView> a des arguments génériques :
TViewcontrainte àXamarin.Forms.ViewTNativeViewcontrainte àUIKit.UIView
Le Android ViewRenderer<TView, TNativeView> a des arguments génériques :
TViewcontrainte àXamarin.Forms.ViewTNativeViewcontrainte àAndroid.Views.View
L’UWP ViewRenderer<TElement, TNativeElement> a des arguments génériques nommés différemment :
TElementcontrainte àXamarin.Forms.ViewTNativeElementcontrainte àWindows.UI.Xaml.FrameworkElement
Lors de l’écriture d’un renderer, vous dérivez une classe à partir de View, puis écrivez plusieurs ViewRenderer classes, une pour chaque plateforme prise en charge. Chaque implémentation spécifique à la plateforme référence une classe native qui dérive du type que vous spécifiez en tant que paramètre ouTNativeElement.TNativeView
Bonjour, les convertisseurs personnalisés !
Le programme HelloRenderers référence une vue personnalisée nommée HelloView dans sa App classe.
La HelloView classe est incluse dans le projet HelloRenderers et dérive simplement de View.
La HelloViewRenderer classe du projet HelloRenderers.iOS dérive de ViewRenderer<HelloView, UILabel>. Dans le OnElementChanged remplacement, il crée une iOS UILabel native et appelle SetNativeControl.
La HelloViewRenderer classe du projet HelloRenderers.Droid dérive de ViewRenderer<HelloView, TextView>. Dans le OnElementChanged remplacement, il crée une Android TextView et appelle SetNativeControl.
La HelloViewRenderer classe dans helloRenderers.UWP et d’autres projets Windows dérivent de ViewRenderer<HelloView, TextBlock>. Dans le OnElementChanged remplacement, il crée une Windows TextBlock et appelle SetNativeControl.
Tous les ViewRenderer dérivés contiennent un ExportRenderer attribut au niveau de l’assembly qui associe la HelloView classe à la classe particulière HelloViewRenderer . Voici comment Xamarin.Forms localiser les renderers dans les projets de plateforme individuels :
Renderers et propriétés
L’ensemble suivant de renderers implémente le dessin ellipse et se trouve dans les différents projets de la Xamarin.Formssolution Book.Platform .
La EllipseView classe se trouve dans la Xamarin.Formsplateforme Book.Platform . La classe est similaire à BoxView et définit une seule propriété : Color de type Color.
Les convertisseurs peuvent transférer des valeurs de propriété définies sur un View objet natif en remplaçant la OnElementPropertyChanged méthode dans le renderer. Dans cette méthode (et dans la plupart des renderer), deux propriétés sont disponibles :
Element, l’élément Xamarin.FormsControl, l’affichage natif ou l’objet de contrôle ou de widget
Les types de ces propriétés sont déterminés par les paramètres génériques à ViewRenderer. Dans cet exemple, Element est de type EllipseView.
Le OnElementPropertyChanged remplacement peut donc transférer la Color valeur de l’objet Element natif Control , probablement avec un certain type de conversion. Les trois convertisseurs sont les suivants :
- iOS :
EllipseViewRenderer, qui utilise uneEllipseUIViewclasse pour l’ellipse. - Android :
EllipseViewRenderer, qui utilise uneEllipseDrawableViewclasse pour l’ellipse. - UWP :
EllipseViewRenderer, qui peut utiliser la classe WindowsEllipsenative.
La classe EllipseDemo affiche plusieurs de ces EllipseView objets :
Le BouncingBall rebondit sur EllipseView les côtés de l’écran.
Renderers et événements
Il est également possible pour les renderers de générer indirectement des événements. La StepSlider classe est similaire à la normaleXamarin.FormsSlider, mais permet de spécifier un certain nombre d’étapes discrètes entre les valeurs et Maximum les Minimum valeurs.
Les trois convertisseurs sont les suivants :
- iOS :
StepSliderRenderer - Android :
StepSliderRenderer - UWP:
StepSliderRenderer
Les convertisseurs détectent les modifications apportées au contrôle natif, puis appellent SetValueFromRenderer, qui référence une propriété pouvant être liée définie dans le StepSlider, une modification à laquelle l’événement StepSlider est déclenché ValueChanged .
L’exemple StepSliderDemo illustre ce nouveau curseur.