Ia adalah perkara biasa untuk aplikasi moden mempunyai pilihan untuk bertukar antara tema yang berbeza. Contohnya, sesetengah aplikasi membenarkan anda menukar antara tema terang atau tema gelap, manakala yang lain mungkin mempunyai lebih banyak pilihan tema.
Windows Forms ialah rangka kerja UI yang membolehkan anda membuat aplikasi desktop. Anda boleh melaksanakan tema dalam apl borang Windows dengan mencipta butang yang boleh dipilih untuk setiap tema.
MAKEUSEOF VIDEO OF THE DAY
Apabila pengguna memilih tema, anda boleh menukar warna latar belakang atau sifat warna teks setiap elemen untuk dipadankan dengan tema yang dipilih.
Cara Sediakan Projek Borang Windows
Mula-mula, buat apl borang Windows baharu. Isi projek baharu dengan beberapa kawalan asas, seperti butang dan label.
- Buat a aplikasi Windows Forms baharu dalam Visual Studio.
- Dalam projek baharu, gunakan kotak alat untuk mencari kawalan butang.
- Pilih kawalan butang dan seret ke atas kanvas. Tambah sejumlah tiga kawalan butang.
- Menggunakan kotak alat, klik dan seret a kawalan label ke atas kanvas. Letakkan label di bawah butang.
- Gaya butang dan label menggunakan tetingkap sifat. Tukar sifat kepada yang berikut:
butang1 Saiz 580, 200 Gaya Rata rata Teks Pengguna butang2 Saiz 580, 100 Gaya Rata rata Teks Akaun butang3 Saiz 580, 100 Gaya Rata rata Teks kebenaran label1 Teks Hak Cipta 2022
Cara Mencipta Butang Tetapan dan Senarai Tema
Untuk menu tema mudah berfungsi, buat berbilang butang untuk mewakili setiap tema. Aplikasi ini akan merangkumi tiga tema, tema 'Cahaya', tema 'Alam Semulajadi' dan tema 'Gelap'.
- Tambahkan satu lagi kawalan butang pada kanvas untuk mewakili butang tetapan (atau 'Tema').
- Tukar sifat butang ini kepada yang berikut:
Nama btnTetapanTema Gaya Rata rata Saiz 200, 120 Teks Tema - Seret tiga lagi butang ke atas kanvas. Butang ini akan mewakili tiga tema yang berbeza. Tukar sifat untuk setiap butang kepada yang berikut:
Butang pertama Nama btnTema Cahaya Warna Belakang WhiteSmoke Saiz 200, 80 Gaya Rata rata Teks Cahaya Kelihatan Salah Butang ke-2 Nama btnTema Alam Semulajadi Warna Belakang Hijau Laut Gelap Saiz 200, 80 Gaya Rata rata Teks alam semula jadi Kelihatan Salah Butang ke-3 Nama btnTema Gelap Warna Belakang DimGray ForeColor putih Saiz 200, 80 Gaya Rata rata Teks Gelap Kelihatan Salah - Klik dua kali pada Tema butang. Ini akan mencipta kaedah untuk mengendalikan acara 'pada klik'. Kaedah ini akan dijalankan apabila pengguna mengklik butang ini.
- Secara lalai, tema 'Cahaya', 'Alam Semula Jadi' dan 'Gelap' tidak akan kelihatan. Di dalam fungsi, tambahkan fungsi untuk menogol keterlihatan butang sama ada untuk ditunjukkan atau disembunyikan.
private void btnThemeSettings_Click(object sender, EventArgs e)
{
btnNatureTheme.Visible = !btnNatureTheme.Visible;
btnLightTheme.Visible = !btnLightTheme.Visible;
btnDarkTheme.Visible = !btnDarkTheme.Visible;
} - Jalankan aplikasi dengan mengklik butang main hijau di bahagian atas tetingkap Visual Studio.
- Pada masa jalan, aplikasi akan menyembunyikan butang untuk setiap tiga tema secara lalai.
- Klik pada Tema butang untuk menogol tema untuk ditunjukkan. Anda boleh terus menekan butang Tema butang untuk menogol keterlihatan mereka.
Cara Mengurus Tema Anda
Cipta Kamus untuk setiap tema untuk menyimpan warna berbeza yang akan digunakannya. Ini adalah supaya anda menyimpan semua warna tema anda di satu tempat, sekiranya anda perlu menggunakannya beberapa kali. Ia juga memudahkan jika anda ingin mengemas kini tema dengan warna baharu pada masa hadapan.
- Di bahagian atas lalai Borang1.cs C# dan di dalam fail Borang kelas, buat enum global. Enum ini akan menyimpan pelbagai jenis warna yang anda akan gunakan dalam tema.
enum ThemeColor
{
Primary,
Secondary,
Tertiary,
Text
} - Di bawahnya, isytiharkan tiga Kamus global, satu untuk setiap tiga tema. Anda boleh membaca lebih lanjut tentang Kamus jika anda tidak biasa dengan cara menggunakan a kamus dalam C# .
Dictionary<ThemeColor, Color> Light = new Dictionary<ThemeColor, Color>();
Dictionary<ThemeColor, Color> Nature = new Dictionary<ThemeColor, Color>();
Dictionary<ThemeColor, Color> Dark = new Dictionary<ThemeColor, Color>(); - Di dalam pembina, mulakan kamus. Tambahkan nilai untuk warna berbeza yang akan digunakan oleh setiap tema.
public Form1()
{
InitializeComponent();
// Add dictionaries here
Light = new Dictionary<ThemeColor, Color>() {
{ ThemeColor.Primary, Color.WhiteSmoke },
{ ThemeColor.Secondary, Color.Silver },
{ ThemeColor.Tertiary, Color.White },
{ ThemeColor.Text, Color.Black }
};
Nature = new Dictionary<ThemeColor, Color>() {
{ ThemeColor.Primary, Color.DarkSeaGreen },
{ ThemeColor.Secondary, Color.AliceBlue },
{ ThemeColor.Tertiary, Color.Honeydew },
{ ThemeColor.Text, Color.Black }
};
Dark = new Dictionary<ThemeColor, Color>() {
{ ThemeColor.Primary, Color.DimGray },
{ ThemeColor.Secondary, Color.DimGray },
{ ThemeColor.Tertiary, Color.Black },
{ ThemeColor.Text, Color.White }
};
}
Cara Menukar Tema
Cipta fungsi untuk mengurus tema aplikasi. Fungsi ini akan menukar warna latar belakang atau warna teks elemen UI pada kanvas.
cara menyambungkan wii ke tv dengan HDMI
- Buat fungsi baharu yang dipanggil Tukar tema() . Fungsi ini akan mengambil warna untuk tema sebagai hujah.
- Di dalam fungsi, tukar sifat warna latar belakang elemen UI. Warna latar belakang baharu akan menggunakan warna untuk tema yang dipilih.
private void ChangeTheme(Color primaryColor, Color secondaryColor, Color tertiaryColor)
{
// Change background color of buttons
btnThemeSettings.BackColor = primaryColor;
button1.BackColor = primaryColor;
button2.BackColor = secondaryColor;
button3.BackColor = secondaryColor;
this.BackColor = tertiaryColor;
} - Buat fungsi baharu yang dipanggil ChangeTextColor() . Anda boleh menggunakan ini untuk menukar warna teks antara gelap dan terang. Ini adalah untuk memastikan teks pada latar belakang gelap masih boleh dibaca.
private void ChangeTextColor(Color textColor)
{
// Change color of text
button1.ForeColor = textColor;
button2.ForeColor = textColor;
button3.ForeColor = textColor;
label1.ForeColor = textColor;
btnThemeSettings.ForeColor = textColor;
} - Daripada pereka bentuk, klik dua kali pada kawalan butang 'Cahaya'. Ini akan membuka fail di belakang kod dan menjana pengendali acara apabila pengguna mengklik butang.
- Di dalam pengendali acara, gunakan Tukar tema() dan ChangeTextColor() fungsi. Masukkan warna yang digunakan oleh tema. Anda boleh mendapatkan semula warna ini daripada kamus tema 'Ringan'.
private void btnLightTheme_Click(object sender, EventArgs e)
{
ChangeTheme(Light[ThemeColor.Primary], Light[ThemeColor.Secondary], Light[ThemeColor.Tertiary]);
ChangeTextColor(Light[ThemeColor.Text]);
} - Kembali ke pereka bentuk dan klik pada butang 'Nature' dan 'Dark'. Menggunakan Tukar tema() dan ChangeTextColor() berfungsi dalam pengendali acara mereka juga.
private void btnNatureTheme_Click(object sender, EventArgs e)
{
ChangeTheme(Nature[ThemeColor.Primary], Nature[ThemeColor.Secondary], Nature[ThemeColor.Tertiary]);
ChangeTextColor(Nature[ThemeColor.Text]);
}
private void btnDarkTheme_Click(object sender, EventArgs e)
{
ChangeTheme(Dark[ThemeColor.Primary], Dark[ThemeColor.Secondary], Dark[ThemeColor.Tertiary]);
ChangeTextColor(Dark[ThemeColor.Text]);
} - Secara lalai, tema harus ditetapkan kepada tema 'Ringan' apabila pengguna mula-mula membuka apl. Dalam pembina, di bawah kamus, gunakan Tukar tema() dan ChangeTextColor() fungsi.
ChangeTheme(Light[ThemeColor.Primary], Light[ThemeColor.Secondary], Light[ThemeColor.Tertiary]);
ChangeTextColor(Light[ThemeColor.Text]); - Jalankan aplikasi dengan mengklik butang main hijau di bahagian atas tetingkap Visual Studio.
- Secara lalai, aplikasi menggunakan tema 'Cahaya' dan menggunakan skema warna kelabu pada kawalan UI. Togol butang tema untuk melihat senarai tema.
- Klik pada tema Alam Semula Jadi.
- Klik pada tema Gelap.
Mencipta Aplikasi Menggunakan Borang Windows
Banyak aplikasi membenarkan pengguna bertukar antara berbilang tema. Anda boleh menambah tema pada aplikasi Windows Forms dengan mencipta pilihan untuk dipilih oleh pengguna.
Apabila pengguna mengklik pada tema, anda boleh menukar warna latar belakang, teks atau mana-mana sifat lain untuk dipadankan dengan warna yang digunakan dalam tema yang dipilih.
Warna untuk setiap tema menggunakan warna terbina dalam Visual Studio. Anda perlu menggunakan skema warna yang betul untuk memberikan pengguna pengalaman yang lebih baik. Anda boleh mengetahui lebih lanjut tentang cara berbeza anda boleh memilih skema warna untuk apl anda.