1. Web View Elementine Genel Bakış

Web View elementi, uygulama içerisinde harici veya dahili web içeriklerinin doğrudan görüntülenmesini sağlayan bir UI elementidir.  Kullanıcılar, uygulamadan ayrılmadan web sayfalarını görüntüleyebilir, içerikleri inceleyebilir veya web tabanlı formlarla etkileşime geçebilir.

Web View elementi hem web hem de mobil uygulamalarda desteklenmektedir.

1.1. Sık Kullanım Senaryoları

• Harici web sayfalarını uygulama içinde göstermek
• Sözleşme, gizlilik politikası veya yardım sayfaları
• Web tabanlı formlar ve anketler
• Dinamik rapor veya dashboard içerikleri
• Uygulama içine gömülü bilgi ve dokümantasyon sayfaları

2. Temel Özellikler

• Web içeriğini uygulama içinde görüntüleme: Harici veya dahili URL’ler üzerinden web sayfaları doğrudan uygulama ekranında gösterilir.
• Dinamik URL desteği: Görüntülenecek web içeriği statik olarak tanımlanabilir veya state, değişken ya da aksiyon çıktıları üzerinden dinamik olarak bağlanabilir.

2.1. Web View Elementi Özellikleri

Web View elementinin özelliklerini, sağ kenardaki Properties panelinden yapılandırabilirsiniz.

• URL: Görüntülenecek web sayfasının URL adresini statik olarak girebilir veya Symbol Picker kullanarak dinamik bir değer atayabilirsiniz.

Web View elementi, kullanıcıların uygulama içinden dış bağlantılara erişmesine olanak tanıyarak kullanıcı deneyimini geliştirir.

2.2. Elemente Eklenebilen Aksiyonlar

Web View elementi, doğrudan aksiyon (Add Action) eklemeyi desteklemez. Element üzerinde onClick, onChange veya benzeri event’ler bulunmaz ve sağ Properties panelinde aksiyon tetikleyicisi yer almaz.

Web View, yalnızca web içeriğini görüntülemek amacıyla kullanılır. Herhangi bir işlem, yönlendirme veya etkileşim gerektiren aksiyonlar Web View içeriğinin kendi yapısı veya uygulamadaki diğer UI elementleri üzerinden yönetilmelidir.

3. Web View Elementi Nasıl Kullanılır? 

Bu bölümde Web View elementinin uçtan uca kullanımını örnek senaryo üzerinden ele alacağız.

Senaryo: Web View Kullanımı

Web View elementi, harici bir web sitesinin uygulama içerisinde görüntülenmesini sağlar. Bu senaryoda kullanıcı, uygulama içerisinden çıkmadan belirli bir web sayfasını görüntüleyebilir.

Örneğin, kullanıcıya eğitim dokümanlarını göstermek için Web View içerisine bir URL tanımlanır. Sayfa yüklendiğinde ilgili web sitesi doğrudan uygulama içerisinde açılır ve kullanıcı içerikleri buradan inceleyebilir.

Adım 1 - Web View Elementini Ekleme

Başlangıçta anasayfada: 

• Sol yan panelden Elements > Special > WebView elementini sayfaya sürükleyip bırakın.
  

• Gösterilecek Url bilgisini WebView > Properties > Url > “https://example.com” şeklinde tanımlayınız.
  

‍Preview:

Web View elementi ile harici web siteleri uygulama içerisinde görüntülenebilir ve kullanıcılar uygulamadan çıkmadan ilgili içeriklere erişebilir.

4. Ortak Özellikler (Properties)

Web View elementi üzerinde yer alan bazı alanlar tüm UI elementlerinde ortak olarak kullanılır. Bu nedenle, aşağıdaki özelliklerin detaylı açıklamaları ilgili genel kılavuz sayfalarında yer almaktadır:

• Authorization (Yetkilendirme) Ayarları
• Visibility (Görünürlük)
• Editability (Düzenlenebilirlik)
• Style Panel (Stil Ayarları)

5. Kullanım Tavsiyeleri (Best Practices)

• Güvenilir URL’ler kullanın. Web View içinde yalnızca güvenli ve doğrulanmış web içeriklerini görüntüleyin.
• Dinamik URL kullanımını kontrollü yapın. State veya aksiyon çıktılarıyla oluşturulan URL’lerin doğruluğunu kontrol edin.
• Mobil uyumluluğu test edin. Görüntülenecek web içeriğinin mobil ekranlara uygun olduğundan emin olun.
• Kullanıcıyı yönlendiren metinler ekleyin. Web View içeriğinin ne amaçla gösterildiğini açıklayan kısa bilgilendirmeler kullanıcı deneyimini iyileştirir.

6. Kısıtlamalar

• Web View elementi doğrudan aksiyon tetikleyemez.
• Bazı web siteleri güvenlik politikaları (örn. iframe kısıtları) nedeniyle görüntülenemeyebilir.