Fermer

février 8, 2022

Telerik Xamarin DataGrid prend désormais en charge la source DataTable


La première version de l'interface utilisateur Telerik pour Xamarin pour l'année est sortie, enrichissant notre suite Xamarin avec de nouvelles fonctionnalités et composants utiles. Parmi les nouveautés, citons la prise en charge tant attendue de DataTable pour notre contrôle DataGrid.

DataGrid est un contrôle complexe utilisé pour visualiser les données de manière pratique, tout en fournissant des moyens pour éditer, filtrer, regrouper et trier ces données. Jusqu'à présent, la seule façon d'alimenter le DataGrid avec certaines données consistait à créer une collection d'éléments IEnumerable. Cela a ses limites car vous devez connaître à l'avance le type d'élément de données utilisé pour cette collection. Instance System.DataTable, vous donnant ainsi plus de flexibilité pour remplir RadDataGrid avec des données dynamiques. De plus, toutes les fonctionnalités de DataGrid, telles que le filtrage, le tri, le regroupement, la sélection, etc. fonctionneront sans problème avec la source DataTable. L'ajout, la suppression et la mise à jour de lignes du DataTable sont également automatiquement reflétés dans l'interface utilisateur.

Passons en revue la nouvelle fonctionnalité en détail !

Configurer la source du DataTable

Commençons par créer un exemple de classe ViewModel avec un système. DataTable et remplissez ce DataTable avec des données. Dans notre échantillon, ce sera des pays:

Public Classe ViewModel: NotifyPropertyChangedBase { ]privé données DataTable ;

public données DataTable90[1904]

Obtenir {[19659018]retourner ce.données ; }

{

this.UpdateValue(ref this.data, value);.data, value);

} } [19659030] Public ViewModel ()

{

ceci.Données = ceci.GetData();

}

privé Table de données GetData()[4]

] {

Pays du tableau de données = nouveau Tableau des données();

[19][19]country.TableName = "Pays";

country.Columns.Add([1965] Identifiant"typeof(int));

[14.5]pays Colonnes.Ajouter("Pays"typeof(chaîne));

[13] country.Columns.Add("Continent"typeof(string));

pays. ]bool) );

country.Columns.Add("Visited On"[19659018]typeof(DateHeure));

country.Rows.Add(0, "Bulgarie","Europe"truenouveau DateHeure(2012, 10, 1) );

country.Rows.Add(1, [19659045]"États-Unis""Amérique du Nord"fauxnull );[15][15 country.Rows.Add(2, "Italie""Europe"true[196590] nouveau DateHeure(2019, 02, 11));

country.Rows.Add(3, "Cuba""Amérique du Nord"[206590] ]fauxnull);

pays. , "Hongrie""Europe"vrainouveau DateHeure(2013, 02, 1) );

country.Rows.Add(5, "Japon""Asie"[196590590][18 ]vrainouveau DateHeure(2015, 09, 12) );

pays.Rows .Add(6, "Egypte""Afrique"truenew DateTime(2016, 12, 5));

country.Rows.Add(7, "Argentine""Amérique du Sud"truenouveau DateHeure(2017, 10, 1) );

pays.Rows.Add(8, "France ""Europe"vrainouveau DateHeure(2018, 09, 15) );

country.Rows.Add(9, "Canada""Amérique du Nord"false , null);

country.Rows.Add(10, "Pérou90"[20 ]"Amérique du Sud"vrainouveau DateHeure(2021, 07, 15) );

cou ntry.Rows.Add(11, "Thaïlande""Asie"falsenull);

retour[pays ;InstanceDataGridavecItemsSourceappliqué :

<telerikDataGrid:RadDataGrid x:Name="dataGrid"

[39459016] [39459016] [39459016] [39459016] [39459016] ItemsSource="{Binding Data}" />

Il suffit de définir la classe ViewModel comme contexte de liaison pour la page et volia :

this. BindingContext = new ViewModel();

Nous avons un DataGrid rempli rapidement et facilement avec les données d'une source DataTable :

XamarinDataGrid_DataTable" title="XamarinDataGrid_DataTable"/></p data-recalc-dims=

Appliquer Opérations CRUD

Toutes les opérations Les opérations telles que l'ajout, la mise à jour et la suppression de données dans le DataGrid sont prises en charge avec la source DataTable. Toute modification des lignes DataTable avec code est immédiatement répercutée dans l'interface utilisateur.

Par exemple, pour ajouter une nouvelle ligne au DataTable, vous pouvez utiliser l'extrait suivant dans la classe ViewModel :

this.Data. Rows.Add(12, "Maroc""Afrique"false, null);

La mise à jour et la suppression sont exécutées de la même manière, vous pouvez vérifier l'approche exacte dans notre rubrique de documentation ici : DataGrid : opérations CRUD avec DataTable.

Vérifiez ci-dessous une capture d'écran rapide montrant comment vous pouvez autoriser les utilisateurs à ajouter de nouvelles lignes au DataGrid (la même approche comme ci-dessus, seules les nouvelles valeurs d'élément sont extraites d'un petit formulaire :

XamarinDataGrid_AddRow" title="XamarinDataGrid_AddRow" style="vertical-align : middle ;"/></p data-recalc-dims=

Appliquer le filtrage, le tri et le regroupement

Lorsque vous utilisez DataTable, vous pouvez filtrer, regrouper et trier les données à l'intérieur du DataGrid via l'interface utilisateur ou par programme.

Laissez essayez ceci : ajoutez un exemple de GroupDescriptor (pour regrouper les pays par continent) et un FilterDescriptor (pour afficher uniquement les pays visités) au DataGrid :

<telerikDataGrid:RadDataGrid x:Name ="dataGrid"

ItemsSource="{Données de liaison}"[1904][590][19045490] ]

UserEditMode="Cell" Grid.Row="1""1""1""1"

TelerikDataGrid: RadDataGrid.GroupDescriptor

>

< TelerikCommon: PropertyGroupDescriptor = "Continent" />

</telerikDataGrid : RadDataGrid.GroupDescriptors>

telerikDataGrid: RadDataGrid.FilterDescriptors >

< telerikCommon: BooleanFilterDescriptor PropertyName ="Est visité" Valeur="vrai"/>

[1941940] [1941940] </telerikDataGrid:RadDataGrid.FilterDescriptors>

</telerikDataGrid:RadDataGrid>[19659] voir que le filtrage et le regroupement par programmation sont appliqués. Vous pouvez également les supprimer/mettre à jour via la fonctionnalité d'interface utilisateur de filtrage du DataGrid :

XamarinDataGrid_GroupingFiltering" title="XamarinDataGrid_GroupingFiltering" style="vertical-align: middle;"/></p data-recalc-dims=

Essayez-le et partagez vos commentaires

J'espère que vous avez apprécié la nouvelle fonctionnalité de notre composant DataGrid.

La version R1 2022 est disponible en téléchargement dans les comptes clients. Si vous êtes nouveau sur l'interface utilisateur Telerik pour Xamarin, vous pouvez en savoir plus via la page produit. Il est livré avec un essai gratuit de 30 joursvous donnant le temps d'explorer le boîte à outils et envisagez de l'utiliser pour votre développement Xamarin actuel ou à venir. .




Source link