Merhaba,
Bugün sizlere nasıl kendi tarayıcınızı yapabileceğinizi anlatacağım.
Öncelikle belirtmeliyim ki yazılım bilginiz hiç yok ise mükemmel bir tarayıcı beklemeyin. Bu makalede tarayıcı alt yapısı kurmayı ve 1-2 detay ekleyeceğiz. (Arama motoru, ayarlar sekmesi ve benzeri.)
Gereken uygulamalar ve paketler şunlardır.
- Visual Studio 2019 16.10
- Visual Studio projemiz için NuGet paketi olan "CefSharp"
Önemli not:
Visual Studio ilk defa kuracaklar için, kurulum ekranlarından birinde karşınıza gelen dil ve proje yükleme kısmında "Masaüstü Uygulama Geliştirme (.NET Framework) seçmeniz gerekli. Daha sonrasında proje açarken Windows Forms (.NET Framework) projesini açın. (C# Dili olmasına dikkat edin.)
Proje > NuGet Paketlerini Yönet > Göz At Yolunu takip ettikten sonra arama kısmına "CefSharp" yazıp CefSharp. WinForms yüklüyoruz.
Peki bu NuGet paketi ne işe yarıyor?
Size tarayıcı sunuyor. Kendisine özel olan Tool'u kullanarak tarayıcınızı bağlayabiliyorsunuz.
Daha sonrasında Form1[Design].CS sekmesine gelip Araç Kutusu kısmından istediğiniz araçları ekleyerek ekranınızı özelleştirin.
Sırasıyla:
Label = Metin
TextBox = Yazı Kutusu
PictureBox = Resim Kutusu
MenuStrip = Özel Menü (Yeni başladıysanız çok karışık gelecektir, Kullanmamanızı tavsiye ederim. (Tabii tamamen sizin isteğinize bağlı.)
Button = Buton
Form ile ilgili ayarları sağda bulunan özellikler sekmesinden ayarlayabilirsiniz.
Aynı benim gibi yapabilirsiniz. NuGet paketini yüklediyseniz ChromiumWebBrowser'i Araç Kutusundan Form'a sürüklemeyi unutmayın! Yoksa tarayıcınız çalışmaz. ChromiumWebBrowser tarayıcınızın gözükeceği alandır.
Buton olarak (Geri tuşu, ileri tuşu, ayarlar sekmesi vb.) PictureBox kullanıyorum. Siz isterseniz Button kullanabilirsiniz.
Resimdeki gibi ayrıntılı bir şey yapmayacağız. Dediğim gibi internetten kısa bir şekilde araştırarak farklı Tool'lar ile özelleştirebilirsiniz.
Şimdi ayarlayacağımız şey uygulama başlatılınca bizi https:/www.google.com adresine yönlendirmesi. Siz farklı siteye yönlendirebilirsiniz tabii.
Form'a çift tıklıyoruz ve bizi "Form1_Load" olayının olduğu kod satırına atıyor. En üstte bulunan kütüphane kısmına
Using CefSharp;
Using CefSharp. WinForms;
Using CefSharp. Event;
Using CefSharp. JavascriptBinding;
Using CefSharp. Web;
Using CefSharp. WinForms. Internals;
Kodlarını ekleyin.
Daha sonrasında Form1_Load olayının içine şu kodları yapıştırın:
Browser = New CefSharp. WinForms. ChromiumWebBrowser("https:/www.google.com")
{
Dock = DockStyle. Fill,
Size = New Size(949, 569),
Location = New Point(200, 200),
};
This. Panel1.Controls. Add(browser);
En sonunda ise hiçbir yere bağlı olmayan public alana şu kodu yapıştırın.
Public CefSharp. WinForms. ChromiumWebBrowser browser;
En sonunda şu şekilde bir görünüm alacaktır:
Hepsini doğru yaptığınızdan eminseniz,
Uygulamayı başlatın. Başlattığınızda 1 - 2 dakika bekleyince tarayıcı açılacaktır. (Visual Studio içinde başlattığınız için ve ilk başlatışınız olduğu için aynı Google gibi başta kasması doğaldır. Sonrasında 2 - 3 saniyelere düşecektir süre.)
Eğer hatanız yok ise detaylara geçelim. Hata alıyorsanız SS'ler ile buraya bildirin
Yapacağımız şey TextBox'a yazılan şey Enter basılınca aratılsın.
Bunun için TextBox eklemeyi unutmayın.
TextBox1 events sekmesine gelin. (Özellikler kısımlarında yıldırım işaretli.)
Bende neden MetroTextBox diye soracak olursanız ayrı bir görünüm paketi kullanıyorum. İleride değineceğim.
O kısma tıklayınca önümüzü bu şekilde bir ekran karşılayacaktır:
"KeyDown" çift tıklayarak kod satırlarına geçiş yapın. Daha sonrasında bu kodları yapıştırın.
İf (e. KeyCode == Keys. Enter)
{
Browser = New CefSharp. WinForms. ChromiumWebBrowser(metroTextBox1.Text)
{
Dock = DockStyle. Fill,
Size = New Size(949, 569),
Location = New Point(200, 200),
};
chromiumWebBrowser1.Controls.Clear();
ChromiumWebBrowser1.Controls. Add(browser);
}
Burada Enter tuşuna basılınca neler yapılacağını belirledik.
Önemli Not: Parantez içindeki "metroTextBox1.Text" kısmını normal TextBox kullanıyorsanız "TextBox1.Text" olarak değiştirin.
Daha sonrasında Form yüklenince TextBox'a youtube.com tarzı bir link girip test edin. Çalışmaması zor ancak yine de sorun çıkarsa kesinlikle bana bildirin.
Şimdi Ayarlar sekmesini yapacağız. Ayarları yapmayacağız sadece sekmeyi yapacağız çünkü içeriğini yaparsak makale aşırı derecede uzar konudan sapar. Proje > Form Ekle (Windows Forms)... Tıklayın ve Form ekleyin. Peki nasıl yeni Form'a geçeceğiz? Şu alandaki 3 bar Icon'u ile.
Bu pictureBox ile yapıldı. İnternetten 5 dakikalık araştırma ile pictureBox uzmanı olmanız mümkün zaten. Şimdi PictureBox'a çift tıklıyoruz ve gelen kod satırına şu kodları giriyoruz.
Ayarlar ayar = New Ayarlar();
ayar.Show();
Unutmayın! Buradaki "Ayarlar" 2. Formumun ismi. Sizde Form2 şeklinde ise "Ayarlar" yerine "Form2" yazın!
Bu sayede Ayarlar sekmesini açacaktır. Ayarlar sekmesi açılınca Tarayıcı sekmesi kapansın istiyorsanız:
this.Hide();
Komutunu ekleyebilirsiniz.
Şimdi Formlarımın tasarım SS'leri:
Tarayıcı yapmak bu kadar basit. Geri tuşu - İleri tuşu için ise:
Geri tuşu pictureBox kodlarına
browser.Back();
İleri tuşu pictureBox kodlarına
browser.Forward();
Yazabilirsiniz. İleride daha detaylı makaleler yazacağım. Umarım faydam dokunmuştur
Bugün sizlere nasıl kendi tarayıcınızı yapabileceğinizi anlatacağım.
Öncelikle belirtmeliyim ki yazılım bilginiz hiç yok ise mükemmel bir tarayıcı beklemeyin. Bu makalede tarayıcı alt yapısı kurmayı ve 1-2 detay ekleyeceğiz. (Arama motoru, ayarlar sekmesi ve benzeri.)
Gereken uygulamalar ve paketler şunlardır.
- Visual Studio 2019 16.10
- Visual Studio projemiz için NuGet paketi olan "CefSharp"
Önemli not:
Visual Studio ilk defa kuracaklar için, kurulum ekranlarından birinde karşınıza gelen dil ve proje yükleme kısmında "Masaüstü Uygulama Geliştirme (.NET Framework) seçmeniz gerekli. Daha sonrasında proje açarken Windows Forms (.NET Framework) projesini açın. (C# Dili olmasına dikkat edin.)
Proje > NuGet Paketlerini Yönet > Göz At Yolunu takip ettikten sonra arama kısmına "CefSharp" yazıp CefSharp. WinForms yüklüyoruz.
Peki bu NuGet paketi ne işe yarıyor?
Size tarayıcı sunuyor. Kendisine özel olan Tool'u kullanarak tarayıcınızı bağlayabiliyorsunuz.
Daha sonrasında Form1[Design].CS sekmesine gelip Araç Kutusu kısmından istediğiniz araçları ekleyerek ekranınızı özelleştirin.
Sırasıyla:
Label = Metin
TextBox = Yazı Kutusu
PictureBox = Resim Kutusu
MenuStrip = Özel Menü (Yeni başladıysanız çok karışık gelecektir, Kullanmamanızı tavsiye ederim. (Tabii tamamen sizin isteğinize bağlı.)
Button = Buton
Form ile ilgili ayarları sağda bulunan özellikler sekmesinden ayarlayabilirsiniz.
Aynı benim gibi yapabilirsiniz. NuGet paketini yüklediyseniz ChromiumWebBrowser'i Araç Kutusundan Form'a sürüklemeyi unutmayın! Yoksa tarayıcınız çalışmaz. ChromiumWebBrowser tarayıcınızın gözükeceği alandır.
Buton olarak (Geri tuşu, ileri tuşu, ayarlar sekmesi vb.) PictureBox kullanıyorum. Siz isterseniz Button kullanabilirsiniz.
Resimdeki gibi ayrıntılı bir şey yapmayacağız. Dediğim gibi internetten kısa bir şekilde araştırarak farklı Tool'lar ile özelleştirebilirsiniz.
Şimdi ayarlayacağımız şey uygulama başlatılınca bizi https:/www.google.com adresine yönlendirmesi. Siz farklı siteye yönlendirebilirsiniz tabii.
Form'a çift tıklıyoruz ve bizi "Form1_Load" olayının olduğu kod satırına atıyor. En üstte bulunan kütüphane kısmına
Using CefSharp;
Using CefSharp. WinForms;
Using CefSharp. Event;
Using CefSharp. JavascriptBinding;
Using CefSharp. Web;
Using CefSharp. WinForms. Internals;
Kodlarını ekleyin.
Daha sonrasında Form1_Load olayının içine şu kodları yapıştırın:
Browser = New CefSharp. WinForms. ChromiumWebBrowser("https:/www.google.com")
{
Dock = DockStyle. Fill,
Size = New Size(949, 569),
Location = New Point(200, 200),
};
This. Panel1.Controls. Add(browser);
En sonunda ise hiçbir yere bağlı olmayan public alana şu kodu yapıştırın.
Public CefSharp. WinForms. ChromiumWebBrowser browser;
En sonunda şu şekilde bir görünüm alacaktır:
Hepsini doğru yaptığınızdan eminseniz,
Uygulamayı başlatın. Başlattığınızda 1 - 2 dakika bekleyince tarayıcı açılacaktır. (Visual Studio içinde başlattığınız için ve ilk başlatışınız olduğu için aynı Google gibi başta kasması doğaldır. Sonrasında 2 - 3 saniyelere düşecektir süre.)
Eğer hatanız yok ise detaylara geçelim. Hata alıyorsanız SS'ler ile buraya bildirin
Yapacağımız şey TextBox'a yazılan şey Enter basılınca aratılsın.
Bunun için TextBox eklemeyi unutmayın.
TextBox1 events sekmesine gelin. (Özellikler kısımlarında yıldırım işaretli.)
Bende neden MetroTextBox diye soracak olursanız ayrı bir görünüm paketi kullanıyorum. İleride değineceğim.
O kısma tıklayınca önümüzü bu şekilde bir ekran karşılayacaktır:
"KeyDown" çift tıklayarak kod satırlarına geçiş yapın. Daha sonrasında bu kodları yapıştırın.
İf (e. KeyCode == Keys. Enter)
{
Browser = New CefSharp. WinForms. ChromiumWebBrowser(metroTextBox1.Text)
{
Dock = DockStyle. Fill,
Size = New Size(949, 569),
Location = New Point(200, 200),
};
chromiumWebBrowser1.Controls.Clear();
ChromiumWebBrowser1.Controls. Add(browser);
}
Burada Enter tuşuna basılınca neler yapılacağını belirledik.
Önemli Not: Parantez içindeki "metroTextBox1.Text" kısmını normal TextBox kullanıyorsanız "TextBox1.Text" olarak değiştirin.
Daha sonrasında Form yüklenince TextBox'a youtube.com tarzı bir link girip test edin. Çalışmaması zor ancak yine de sorun çıkarsa kesinlikle bana bildirin.
Şimdi Ayarlar sekmesini yapacağız. Ayarları yapmayacağız sadece sekmeyi yapacağız çünkü içeriğini yaparsak makale aşırı derecede uzar konudan sapar. Proje > Form Ekle (Windows Forms)... Tıklayın ve Form ekleyin. Peki nasıl yeni Form'a geçeceğiz? Şu alandaki 3 bar Icon'u ile.
Bu pictureBox ile yapıldı. İnternetten 5 dakikalık araştırma ile pictureBox uzmanı olmanız mümkün zaten. Şimdi PictureBox'a çift tıklıyoruz ve gelen kod satırına şu kodları giriyoruz.
Ayarlar ayar = New Ayarlar();
ayar.Show();
Unutmayın! Buradaki "Ayarlar" 2. Formumun ismi. Sizde Form2 şeklinde ise "Ayarlar" yerine "Form2" yazın!
Bu sayede Ayarlar sekmesini açacaktır. Ayarlar sekmesi açılınca Tarayıcı sekmesi kapansın istiyorsanız:
this.Hide();
Komutunu ekleyebilirsiniz.
Şimdi Formlarımın tasarım SS'leri:
Tarayıcı yapmak bu kadar basit. Geri tuşu - İleri tuşu için ise:
Geri tuşu pictureBox kodlarına
browser.Back();
İleri tuşu pictureBox kodlarına
browser.Forward();
Yazabilirsiniz. İleride daha detaylı makaleler yazacağım. Umarım faydam dokunmuştur