Comment créer un téléchargeur de fichiers par glisser-déposer dans une application Winforms

De nombreuses applications modernes fonctionnent sur des fichiers qu'un utilisateur peut télécharger sur son système. Les éditeurs d'images, les IDE de code et les traitements de texte en sont tous des exemples. Si vous créez une application Windows Form, vous pouvez facilement ajouter cette fonctionnalité dans le cadre de votre interface utilisateur.

Les applications Windows Form vous permettent de faire glisser et de déposer des éléments d'interface utilisateur tels que des panneaux ou des zones de liste. Vous pouvez utiliser ces éléments d'interface utilisateur pour créer votre fonctionnalité de glisser-déposer. Lorsque l'utilisateur fait glisser un fichier sur un panneau, vous pouvez afficher des commentaires basés sur ce fichier.

Comment créer l'interface utilisateur pour le conteneur glisser-déposer

Vous pouvez utiliser un élément de panneau pour créer l'interface utilisateur pour la fonctionnalité de glisser-déposer. Vous pouvez ensuite utiliser un élément d'interface utilisateur ListBox pour afficher les noms de tous les fichiers qu'un utilisateur fait glisser sur le panneau.

1. Créer une nouvelle application Windows Forms.
2. Dans la boîte à outils, recherchez un élément d'interface utilisateur de panneau et faites-le glisser sur le canevas.
3. Mettez en surbrillance le nouveau panneau. Dans la fenêtre des propriétés, modifiez les valeurs des propriétés suivantes :

   Propriété	Nouvelle valeur
   Nom	glisserDéposerPanel
   Couleur de fond	Fumée blanche
   Style de bordure	FixeSimple
   Taille	600, 400
   Visible	Vrai

4. Dans la boîte à outils, recherchez un élément d'interface utilisateur ListBox et faites-le glisser sur le canevas. Positionnez-le de manière à ce qu'il soit à l'intérieur du panneau et assurez-vous qu'il y a un certain espace entre le ListBox et le panneau.
5. Mettez en surbrillance le nouveau ListBox et modifiez les valeurs des propriétés suivantes :

   Propriété	Nouvelle valeur
   Nom	uploadedFilesList
   Couleur de fond	Fumée blanche
   Style de bordure	Aucun
   Taille	500, 300
   Visible	FAUX

Comment ajouter l'événement glisser-déposer

Vous pouvez utiliser événements dans une application Windows Form pour exécuter certaines fonctions uniquement lorsque certains événements se produisent.

Pour ajouter des fonctionnalités au panneau glisser-déposer, vous devrez ajouter deux événements. L'événement "DragEnter" se produit lorsque vous faites glisser des fichiers sur le panneau. L'événement "DragDrop" se produit lorsque vous relâchez la souris pour déposer les fichiers dans le panneau.

