Un sprint dans la bonne direction avec le TaskBoard pour WPF

Développeurs WPF, réjouissons-nous ensemble! Quelle meilleure façon de commencer la nouvelle décennie que la toute nouvelle R1 2020 Release ? Plus besoin de flâner dans le labyrinthe des outils organisationnels. Obtenez la nouvelle interface Telerik UI pour WPF TaskBoard et profitez-en. Laissez-moi vous guider.

• Colonne – l'un des blocs de construction les plus essentiels du contrôle, qui contient toutes les cartes d'un groupe logique. Peut être réduit, renommé ou généré automatiquement en fonction de la source de données sous-jacente.
• En-tête de colonne – représente le membre du groupe logique d'une source de données en tant qu'en-tête de la colonne à l'intérieur du contrôle.
• Développer / Réduire Bouton – un bouton, situé tout à droite de l'en-tête de colonne, utilisé pour basculer entre l'état normal (étendu) et replié de la colonne.
• Carte – élément central du contrôle, utilisé pour la visualisation de la tâche au tableau. Peut être glissé dans une autre colonne ou réorganisé dans sa colonne parent.
• Titre de la carte – l'élément tout en haut de la carte, qui représente le titre d'une tâche donnée.
• Icône de la carte – l'élément à l'extrême droite de la carte, à côté de son titre. Représente le conteneur de l'image d'icône d'une tâche donnée.
• Description de la carte – l'élément sous le titre de la carte, qui affiche la description d'une tâche donnée.
• Balises de carte – une collection de surlignages objets appliqués à un élément donné, situé tout en bas d'une carte.
• Indicateur de catégorie – un minuscule visuel à l'extrême gauche d'une carte, conçu pour servir d'indicateur de catégorie logique.

Maintenant que vous savez ce qu'il y a à l'intérieur, j'espère que vous commanderez certainement le plat. 1965

Démarrage en quelques minutes

Vous ne savez pas par où commencer? Il est temps de vous guider dans la création d'un exemple d'application simple avec le tout nouveau tableau des tâches. Je promets que cela ne prendra que quelques minutes.

«Matériaux» nécessaires – une application WPF en référence à l'assemblage Telerik.Windows.Controls plus une collection des commandes intégrées du contrôle TaskBoardCardModel .

 classe publique ViewModel: ViewModelBase 
 {
 ... 
 
 public ViewModel () {Data = GetTasks (); } 
 ... 
 
 public ObservableCollection  GetTasks () 
 {
 ObservableCollection  tasks = new ObservableCollection  (); 
 
 tasks.Add (new TaskBoardCardModel () {
 Assigné = "Vicky", 
 IconPath = @ "/ TaskBoardBlogApp; component / vickygr30x30.png", 
 Title = "NumericUpDown: la zone de texte a des problèmes de focus après chaque chiffre entré dans WPF", 
 Description = "Quand entrez la valeur au clavier, après chaque chiffre, nous perdons le focus sur la zone de texte, ce qui donne 100 et vous entrez 001. Si vous avez un symbole $, 100 donne 00 $ 1. ", 
 State =" Not Started " , 
 CategoryName = Categories [1] .CategoryName, 
}); 
 
 tâches.Add (new TaskBoardCardModel () {
 Assigné = "Vicky", 
 IconPath = @ "/ TaskBoardBlogApp; component / vickygr30x30.png", 
 Title = "RadNumericUpDown: Partie de zone de texte sans chiffres inactifs dans WPF", 
 Description = "Si vous cliquez sur la zone de texte où il n'y a pas de chiffres, vous ne vous concentrez pas sur le contrôle. ", 
 State =" In Progress ", 
 CategoryName = Categories [0] .CategoryName, 
}); 
 
 tâches.Add (nouveau TaskBoardCardModel () {
 Assignee = "Vicky", 
 IconPath = @ "/ TaskBoardBlogApp; component / vickygr30x30.png", 
 Title = "MaskedTextBox: valeur incomplète affichée avec un symbole spécial comme" - "et" _ '", 
 Description = @" La valeur ne doit pas contenir de symboles comme' - 'ou' _ '. ", 
 State =" Ready For Test ", 
 CategoryName = Categories [2] .CategoryName, 
}); 
 
 ... 
 } 
} 

La partie XAML est sur moi, c'est parti:

 < telerik: RadTaskBoard   ItemsSource  =  "{Binding Data}"   GroupMemberPath  =  "État"   /> 

Vous ne vous attendiez pas à une seule ligne de code, n'est-ce pas? Frapper F5 et les résultats sont là!

