Vlastné progressbar v C #
V tomto tutoriále si popíšeme ako jednoducho vytvoriť progressbar (ďalej len PB) s vlastným vzhľadom. Vo svojej podstate sa už potom nejde o PB ako taký, ale urobíme si k nemu metódy, aby fungoval rovnako ako normálne. Využijeme na to panely, pretože majú tú výhodu, že sa u nich dá nastaviť Tile (opakovanie) obrázka v pozadí.
Najprv si vytvoríme nejaké pozadie pre náš PB, dávam prednosť šírke 1px a výšku si môžeme nastaviť ľubovoľnú.
![Okenné aplikácie v C # .NET vo Windows Forms](images/340/pic1_background.png)
(Obrázok je 16x zväčšený)
Odporúčam si pre jednoduchšie umiestňovanie vytvoriť panel, ktorý bude slúžiť ako "krabice" pre ostatné súčasti nášho PB. Zjednoduší nám to neskoršiu prácu s naším PB, napríklad pri premiestňovaní. Tento panel môže mať ľubovoľnú veľkosť, ja pre názornosť použijem o 1px na šírku väčšia ako samotný PB, teda 152px a výšku si dám treba 30px.
Do tohto hlavného panela si potom umiestnime ďalší panel, ktorý už bude mať však, jasnejšie veľkosť, Výšku si nastavíme rovnakú ako u vytvoreného pozadie, a šírku však môžeme mať ľubovoľnú, ja som použil šírku 150px.
Ďalej je potrebné si vytvoriť ešte popredia nášho PB, to by malo mať rovnakú veľkosť ako pozadie.
![Okenné aplikácie v C # .NET vo Windows Forms](images/340/pic2_foreground.png)
Tomuto panelu nastavíme ako pozadie náš druhý obrazok, ktorý chceme mať v popredí. Dôležité je, aby bol náš panel popredia nad panelom pozadí, keď to tak nie je tak stačí dať tlačidlo BringToFront, alebo si do kódu pod InitializeComponent (); umiestniť: [názov panelu] .BringToFront (); Potom čo vieme ako náš panel popredí vyzerá tak mu nastavíme šírku na 0px.
Teraz by mal náš PB vyzerať zhruba takto:
![Okenné aplikácie v C # .NET vo Windows Forms](images/340/pic3_nahled.png)
Takto bude náš PB vyzerať na konci, teraz je čas dať mu dákou funkčnosť.
Prvý si vytvoríme Metódu na určenie hodnoty, v tomto príklade budem mať napríklad maximálnu hodnotu 100 a minimálne 0.
private void Set_PB_Value(int Value) { PB_Foreground.Width = (int)(Value * (PB_Background.Width / 100F)); }
kde:
- PB_Foreground je panel popredí (v tomto prípade červený),
- PB_Background je panel pozadie (v tomto prípade šedý),
- Value je vstupná hodnota v percentách od 0 do 100
Tým by sme mali základ nášho PB. Výhodou je, keď mu dáme možnosť vrátiť aj nejakú hodnotu tým, že na neho klikneme myšou. K tomu si napíšemem metódu.
private void PB_MouseClick(object sender, MouseEventArgs e) { if (e.Button == System.Windows.Forms.MouseButtons.Left) { double mouse_x = (Control.MousePosition.X - this.Location.X - 3 - (CPB_Container.Location.X + PB_Background.Location.X)); double Value = ((mouse_x / PB_Background.Width) * 100); // Vrácená hodnota určí hodnotu PB Set_PB_Value((int)Value); // Kontrola vrácené hodnoty numericUpDown1.Value = (decimal)Value; } }
kde:
- -3 je použité iba ak nemáme nastavený form bez okrajov, inak to vynecháme,
- CPB_Container je panel našej "krabice" ktorý obsahuje ostatné časti nášho PB,
- PB_Background pozri vyššie,
- PB_Foreground pozri vyššie,
Ešte by som dodal, že túto metódu si nastavíme ako MouseClickEvent u oboch panelov (popredia i pozadia).
To by bolo všetko k vlastnému progressbar. Dúfam, že som to opísal dosť zrozumiteľne aj pre tých, ktorí sa s tým ešte nestretli.
Stiahnuť
Stiahnutím nasledujúceho súboru súhlasíš s licenčnými podmienkami
Stiahnuté 566x (47.32 kB)
Aplikácia je vrátane zdrojových kódov v jazyku C#