Windows Forms uygulamalarında veri listeleme denildiğinde akla gelen ilk bileşenlerden biri DataGridView kontrolüdür. Veritabanı sonuçlarını göstermek, rapor ekranları oluşturmak veya kullanıcıya tablo biçiminde veri sunmak isteyen geliştiriciler için oldukça güçlü bir çözümdür. Ancak varsayılan görünümü günümüz kullanıcı arayüzü standartlarına göre oldukça eski ve sade kalmaktadır.
Modern masaüstü uygulamalarında kullanıcı deneyimi yalnızca performansla sınırlı değildir. Kullanıcıların verileri hızlı okuyabilmesi, ekran üzerinde rahat gezinebilmesi ve profesyonel bir arayüzle karşılaşması da büyük önem taşır. Bu nedenle DataGridView görünümünü özelleştirmek çoğu projede zorunlu hale gelmektedir.
Bu rehberde C# DataGridView görünümünü değiştirme yöntemlerini detaylı olarak inceleyeceğiz. Temel görünüm ayarlarından modern tasarım tekniklerine, performans optimizasyonlarından profesyonel stil yapılarına kadar ihtiyaç duyabileceğiniz tüm detayları bulabilirsiniz.
- DataGridView Nedir?
- Neden DataGridView Özelleştirilmelidir?
- Temel Görünüm Ayarları
- DataGridView Stil Ayarları
- Sütun Boyutlandırma Teknikleri
- Modern DataGridView Tasarımı
- Koyu Tema Tasarımı
- Hazır Extension Sınıfı Kullanımı
- Performans İyileştirme Teknikleri
- Yaygın Hatalar ve Çözümleri
- Sık Sorulan Sorular
DataGridView Nedir?
DataGridView, Windows Forms uygulamalarında tablo yapısında veri görüntülemek için kullanılan gelişmiş bir kullanıcı arayüzü bileşenidir. Veritabanı kayıtları, raporlar, ürün listeleri, müşteri kayıtları ve daha birçok veri tipi bu kontrol ile görüntülenebilir.
Kısaca tanımlamak gerekirse DataGridView; satır ve sütun mantığı ile çalışan, veri bağlama desteği sunan ve geliştiricilere geniş özelleştirme imkanları sağlayan bir WinForms kontrolüdür.
DataGridView Ne İşe Yarar?
- Verileri tablo halinde gösterebilir.
- Veritabanı kayıtlarını listeleyebilir.
- Sıralama işlemleri yapılabilir.
- Filtreleme uygulanabilir.
- Veri düzenleme ekranları oluşturulabilir.
- Raporlama sistemlerinde kullanılabilir.
Neden DataGridView Özelleştirilmelidir?
Varsayılan DataGridView görünümü teknik olarak yeterli olsa da profesyonel projelerde kullanıcı deneyimi açısından eksik kalır.
Özelleştirilmiş bir görünüm kullanıcıların verileri daha kolay okumasını sağlar. Ayrıca kurumsal uygulamalarda marka kimliği ile uyumlu arayüzler oluşturulmasına yardımcı olur.
| Varsayılan Görünüm | Özelleştirilmiş Görünüm |
|---|---|
| Sade tasarım | Profesyonel görünüm |
| Düşük okunabilirlik | Yüksek okunabilirlik |
| Standart renkler | Kurumsal renk desteği |
| Eski kullanıcı deneyimi | Modern kullanıcı deneyimi |
Temel Görünüm Ayarları
Satır Başlıklarını Gizleme
dgv.RowHeadersVisible = false;
Modern uygulamalarda satır başlıkları çoğu zaman kullanılmaz. Bu nedenle gizlenmesi daha temiz bir görünüm sağlar.
Tam Satır Seçimi
dgv.SelectionMode = DataGridViewSelectionMode.FullRowSelect;
Satır bazlı seçim yapılması kullanıcı deneyimini artırır.
Yeni Satır Eklemeyi Kapatma
dgv.AllowUserToAddRows = false;
Satır Silmeyi Kapatma
dgv.AllowUserToDeleteRows = false;
Salt Okunur Kullanım
dgv.ReadOnly = true;
Rapor ekranlarında ve listeleme işlemlerinde oldukça kullanışlıdır.
DataGridView Stil Ayarları
Profesyonel bir görünüm oluşturmak için stil ayarlarının dikkatli şekilde yapılandırılması gerekir.
Satır Yüksekliği
dgv.RowTemplate.Height = 35;
Yazı Rengi
dgv.DefaultCellStyle.ForeColor = Color.White;
Arka Plan Rengi
dgv.DefaultCellStyle.BackColor = Color.FromArgb(66,65,60);
Seçim Rengi
dgv.DefaultCellStyle.SelectionBackColor = Color.DimGray;
Hizalama
dgv.DefaultCellStyle.Alignment = DataGridViewContentAlignment.MiddleCenter;
Sütun Boyutlandırma Teknikleri
DataGridView kullanımında en önemli konulardan biri sütun genişliklerinin doğru ayarlanmasıdır.
Fill Modu
dgv.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.Fill;
Tüm sütunlar kullanılabilir alanı doldurur.
DisplayedCells Modu
dgv.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.DisplayedCells;
Görünen hücrelerin içeriğine göre sütun genişliği hesaplanır.
AllCells Modu
dgv.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.AllCells;
Tüm hücreleri analiz ederek boyutlandırma yapar.
| Mod | Performans | Kullanım Durumu |
|---|---|---|
| Fill | Yüksek | Genel kullanım |
| DisplayedCells | Orta | Dinamik içerikler |
| AllCells | Düşük | Küçük veri setleri |
Modern DataGridView Tasarımı
Modern kullanıcı arayüzlerinde kullanılan temel prensipler DataGridView için de geçerlidir.
- Yüksek okunabilirlik
- Minimal tasarım
- Doğru kontrast kullanımı
- Tutarlı renk paleti
- Dengeli boşluk kullanımı
- Profesyonel başlık tasarımı
Başlık Tasarımı
dgv.EnableHeadersVisualStyles = false; dgv.ColumnHeadersDefaultCellStyle.BackColor = Color.FromArgb(66,65,60); dgv.ColumnHeadersDefaultCellStyle.ForeColor = Color.White;
Başlık Yüksekliği
dgv.ColumnHeadersHeight = 40;
Çizgi Ayarları
dgv.CellBorderStyle = DataGridViewCellBorderStyle.SingleHorizontal;
Zebra Satır Tasarımı
dgv.AlternatingRowsDefaultCellStyle.BackColor = Color.FromArgb(75,75,70);
Alternatif satır renkleri uzun veri listelerinde okunabilirliği ciddi şekilde artırır.
DataGridView Koyu Tema Tasarımı
Koyu temalar son yıllarda masaüstü uygulamalarında oldukça popüler hale gelmiştir. Özellikle uzun süre ekran başında çalışan kullanıcılar için göz yorgunluğunu azaltabilir.
Koyu Tema Avantajları
- Daha modern görünüm sağlar.
- Göz yorgunluğunu azaltabilir.
- Kurumsal uygulamalarda profesyonel görünür.
- Yüksek kontrast sayesinde veri okunabilirliğini artırabilir.
Hazır DataGridView Stil Extension Sınıfı
Büyük projelerde her DataGridView için aynı görünüm ayarlarını tekrar tekrar yazmak yerine ortak bir extension sınıfı kullanmak çok daha verimli bir yöntemdir.
Aşağıdaki sınıf sayesinde tek satır kod ile tüm DataGridView kontrollerine profesyonel bir görünüm kazandırabilirsiniz.
using System.Drawing;
using System.Windows.Forms;
namespace Shared.Extensions
{
public static class DataGridViewExtensions
{
public static void ApplyDatagridviewStyle(this DataGridView dgv)
{
// Genel ayarlar
dgv.RowHeadersVisible = false;
dgv.BorderStyle = BorderStyle.None;
dgv.SelectionMode = DataGridViewSelectionMode.FullRowSelect;
dgv.ReadOnly = true;
dgv.AllowUserToAddRows = false;
dgv.AllowUserToDeleteRows = false;
dgv.AllowUserToResizeRows = false;
dgv.AllowUserToResizeColumns = false;
dgv.ScrollBars = ScrollBars.Both;
// Satır görünümü
dgv.RowTemplate.Height = 35;
dgv.DefaultCellStyle.BackColor =
Color.FromArgb(66, 65, 60);
dgv.DefaultCellStyle.ForeColor =
Color.White;
dgv.DefaultCellStyle.SelectionBackColor =
Color.DimGray;
dgv.DefaultCellStyle.SelectionForeColor =
Color.White;
dgv.DefaultCellStyle.Alignment =
DataGridViewContentAlignment.MiddleCenter;
dgv.AlternatingRowsDefaultCellStyle.BackColor =
Color.FromArgb(75, 75, 70);
dgv.CellBorderStyle =
DataGridViewCellBorderStyle.SingleHorizontal;
// Başlık görünümü
dgv.EnableHeadersVisualStyles = false;
dgv.ColumnHeadersBorderStyle =
DataGridViewHeaderBorderStyle.None;
dgv.ColumnHeadersDefaultCellStyle.BackColor =
Color.FromArgb(66, 65, 60);
dgv.ColumnHeadersDefaultCellStyle.ForeColor =
Color.White;
dgv.ColumnHeadersDefaultCellStyle.SelectionBackColor =
Color.FromArgb(66, 65, 60);
dgv.ColumnHeadersDefaultCellStyle.Alignment =
DataGridViewContentAlignment.MiddleCenter;
dgv.ColumnHeadersHeight = 40;
// Dinamik sütun genişliği
if (dgv.Columns.Count == 0)
return;
int columnCount = dgv.Columns.Count;
if (columnCount <= 5)
{
dgv.AutoSizeColumnsMode =
DataGridViewAutoSizeColumnsMode.Fill;
return;
}
if (columnCount >= 12)
{
dgv.AutoSizeColumnsMode =
DataGridViewAutoSizeColumnsMode.DisplayedCells;
return;
}
dgv.AutoSizeColumnsMode =
DataGridViewAutoSizeColumnsMode.DisplayedCells;
dgv.AutoResizeColumns();
int totalWidth = 0;
foreach (DataGridViewColumn col in dgv.Columns)
totalWidth += col.Width;
if (totalWidth < dgv.Width)
{
dgv.AutoSizeColumnsMode =
DataGridViewAutoSizeColumnsMode.Fill;
}
else
{
dgv.AutoSizeColumnsMode =
DataGridViewAutoSizeColumnsMode.None;
}
}
}
}
Kullanımı
Extension sınıfı eklendikten sonra aşağıdaki kod yeterlidir:
dataGridView1.ApplyDatagridviewStyle();
Bu yöntem sayesinde tüm DataGridView kontrollerinde aynı tasarım standardını koruyabilir ve kod tekrarını önemli ölçüde azaltabilirsiniz.
Performans İyileştirme Teknikleri
Veri miktarı arttıkça performans optimizasyonları daha önemli hale gelir.
VirtualMode Kullanımı
dgv.VirtualMode = true;
Çok büyük veri kümelerinde bellek kullanımını azaltabilir.
BindingSource Kullanımı
BindingSource source = new BindingSource(); source.DataSource = dataTable; dgv.DataSource = source;
AutoSize Kullanımına Dikkat Edin
Özellikle AllCells modu büyük veri setlerinde performansı düşürebilir.
Sayfalama Kullanın
On binlerce kaydı tek seferde göstermek yerine sayfalama yapmak daha sağlıklı sonuçlar verir.
Gereksiz Event Kullanmayın
Sürekli tetiklenen olaylar performans kaybına neden olabilir.
Yaygın Hatalar ve Çözümleri
Sütunlar Ekrana Sığmıyor
AutoSizeColumnsMode yanlış yapılandırılmış olabilir.
Grid Çok Yavaş Açılıyor
Gereğinden fazla veri yükleniyor olabilir.
Başlık Renkleri Değişmiyor
EnableHeadersVisualStyles özelliğinin false yapılması gerekir.
Seçim Renkleri Görünmüyor
SelectionBackColor ve SelectionForeColor ayarları kontrol edilmelidir.
DataGridView Tasarımında En İyi Uygulamalar
- Satır başlıklarını gizleyin.
- Alternatif satır renkleri kullanın.
- Kurumsal renk paleti belirleyin.
- Gereksiz çizgileri kaldırın.
- FullRowSelect kullanın.
- Extension sınıfı oluşturun.
- Performans testleri yapın.
Sık Sorulan Sorular
DataGridView satır yüksekliği nasıl değiştirilir?
RowTemplate.Height özelliği kullanılarak satır yüksekliği değiştirilebilir.
dgv.RowTemplate.Height = 40;
DataGridView sütun genişliği otomatik nasıl ayarlanır?
AutoSizeColumnsMode özelliği kullanılır.
dgv.AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.Fill;
DataGridView başlık rengi nasıl değiştirilir?
ColumnHeadersDefaultCellStyle üzerinden değiştirilebilir.
DataGridView performansı nasıl artırılır?
VirtualMode, sayfalama ve BindingSource kullanımı performansı artırabilir.
DataGridView modern görünüm nasıl elde edilir?
Başlık tasarımı, satır yükseklikleri, renk paleti ve alternatif satır renkleri kullanılarak modern görünüm elde edilir.
Yorum Yap