• Buradasın

    Kullanıcı Arayüzü Geliştirme Eğitimi: Web Tarayıcısı Tasarımı

    youtube.com/watch?v=6bNKgrLAqv0

    Yapay zekadan makale özeti

    • Bu video, bir eğitmen tarafından sunulan yazılım geliştirme eğitimidir. Eğitmen, izleyicilere adım adım bir web tarayıcısı tasarımı göstermektedir.
    • Video, web tarayıcısı uygulamasının temel bileşenlerinin nasıl oluşturulacağını ve fonksiyonlarının nasıl programlanacağını detaylı olarak ele almaktadır. Eğitim, menüler, adres çubuğu, butonlar ve panel düzenlemeleri gibi temel bileşenlerin eklenmesiyle başlayıp, sekme sistemi, geri/ileri navigasyon, yenileme ve anasayfa fonksiyonlarının programlanmasıyla devam etmektedir. Ayrıca, otomatik tamamlama özelliği, geçmiş siteleri kaydetme ve Google arama motoru entegrasyonu gibi ileri düzey özellikler de gösterilmektedir.
    • Eğitim boyunca, web sayfalarından veri çekme teknikleri, HTML yapılarını kullanarak elementleri alma, resimleri bulma ve form elemanlarına değer ekleme gibi pratik uygulamalar da sunulmaktadır. Eğitmen, yapay zekada sınıflandırma modelleri oluşturmak için veri toplama ve kendi tarayıcınızı oluşturmak gibi uygulamaları da göstermektedir.
    00:07Web Tarayıcı Tasarımı
    • Web tarayıcısı tasarımı için önce adres çubuğu, menüler ve diğer bileşenler eklenecek.
    • Menü stipp eklenerek "Dosya" ve "Düzen" gibi seçenekler oluşturulabilir.
    • Dosya menüsünde "Yeni sekme aç", "Geçmişi görüntüle" ve "Programdan çık" gibi seçenekler bulunabilir.
    01:30Dinamik Tasarım
    • Dinamik bir tasarlama için üst ve alt panel oluşturulabilir.
    • Otomatik tamamlama özelliği için combobox kullanılabilir.
    • Git butonu, yeni sekme aç butonu (artı işareti ile gösterilebilir) ve geri, ileri tuşları eklenir.
    04:42Ek Butonlar ve Özellikler
    • Yenile butonu için et işareti kullanılabilir.
    • Home tuşu eklenerek ana sayfaya dönme özelliği sağlanabilir.
    • Top kontrolü kullanılarak sekme seçeneği eklenebilir.
    07:49Web Browser Bileşeni
    • Web browser bileşeni form tasarımcısında bulunmayabilir, bu durum sürüme göre değişebilir.
    • Bileşenleri eklemek için araç kutusunda "Öğeleri Seç" seçeneği kullanılabilir.
    • Form uygulamasında kullanılmayan bileşenler dışarıdan import edilebilir.
    11:23Form Düzenlemesi
    • Form ismi "Web Browser" veya "Browser" olarak değiştirilebilir.
    • Web browser nesnesi eklenerek form tasarımı tamamlanır.
    11:52Web Tarayıcısı ile Site Açma
    • Web tarayıcısı, program açıldığında "home" elemanıyla başlar.
    • Web tarayıcısı, "navigate" (yönlendirme) fonksiyonuyla string olarak bir URL ister.
    • Combobox'ta yazılan adres, web tarayıcısına doğrudan yönlendirilir.
    13:02Geri ve İleri Geçiş Fonksiyonları
    • "GoBack" fonksiyonu, bir önceki ziyaret edilen sayfaya geri dönmeyi sağlar.
    • "CanGoBack" fonksiyonu, geçmişte bir adres olup olmadığını kontrol eder ve true/false döndürür.
    • "GoForward" fonksiyonu, geri alınmış bir sayfaya ileri gitmeyi sağlar.
    14:40Anasayfa ve Yenileme İşlemleri
    • "GoHome" fonksiyonu, Microsoft Edge, Explorer gibi tarayıcıların anasayfasına gitmeyi sağlar.
    • "Refresh" fonksiyonu, sayfayı yenileme işlemini gerçekleştirir.
    • Dışarıdan erişim sağlayan uygulamalar, güvenlik nedeniyle JavaScript dosyalarıyla ilgili bilgilendirmeler sunar.
    16:49Yeni Sekme Ekleme
    • Yeni sekme ekleme için "AddTab" fonksiyonu oluşturulabilir.
    • Yeni sekme için "TabPage" oluşturup "Text" özelliği "Yeni Sekme" olarak ayarlanır.
    • Top kontrolüne yeni sekme eklenir ve dinamik olarak "WebBrowser" nesnesi oluşturulur.
    19:42WebBrowser Nesnesinin Özellikleri
    • WebBrowser nesnesi, "Navigate" fonksiyonuyla belirli bir URL'ye yönlendirilir.
    • "Dock" özelliği, nesnenin yerleşim şeklini belirler (Fill, Top, Left, Bottom, Right).
    • Oluşturulan WebBrowser nesnesi, TopPage kontrolünün "Controls" koleksiyonuna eklenir.
    22:35Script Hatasını Kapatma
    • Browser kontrollerinde script error suppress özelliğini false'dan true'a çevirerek script hatalarını gizleyebilirsiniz.
    • Bu işlem sonrasında uygulama herhangi bir hata vermeden doğrudan açma işlemini gerçekleştirebilir.
    23:50Yeni Sekme Oluşturma ve Aktifleştirme
    • Yeni sekme oluşturmak için gerekli kodu yazarak yeni sekme açabilirsiniz.
    • Yeni sekme oluşturulduğunda, seçili sekme özelliği kullanılarak yeni sekme otomatik olarak aktif hale getirilebilir.
    • Her yeni sekme oluşturulduğunda en sonuncusu aktif olarak görüntülenir.
    25:13Sekme Silme İşlemi
    • Sekme silme işlemi için sağ tık menüsüne "kapat" seçeneği eklenebilir.
    • Seçili sekme bulunmak için "top page" özelliği kullanılır ve seçili sekme silinir.
    • Sekme silme işlemi için "top control" içinde "clear" fonksiyonu kullanılır.
    27:54Geçmiş Kaydetme ve Otomatik Tamamlama
    • Web browserların "document complete" özelliği, sayfa tam olarak yüklendikten sonra işlemlerin yapılmasını sağlar.
    • Geçmiş kaydetmek için combobox'a web browser'un url'si eklenebilir.
    • Otomatik tamamlama için combobox'un "auto complete collection" özelliği kullanılabilir, ancak dezavantajları vardır.
    31:49Otomatik Tamamlama ve Kaynak Oluşturma
    • İnternet Explorer ve Edge üzerinden ziyaret edilen sitelerin geçmişinden otomatik tamamlama yapılabilir.
    • Custom source seçeneği ile kendi gittiği siteler içerisinde otomatik tamamlama işlemi gerçekleştirilebilir.
    • Combobox özelliğinin auto complete özelliğini kullanarak web browser'dan alınan URL'leri custom source'a ekleyebilirsiniz.
    34:00Otomatik Tamamlama Kullanımı
    • Otomatik tamamlama özelliği ile önceki ziyaret edilen siteler önerisi sunulabilir.
    • Combobox'ta çift tıklandığında seçilen URL'ye web browser'un navigate özelliği ile gidilebilir.
    • Bu yapı sayesinde tek bir tane URL eklenir ve daha düzgün bir kullanım sağlanır.
    36:06Google Arama Motoru Entegrasyonu
    • Kendi Google motorunu kullanarak arama yapılabilir veya kendi arama motoru oluşturulabilir.
    • Yandex gibi uygulamalar, kullanıcıların yaptığı her aramada para kazanabilir.
    • Google arama motorunun URL yapısı kullanılarak dinamik arama yapılabilir.
    38:28Dinamik Arama İşlemi
    • Google arama motorunun URL yapısına parametre olarak aranacak kelime eklenebilir.
    • TextBox'tan alınan metin ile Google araması yapılabilir.
    • Kendi sitenize Google'ın arama motorunu entegre ederek, kullanıcıların yaptığı aramalar üzerinden para kazanma imkanı sunabilirsiniz.
    41:25Web Tarayıcı Kullanımı ve HTML Erişimi
    • Bilgisayarcılar için en sık kullanılan araçlardan biri web tarayıcıdır ve HTML dokümanları body, header gibi yapıları içerir.
    • Get element by id veya get element by tag name gibi fonksiyonlar kullanılarak HTML tagları aranabilir, sadece div'leri, a'ları veya body'yi almak gibi işlemler yapılabilir.
    • Body üzerinden dökümanın HTML kodlarına erişilebilir ve bu kodlar mesaj penceresinde görüntülenebilir.
    42:58Web İçeriği İşleme
    • HTML içeriğindeki resimler, videolar veya diğer öğeler kolayca bulunabilir ve indirme işlemleri gerçekleştirilebilir.
    • Botlar yazarak form elemanlarına değer ekleme işlemleri yapılabilir veya yapay zekada sınıflama modelleri için veri toplama yapılabilir.
    • JavaScript bilenler için id veya class'a göre işlem yaptırma işlemleri kolayca gerçekleştirilebilir.
    45:13Özel Tarayıcı Oluşturma
    • Arama motorundan alınan adresler kopyalanıp değiştirilerek kendi tarayıcınız oluşturulabilir.
    • Get ve post metodları kullanılarak değer gönderme ve kaydetme işlemleri yapılabilir, bu teknik Arduino'da da kullanılır.
    • Microsoft tabanlı çalışan bu tarayıcı dışında, Firefox veya Google Chrome tabanlı tarayıcılar için gerekli pilleri yükleyerek kendi tarayıcınızı oluşturabilirsiniz.

    Yanıtı değerlendir

  • Yazeka sinir ağı makaleleri veya videoları özetliyor