Vous pouvez retourner dans les coulisses de l'émission "Mise en route avec RadTaskBoard" pour révéler toutes ses merveilles sur la documentation Telerik UI for WPF TaskBoard . Un conseil de ma part – assurez-vous de vérifier toutes les sections de la documentation pour explorer l'ensemble complet des opportunités offertes par le contrôle.

Glisser-déplacer

Si, à une occasion (inimaginable), vous devez empêcher l'utilisateur de déplacer des objets avec la souris ou avec leur doigts, vous pouvez le faire en définissant la propriété IsDragDropEnabled sur false. Oh, et cette bordure bleue autour de la carte montre la carte actuellement sélectionnée. Vous pouvez le désactiver en définissant la propriété CanUserSelect sur false.

Personnalisation flexible et création de thèmes

Je me demande maintenant par où commencer.

Personnalisation des colonnes

Les collections TaskBoardCardModel sont ajouté à la colonne respective en fonction de la propriété GroupMemberPath du contrôle RadTaskBoard. Le mécanisme de définition de ces colonnes est votre choix. Vous pouvez opter pour une définition automatique des colonnes ou une définition manuelle. Si vous optez pour la génération automatique, vous pouvez toujours annuler la même chose pour une colonne spécifique.

Les propriétés des colonnes du TaskBoard incluent GroupName, IsExpanded, ColumnWidth, CollapsedColumnWidth, ColumnHeader, ColumnHeaderTemplate ColumnHeaderHeight, Items, etc. -explicatif, n'est-ce pas?

L'un des éléments visuels les plus importants de la colonne est son en-tête. Créons un en-tête de colonne personnalisé avec du texte en majuscules et des informations sur le nombre d'éléments pour une colonne.

Et peut-être vérifier à quoi cela ressemble? [19659060] TaskBoard Custom ColumnHeaderTemplate  » title= »CustomColumnHeaderTemplate »/>

Vous voyez cet espace entre les colonnes? Vous pouvez également contrôler celui-ci avec la propriété ColumnOffset (oui, c'est un double).

Jouer avec un jeu de cartes

Je sais que choisir notre modèle de carte prédéfini est vraiment bel endroit pour commencer, mais selon les besoins de vos utilisateurs, vous devrez peut-être concevoir vos propres cartes. C'est vous qui décidez comment jouer correctement vos cartes. Pourtant, je ferai de mon mieux pour vous donner un as dans votre manche. Allons-nous commencer?

  
 
 
 <telerik: RadTaskBoardCard 
 Assignee = "{Binding Assignee}" 
 CategoryName = "{Binding CategoryName}" 
 ShowCategoryIndicator = "True" 
 Content = "{Binding Description}" 
 Header = "{Binding Title}" 
 Icon = "{Binding IconPath}" 
 Tags = "{Binding Tags}"> 
 
 
 
 
 
 
 
 
 
 
 
 
  
  

L'extrait ci-dessus utilise la RadTaskBoardCard comme un ItemTemplate de la RadTaskBoard. Il est si sophistiqué et a tout ce dont vous avez besoin, plus un bonus de ma part – un modèle personnalisé pour les balises. Oh, il a aussi des catégories. Et des infobulles pour les balises et mon avatar.

Theming

Comme tous les autres membres de l'interface utilisateur de Telerik pour la grande famille de WPF, cela vient aussi avec la variété complète de thèmes. Si c'est la première fois que vous en entendez parler, consultez la liste complète ici .

Oh, et si vous souhaitez personnaliser les couleurs du thème, rendez-vous au Générateur de thème de couleur Trésorerie tout de suite, elle comprend déjà ce nouveau joyau.

Essayez-le et partagez vos commentaires

Soyez le premier à obtenir la dernière version de Telerik UI pour WPF et explorez toutes les «merveilles du R1 2020». Et n'oubliez pas d'essayer le nouveau contrôle RadTaskBoard. Pour les utilisateurs existants, vous pouvez obtenir les derniers bits de votre compte. Si vous débutez avec Telerik UI pour WPF, vous pouvez obtenir un essai gratuit de 30 jours:

Essayez UI pour WPF

P.S. L'une des clés d'une gestion de projet réussie est sans aucun doute l'outil utilisé pour cela. Vous savez tous très bien que cet outil nécessite une amélioration constante. Ainsi, vos commentaires sont plus que bienvenus et très appréciés – n'hésitez pas à les partager!

N'hésitez pas à nous envoyer vos commentaires et vos commentaires en utilisant la section des commentaires ci-dessous ou le Portail de commentaires .