1. Mettez en surbrillance l'élément d'interface utilisateur du panneau externe.
2. Dans la fenêtre des propriétés, cliquez sur le Éclairage icône pour ouvrir la liste des événements.
3. Double-cliquez sur le Faites glisserEntrée événement pour générer une nouvelle fonction. Cette fonction s'exécute lorsque vous faites glisser des fichiers sur le panneau.
4. A l'intérieur de la nouvelle fonction, changez l'icône de la souris pour indiquer l'action glisser/déposer:

   privéannulerdragDropPanel_DragEnter(expéditeur d'objet, DragEventArgs e)
   {
   // Change l'icone de la souris
    e. Effet = DragDropEffects. Tous;
   }

5. Clique sur le Formulaire 1.cs [Conception] en haut de la fenêtre de Visual Studio, pour revenir à la vue canevas. Mettez en surbrillance l'élément de l'interface utilisateur du panneau.
6. Dans la fenêtre des propriétés, cliquez sur le Éclairage icône pour revenir à la liste des événements. Cette fois, double-cliquez sur le Glisser Déposer événement. Cela générera une autre fonction qui s'exécutera lorsque vous relâcherez la souris pour déposer les fichiers dans le panneau.
7. Dans la nouvelle fonction DragDrop, obtenez la liste des fichiers que l'utilisateur fait glisser dans le panneau. Vous pouvez le trouver dans les détails de l'événement qui sont automatiquement transmis à la fonction.

   privéannulerdragDropPanel_DragDrop(expéditeur d'objet, DragEventArgs e)
   {
    string[] files = (string[])e. Données. GetData (FormatsDonnées. FileDrop, FAUX);
   }

Comment afficher la liste des fichiers déplacés

Maintenant que vous avez ajouté la fonctionnalité permettant à l'utilisateur de glisser-déposer des fichiers, vous pouvez afficher les noms des fichiers à l'aide de l'élément d'interface utilisateur ListBox.

1. Dans la fonction dragDropPanel_DragDrop(), après avoir obtenu la liste des fichiers, utilisez une boucle for pour parcourir chaque fichier.

   pour chaque (var fichier dans fichiers)
   {
   
   }

2. À l'intérieur de la boucle for, n'obtenez que le nom du fichier. Séparez le nom du fichier du chemin d'accès au fichier et stockez-le dans une variable distincte. Si vous utilisez un Mac, vous devrez peut-être modifier le code pour prendre en compte les barres obliques plutôt que les barres obliques inverses.

   chaîne fileName = fichier. Sous-chaîne (fichier. DernierIndexDe("\\") + 1, déposer. Longueur - (fichier. DernierIndexDe("\\") + 1));

3. Ajoutez le nom du fichier à l'élément d'interface utilisateur ListBox.

   essayer
   {
   uploadedFilesList.Articles.Ajouter(nom de fichier);
   }
   attraper (Exceptionexception)
   {
    Console. EcrireLigne(exception);
   }

4. La ListBox n'est pas visible par défaut. Après la boucle for, changez la visibilité de ListBox en true:

   uploadedFilesList. Visible = vrai;

5. Modifiez le constructeur en haut du fichier. Met le AutoriserDrop et Défilement automatique propriétés du panneau de glisser-déposer sur true.

   public Formulaire 1()
   {
    InitializeComponent();
    dragDropPanel. AllowDrop = vrai;
    dragDropPanel. Défilement automatique = vrai;
   }

Comment effacer la liste

Une fois que l'utilisateur a fait glisser des éléments dans le panneau, il peut vouloir effacer la liste et recommencer. Vous pouvez ajouter un bouton pour effacer la liste lorsque l'utilisateur clique dessus.

1. À l'aide de la boîte à outils, faites glisser un bouton sur le canevas.
2. Mettez le bouton en surbrillance. Utilisez la fenêtre des propriétés pour remplacer les propriétés suivantes par les nouvelles valeurs :

   Propriété	Nouvelle valeur
   Nom	clearButton
   Texte	Clair

3. Double-cliquez sur le bouton pour générer une nouvelle fonction. Cette fonction s'exécutera lorsque vous cliquerez sur le bouton lors de l'exécution:

   privéannulerclearButton_Click(expéditeur d'objet, EventArgs e)
   {
   }

4. Dans la fonction, effacez le contenu de l'élément ListBox UI et masquez-le:

   privéannulerclearButton_Click(expéditeur d'objet, EventArgs e)
   {
   uploadedFilesList.Articles.Clair();
    uploadedFilesList. Visible = FAUX;
   }

Comment tester le panneau glisser-déposer

Pour tester la fonctionnalité de glisser-déposer, exécutez l'application et faites glisser certains fichiers dans le panneau. Si nécessaire, vous pouvez également déboguer votre application Winforms dans Visual Studio au moment de l'exécution. Cela vous aidera à comprendre ce qui se passe dans chaque ligne de code.

1. Appuyez sur le bouton de lecture vert en haut de la fenêtre Visual Studio pour exécuter l'application.
2. Faites glisser quelques fichiers depuis votre explorateur de fichiers et déposez-les dans le panneau. Assurez-vous que vous n'exécutez pas Visual Studio en mode administrateur. Vous devrez configurer des autorisations de sécurité supplémentaires pour que le glisser-déposer fonctionne en mode administrateur.
3. Le panneau se mettra à jour pour vous montrer les noms des fichiers que vous avez glissés dans le panneau.
4. Faites glisser suffisamment de fichiers et vous verrez que le panneau de glisser-déposer affiche automatiquement une barre de défilement sur son côté droit.
5. Clique sur le Clair bouton pour vider la liste.

Utilisation de la fonctionnalité glisser-déposer dans les applications Windows Form

Maintenant, espérons-le, vous comprenez comment ajouter une fonctionnalité de glisser-déposer à votre application Windows Form. Il existe de nombreuses autres fonctionnalités que vous pouvez explorer pour faire des choses intéressantes avec Windows Forms.