Teme so odličen način, da svojim uporabnikom omogočite, da prilagodijo vašo aplikacijo, ne da bi se morali preveč vmešavati v določene podrobnosti.
Za sodobne aplikacije je običajno, da imajo možnost preklapljanja med različnimi temami. Nekatere aplikacije vam na primer omogočajo preklapljanje med svetlo in temno temo, medtem ko imajo druge morda več izbire tem.
Windows Forms je ogrodje uporabniškega vmesnika, ki omogoča ustvarjanje namiznih aplikacij. Teme lahko implementirate v aplikacijo obrazca Windows tako, da za vsako temo ustvarite izbirne gumbe.
Ko uporabnik izbere temo, lahko spremenite lastnosti barve ozadja ali barve besedila vsakega elementa, da se ujema z izbrano temo.
Kako nastaviti projekt Windows Form
Najprej ustvarite novo aplikacijo obrazca Windows. Napolnite nov projekt z nekaj osnovnimi kontrolniki, kot so gumbi in oznake.
- Ustvariti novo aplikacijo Windows Forms v Visual Studio.
- V novem projektu uporabite orodjarno za iskanje kontrolnika gumba.
- Izberite nadzor gumba in ga povlecite na platno. Dodajte skupno tri kontrolnike gumbov.
- Z orodjem kliknite in povlecite a nadzor etikete na platno. Nalepko postavite pod gumbe.
- Oblikujte gumbe in oznake v oknu lastnosti. Spremenite lastnosti v naslednje:
Nadzor Ime lastnosti Nova vrednost gumb1 Velikost 580, 200 FlatStyle Stanovanje Besedilo Uporabniki gumb2 Velikost 580, 100 FlatStyle Stanovanje Besedilo Računi gumb3 Velikost 580, 100 FlatStyle Stanovanje Besedilo Dovoljenja oznaka1 Besedilo Avtorske pravice 2022
Kako ustvariti gumb za nastavitve in seznam tem
Da bo meni preprostih tem deloval, ustvarite več gumbov, ki bodo predstavljali vsako temo. Aplikacija bo vključevala tri teme, temo "Light", temo "Nature" in temo "Dark".
- Na platno dodajte še en kontrolnik gumba, ki bo predstavljal gumb za nastavitve (ali »teme«).
- Spremenite lastnosti tega gumba v naslednje:
Ime lastnosti Nova vrednost Ime btnThemeSettings FlatStyle Stanovanje Velikost 200, 120 Besedilo Teme - Povlecite še tri gumbe na platno. Ti gumbi bodo predstavljali tri različne teme. Spremenite lastnosti za vsakega od gumbov na naslednje:
Nadzor Ime lastnosti Nova vrednost 1. gumb Ime btnLightTheme BackColor WhiteSmoke Velikost 200, 80 FlatStyle Stanovanje Besedilo Svetloba Vidno False 2. gumb Ime btnNatureTheme BackColor DarkSeaGreen Velikost 200, 80 FlatStyle Stanovanje Besedilo Narava Vidno False 3. gumb Ime btnDarkTheme BackColor DimGray ForeColor Bela Velikost 200, 80 FlatStyle Stanovanje Besedilo Temno Vidno False - Dvokliknite na Teme gumb. To bo ustvarilo metodo za obravnavo dogodka »on click«. Metoda se bo zagnala, ko uporabnik klikne ta gumb.
- Privzeto teme »Light«, »Nature« in »Dark« ne bodo vidne. Znotraj funkcije dodajte funkcijo za preklop vidnosti gumbov na prikaz ali skrivanje.
zasebnoprazninabtnThemeSettings_Click(pošiljatelj predmeta, EventArgs e)
{
btnNatureTheme. Vidno = !btnNatureTheme. Vidno;
btnLightTheme. Vidno = !btnLightTheme. Vidno;
btnDarkTheme. Vidno = !btnDarkTheme. Vidno;
} - Zaženite aplikacijo s klikom na zeleni gumb za predvajanje na vrhu okna Visual Studio.
- Med izvajanjem bo aplikacija privzeto skrila gumbe za vsako od treh tem.
- Kliknite na Teme gumb za preklop tem za prikaz. Še naprej lahko pritiskate na Teme gumb za preklop njihove vidnosti.
Kako upravljati svoje teme
Ustvarite slovarje za vsako temo, da shranite različne barve, ki jih bo uporabljala. To je zato, da shranite vse svoje barve teme na enem mestu, če jih boste morali uporabiti večkrat. Prav tako olajša, če želite v prihodnosti posodobiti temo z novimi barvami.
- Na vrhu privzetega Form1.cs C# in znotraj Oblika razreda ustvarite globalno enum. Ta enum bo shranil različne vrste barv, ki jih boste uporabili v temi.
enum ThemeColor
{
primarno,
sekundarno,
terciarno,
Besedilo
} - Spodaj navedite tri globalne slovarje, po enega za vsako od treh tem. Več o slovarjih lahko preberete, če niste seznanjeni z uporabo a slovar v C#.
Slovar<ThemeColor, Barva> Svetloba = nov slovar<ThemeColor, Barva>();
Slovar<ThemeColor, Barva> Narava = nov slovar<ThemeColor, Barva>();
Slovar<ThemeColor, Barva> Temno = nov slovar<ThemeColor, Barva>(); - Znotraj konstruktorja inicializirajte slovarje. Dodajte vrednosti za različne barve, ki jih bo uporabljala vsaka tema.
javnosti obrazec1()
{
Inicializiraj komponento();
// Tukaj dodajte slovarje
Svetloba = nov slovar<ThemeColor, Barva>() {
{ Barva teme. Primarni, barvni. WhiteSmoke},
{ Barva teme. Sekundarno, barvno. srebro},
{ Barva teme. Terciar, Barv. Bela},
{ Barva teme. Besedilo, barva. Črna }
};
Narava = nov slovar<ThemeColor, Barva>() {
{ Barva teme. Primarni, barvni. DarkSeaGreen},
{ Barva teme. Sekundarno, barvno. AliceBlue},
{ Barva teme. Terciar, Barv. Medena rosa },
{ Barva teme. Besedilo, barva. Črna }
};
Temno = nov slovar<ThemeColor, Barva>() {
{ Barva teme. Primarni, barvni. DimGray },
{ Barva teme. Sekundarno, barvno. DimGray },
{ Barva teme. Terciar, Barv. Črna },
{ Barva teme. Besedilo, barva. Bela }
};
}
Kako spremeniti temo
Ustvarite funkcije za upravljanje teme aplikacije. Te funkcije bodo spremenile barvo ozadja ali barvo besedila elementov uporabniškega vmesnika na platnu.
- Ustvarite novo funkcijo, imenovano Spremeni temo(). Funkcija bo vzela barve za temo kot argumente.
- Znotraj funkcije spremenite lastnosti barve ozadja elementov uporabniškega vmesnika. Nove barve ozadja bodo uporabljale barve za izbrano temo.
zasebnoprazninaChangeTheme(Barva primarna barva, barva sekundarna barva, barva terciarna barva)
{
// Spremenite barvo ozadja gumbov
btnThemeSettings. BackColor = primarna barva;
button1.BackColor = primarna barva;
button2.BackColor = secondaryColor;
button3.BackColor = secondaryColor;
to.BackColor = terciaryColor;
} - Ustvarite novo funkcijo, imenovano ChangeTextColor(). To lahko uporabite za spreminjanje barve besedila med temno in svetlo. To zagotavlja, da bo besedilo na temnem ozadju še vedno berljivo.
zasebnoprazninaChangeTextColor(Barva besedilaColor)
{
// spremeniti barva odbesedilo
button1.ForeColor = textColor;
button2.ForeColor = textColor;
button3.ForeColor = textColor;
label1.ForeColor = textColor;
btnThemeSettings. ForeColor = textColor;
} - V oblikovalcu dvokliknite kontrolnik gumba "Light". To bo odprlo datoteko s kodo v ozadju in ustvarilo obravnavo dogodkov, ko uporabnik klikne gumb.
- Znotraj obdelovalnika dogodkov uporabite Spremeni temo() in ChangeTextColor() funkcije. Vnesite barve, ki jih uporablja tema. Te barve lahko pridobite iz slovarja tem "Light".
zasebnoprazninabtnLightTheme_Click(pošiljatelj predmeta, EventArgs e)
{
ChangeTheme(Svetloba[Barva teme. Primarni], Svetloba[Barva teme. sekundarni], Svetloba[Barva teme. terciarno]);
ChangeTextColor(Svetloba[Barva teme. besedilo]);
} - Vrnite se v oblikovalec in kliknite gumba "Nature" in "Dark". Uporabi Spremeni temo() in ChangeTextColor() deluje tudi v svojih obdelovalcih dogodkov.
zasebnoprazninabtnNatureTheme_Click(pošiljatelj predmeta, EventArgs e)
{
ChangeTheme(Narava[Barva teme. Primarni], Narava[Barva teme. sekundarni], Narava[Barva teme. terciarno]);
ChangeTextColor(Narava[Barva teme. besedilo]);
}
zasebnoprazninabtnDarkTheme_Click(pošiljatelj predmeta, EventArgs e)
{
ChangeTheme(Temno[Barva teme. Primarni], Temno[Barva teme. sekundarni], Temno[Barva teme. terciarno]);
ChangeTextColor(Temno[Barva teme. besedilo]);
} - Privzeto mora biti tema nastavljena na temo "Light", ko uporabnik prvič odpre aplikacijo. V konstruktorju pod slovarji uporabite Spremeni temo() in ChangeTextColor() funkcije.
ChangeTheme(Svetloba[Barva teme. Primarni], Svetloba[Barva teme. sekundarni], Svetloba[Barva teme. terciarno]);
ChangeTextColor(Svetloba[Barva teme. besedilo]); - Zaženite aplikacijo s klikom na zeleni gumb za predvajanje na vrhu okna Visual Studio.
- Aplikacija privzeto uporablja temo "Light" in za kontrolnike uporabniškega vmesnika uporabi sivo barvno shemo. Preklopite gumb za teme, da si ogledate seznam tem.
- Kliknite na temo Narava.
- Kliknite temno temo.
Ustvarjanje aplikacij z uporabo Windows Forms
Številne aplikacije omogočajo uporabniku preklapljanje med več temami. Aplikaciji Windows Forms lahko dodate teme tako, da ustvarite možnosti, ki jih uporabnik izbere.
Ko uporabnik klikne temo, lahko spremenite barvo ozadja, besedilo ali katere koli druge lastnosti, da se ujemajo z barvami, uporabljenimi v izbrani temi.
Barve za vsako od tem uporabljajo vgrajene barve Visual Studio. Za boljšo izkušnjo uporabnikom boste morali uporabiti ustrezno barvno shemo. Izvedete lahko več o različnih načinih, kako lahko izberete barvno shemo za svojo aplikacijo.
