Riepilogo del capitolo 27. Renderer personalizzati
Nota
Questo libro è stato pubblicato nella primavera del 2016, e non è stato aggiornato da allora. C'è molto nel libro che rimane prezioso, ma alcuni materiali sono obsoleti, e alcuni argomenti non sono più completamente corretti o completi.
Viene Xamarin.Forms eseguito il rendering di un elemento, Button ad esempio, con un pulsante specifico della piattaforma incapsulato in una classe denominata ButtonRenderer. Ecco la versione iOS di , la versione Android di ButtonRendererButtonRenderere la versione UWP di .ButtonRenderer
Questo capitolo illustra come scrivere renderer personalizzati per creare visualizzazioni personalizzate mappate a oggetti specifici della piattaforma.
Gerarchia completa della classe
Esistono quattro assembly che contengono il codice specifico della Xamarin.Forms piattaforma. È possibile visualizzare l'origine in GitHub usando questi collegamenti:
- Xamarin.Forms. Piattaforma (molto piccola)
- Xamarin.Forms. Platform.iOS
- Xamarin.Forms. Platform.Android
- Xamarin.Forms. Platform.UAP
Nota
Gli WinRT assembly menzionati nel libro non fanno più parte di questa soluzione.
Nell'esempio PlatformClassHierarchy viene visualizzata una gerarchia di classi per gli assembly validi per la piattaforma in esecuzione.
Si noterà una classe importante denominata ViewRenderer. Questa è la classe da cui derivare durante la creazione di un renderer specifico della piattaforma. Esiste in tre versioni diverse, perché è legata al sistema di visualizzazione della piattaforma di destinazione:
IOS ViewRenderer<TView, TNativeView> ha argomenti generici:
TViewvincolato aXamarin.Forms.ViewTNativeViewvincolato aUIKit.UIView
Android ViewRenderer<TView, TNativeView> ha argomenti generici:
TViewvincolato aXamarin.Forms.ViewTNativeViewvincolato aAndroid.Views.View
La piattaforma UWP ViewRenderer<TElement, TNativeElement> ha argomenti generici denominati in modo diverso:
TElementvincolato aXamarin.Forms.ViewTNativeElementvincolato aWindows.UI.Xaml.FrameworkElement
Quando si scrive un renderer, si deriva una classe da Viewe quindi si scrivono più ViewRenderer classi, una per ogni piattaforma supportata. Ogni implementazione specifica della piattaforma fa riferimento a una classe nativa che deriva dal tipo specificato come TNativeView parametro o TNativeElement .
Ciao, renderer personalizzati!
Il programma HelloRenderers fa riferimento a una visualizzazione personalizzata denominata HelloView nella relativa App classe.
La HelloView classe è inclusa nel progetto HelloRenderers e deriva semplicemente da View.
La HelloViewRenderer classe nel progetto HelloRenderers.iOS deriva da ViewRenderer<HelloView, UILabel>. Nell'override OnElementChanged crea un iOS UILabel nativo e chiama SetNativeControl.
La HelloViewRenderer classe nel progetto HelloRenderers.Droid deriva da ViewRenderer<HelloView, TextView>. Nell'override OnElementChanged crea un android TextView e chiama SetNativeControl.
La HelloViewRenderer classe in HelloRenderers.UWP e altri progetti Windows deriva da ViewRenderer<HelloView, TextBlock>. Nell'override OnElementChanged viene creato un oggetto Windows TextBlock e viene chiamato SetNativeControl.
Tutti i ViewRenderer derivati contengono un ExportRenderer attributo a livello di assembly che associa la HelloView classe alla classe specifica HelloViewRenderer . Questo è il modo in cui Xamarin.Forms individua i renderer nei singoli progetti di piattaforma:
Renderer e proprietà
Il set successivo di renderer implementa il disegno con puntini di sospensione e si trova nei vari progetti della Xamarin.Formssoluzione Book.Platform .
La EllipseView classe si trova nella Xamarin.Formspiattaforma Book.Platform . La classe è simile a BoxView e definisce solo una singola proprietà: Color di tipo Color.
I renderer possono trasferire i valori delle proprietà impostati su un View oggetto nativo eseguendo l'override del OnElementPropertyChanged metodo nel renderer. All'interno di questo metodo (e all'interno della maggior parte del renderer), sono disponibili due proprietà:
Element, l'elemento Xamarin.FormsControl, la visualizzazione nativa o l'oggetto widget o controllo
I tipi di queste proprietà sono determinati dai parametri generici in ViewRenderer. In questo esempio, Element è di tipo EllipseView.
L'override OnElementPropertyChanged può quindi trasferire il Color valore dell'oggetto Element all'oggetto nativo Control , probabilmente con un certo tipo di conversione. I tre renderer sono:
- iOS:
EllipseViewRenderer, che usa unaEllipseUIViewclasse per l'ellisse. - Android:
EllipseViewRenderer, che usa unaEllipseDrawableViewclasse per l'ellisse. - UWP:
EllipseViewRenderer, che può usare la classe nativa di WindowsEllipse.
La classe EllipseDemo visualizza diversi di questi EllipseView oggetti:
Il BouncingBall rimbalza sui EllipseView lati dello schermo.
Renderer ed eventi
È anche possibile che i renderer generino indirettamente eventi. La StepSlider classe è simile alla normale Xamarin.FormsSlider , ma consente di specificare una serie di passaggi discreti tra i Minimum valori e Maximum .
I tre renderer sono:
- iOS:
StepSliderRenderer - Android:
StepSliderRenderer - UWP:
StepSliderRenderer
I renderer rilevano le modifiche apportate al controllo nativo e quindi chiamano SetValueFromRenderer, che fa StepSlider riferimento a una proprietà associabile definita in StepSlider, una modifica a cui fa sì che venga generato un ValueChanged evento.
L'esempio StepSliderDemo illustra questo nuovo dispositivo di scorrimento.