Sådan opretter du en træk og slip filuploader i en Winforms-app

Mange moderne applikationer fungerer på filer, som en bruger kan uploade til deres system. Billedredigeringsprogrammer, kode-IDE'er og tekstbehandlingsprogrammer er alle eksempler. Hvis du bygger en Windows Form-applikation, kan du nemt tilføje denne funktionalitet som en del af din brugergrænseflade.

Windows Form-applikationer giver dig mulighed for at trække og slippe UI-elementer såsom paneler eller listebokse. Du kan bruge disse UI-elementer til at oprette din træk og slip-funktionalitet. Når brugeren trækker en fil til et panel, kan du vise feedback baseret på den fil.

Sådan opretter du brugergrænsefladen til træk og slip-beholderen

Du kan bruge et panelelement til at oprette brugergrænsefladen til træk og slip-funktionalitet. Du kan derefter bruge et ListBox UI-element til at vise navnene på alle filer, som en bruger trækker ind på panelet.

1. Opret en ny Windows Forms-applikation.
2. I værktøjskassen skal du søge efter et panel-UI-element og trække det til lærredet.
3. Fremhæv det nye panel. I egenskabsvinduet skal du ændre værdierne for følgende egenskaber:

   Ejendom	Ny værdi
   Navn	dragDropPanel
   Bagsidefarve	WhiteSmoke
   BorderStyle	FixedSingle
   Størrelse	600, 400
   Synlig	Rigtigt

4. I værktøjskassen skal du søge efter et ListBox UI-element og trække det til lærredet. Placer den, så den er inde i panelet, og sørg for, at der er en vis afstand mellem ListBox og panelet.
5. Fremhæv den nye ListBox, og skift værdierne for følgende egenskaber:

   Ejendom	Ny værdi
   Navn	uploadedFilesList
   Bagsidefarve	WhiteSmoke
   BorderStyle	Ingen
   Størrelse	500, 300
   Synlig	Falsk

Sådan tilføjes træk og slip-begivenheden

Du kan bruge begivenheder i en Windows-formularapplikation kun at udføre visse funktioner, når visse hændelser opstår.

For at tilføje funktionalitet til træk og slip-panelet skal du tilføje to begivenheder. Hændelsen "DragEnter" vil forekomme, når du trækker filer hen over panelet. Hændelsen "DragDrop" vil forekomme, når du slipper musen for at slippe filerne i panelet.

1. Fremhæv det ydre panel UI-element.
2. I egenskabsvinduet skal du klikke på Lynnedslag ikon for at åbne begivenhedslisten.
3. Dobbeltklik på Træk Enter hændelse for at generere en ny funktion. Denne funktion udføres, når du trækker filer hen over panelet.
4. Inde i den nye funktion skal du ændre ikonet på musen for at angive træk/slip-handlingen:

   privatugyldigdragDropPanel_DragEnter(objektafsender, DragEventArgs e)
   {
   // Ændrer ikonet for musen
    e. Effekt = DragDropEffects. Alle;
   }

5. Klik på Form 1.cs [Design] fanen øverst i Visual Studio-vinduet for at gå tilbage til lærredsvisningen. Fremhæv panelets UI-element.
6. I egenskabsvinduet skal du klikke på Lynnedslag ikon for at gå tilbage til begivenhedslisten. Denne gang skal du dobbeltklikke på Drag Drop begivenhed. Dette vil generere en anden funktion, der udføres, når du slipper musen for at slippe filerne i panelet.
7. Inde i den nye DragDrop-funktion får du listen over filer, som brugeren trækker ind i panelet. Du kan finde dette i begivenhedsdetaljerne, der automatisk overføres til funktionen.

   privatugyldigdragDropPanel_DragDrop(objektafsender, DragEventArgs e)
   {
    streng[] filer = (streng[])e. Data. GetData (DataFormats. FileDrop, falsk);
   }

Sådan får du vist listen over trukket filer

Nu hvor du har tilføjet funktionaliteten for brugeren til at trække og slippe filer, kan du vise navnene på filerne ved hjælp af ListBox UI-elementet.

1. Inde i dragDropPanel_DragDrop()-funktionen, efter at have hentet listen over filer, skal du bruge en for-loop til at sløjfe gennem hver fil.

   for hver (var fil i filer)
   {
   
   }

2. Inde i for-løkken får du kun navnet på filen. Adskil filens navn fra filstien, og gem det i en separat variabel. Hvis du bruger en Mac, skal du muligvis ændre koden for at tage hensyn til skråstreger fremad i stedet for skråstreger.

   streng filnavn = fil. Understreng (fil. LastIndexOf("\\") + 1, fil. Længde - (fil. LastIndexOf("\\") + 1));

3. Tilføj navnet på filen til ListBox UI-elementet.

   prøve
   {
   uploadedFilesList. Varer.Tilføje(filnavn);
   }
   fangst (Undtagelseundtagelse)
   {
    Konsol. WriteLine(undtagelse);
   }

4. ListBox er ikke synlig som standard. Efter for-løkken skal du ændre synligheden af ​​ListBox til sand:

   uploadedFilesList. Synlig = rigtigt;

5. Rediger konstruktøren øverst i filen. Indstil TilladDrop og AutoScroll egenskaberne for træk og slip-panelet til sand.

   offentlig Form1()
   {
    InitializeComponent();
    dragDropPanel. TilladDrop = rigtigt;
    dragDropPanel. AutoScroll = rigtigt;
   }

Sådan rydder du listen

Når brugeren har trukket elementer ind i panelet, vil de måske rydde listen og starte igen. Du kan tilføje en knap for at rydde listen, når brugeren klikker på den.

1. Brug værktøjskassen til at trække en knap ind på lærredet.
2. Fremhæv knappen. Brug egenskabsvinduet til at ændre følgende egenskaber til de nye værdier:

   Ejendom	Ny værdi
   Navn	clear-knappen
   Tekst	Klar

3. Dobbeltklik på knappen for at generere en ny funktion. Denne funktion vil køre, når du klikker på knappen under kørsel:

   privatugyldigclearButton_Click(objektafsender, EventArgs e)
   {
   }

4. Inde i funktionen skal du rydde indholdet af ListBox UI-elementet og skjule det:

   privatugyldigclearButton_Click(objektafsender, EventArgs e)
   {
   uploadedFilesList. Varer.Klar();
    uploadedFilesList. Synlig = falsk;
   }

Sådan tester du træk og slip-panelet

For at teste træk og slip-funktionen skal du køre programmet og trække nogle filer ind i panelet. Hvis det er nødvendigt, kan du også fejlfinde din Winforms-applikation i Visual Studio under runtime. Dette vil hjælpe dig med at forstå, hvad der sker i hver linje kode.

1. Tryk på den grønne afspilningsknap øverst i Visual Studio-vinduet for at køre programmet.
2. Træk nogle filer fra din filstifinder, og slip dem i panelet. Sørg for, at du ikke kører Visual Studio i administratortilstand. Du skal konfigurere ekstra sikkerhedstilladelser for at trække og slippe for at fungere i administratortilstand.
3. Panelet opdateres for at vise dig navnene på de filer, du trak ind i panelet.
4. Træk nok filer, og du vil se, at træk og slip-panelet automatisk viser en rullepanel på højre side.
5. Klik på Klar knappen for at tømme listen.

Brug af træk og slip-funktionalitet i Windows Form Apps

Nu forstår du forhåbentlig, hvordan du tilføjer træk og slip-funktionalitet til din Windows Form-applikation. Der er mange andre funktioner, du kan udforske for at gøre interessante ting med Windows Forms.