Qt'de SVG: Görüntüleyiciyi seçin, dosyayı kontrol edin

Qt Widgets uygulamasında SVG kullanırken bir çizimi göstermek istiyorsanız QSvgWidget ile başlayın. Çizimi seçtiğiniz bir hedefe çizdirmeniz gerekiyorsa QSvgRenderer kullanın. Bu ayrım önemlidir: sabit boyutlu bir QImage içine bir kez çizdirdiğinizde göstereceğiniz şey pikseller olur; SVG'yi sakladığınızda ise başka bir boyut için yeniden görüntü oluşturabilirsiniz. Qt'nin SVG görüntüleme rehberi her iki yolu da açıklar.

Önce yolu seçin, ardından grafiği kontrol edin. Tarayıcı önizlemesi amaçladığınız tasarımı gösterebilir, ancak dosyanın kullandığı her özelliği Qt'nin desteklediğini kanıtlayamaz.

SVG'yi düzenlemeden önce görüntüleme yolunu seçin

Qt, QSvgWidget öğesini bir SVG görüntüleme widget'ı olarak belgeler ve görüntüleyicisine renderer() üzerinden erişim sağlar. Widget SvgWidgets modülüne aittir; CMake bağımlılığı Qt6::SvgWidgets değeridir. Burada sınıf başvurusu, yalnızca genel SVG modülünü ekleyen eski bir örnekten daha yararlıdır.

SVG göstermek, bir illüstrasyon düzenleyicisi oluşturmaz. Birinin yaprağı taşıması, köşesini yeniden şekillendirmesi veya ayrı bir ayrıntının rengini değiştirmesi gerekecekse ayrı bir kaynak ana dosyası saklayın.

Tam illüstrasyondan önce küçük bir kaynak deneyin

Bu özgün çizimi leaf.svg olarak kaydedin. Dolgulu bir yaprak, açık renkli bir damar ve ayrı bir mercan renkli daire kullanır:

<svg xmlns="http://www.w3.org/2000/svg" width="160" height="100" viewBox="0 0 160 100">
  <path d="M24 78C20 34 56 18 98 26C90 62 58 86 24 78Z" fill="#176b64"/>
  <path d="M28 74L78 38" fill="none" stroke="#fff6e8" stroke-width="5"/>
  <circle cx="126" cy="26" r="10" fill="#ec785e"/>
</svg>

Geniş tuval bilinçli bir tercihtir. Yaprak uzun ve dar hale gelirse eğrilerini düzenlemeden önce en-boy oranının nasıl ele alındığını araştırın. Daire kaybolursa görünür sınırları kontrol edin ve yüklenen dosyayı kaynakla karşılaştırın. Bu küçük örnek, kırpmaya veya efektlere dayanmadan kolayca tanıyabileceğiniz ayrıntılar sunar.

Dosyanın kendisi hakkında bilgi için SVG biçimi rehberi, vektör şekilleri ile bitmap içeren bir SVG kapsayıcısı arasındaki farkı açıklar.

Asgari bir Qt 6 Widgets örneği

main.cpp dosyasını oluşturun:

#include <QApplication>
#include <QSvgRenderer>
#include <QSvgWidget>
 
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    if (argc != 2)
        return 1;
 
    QSvgWidget view;
    view.load(QString::fromLocal8Bit(argv[1]));
    if (!view.renderer()->isValid())
        return 2;
 
    view.renderer()->setAspectRatioMode(Qt::KeepAspectRatio);
    view.resize(400, 240);
    view.show();
    return app.exec();
}

SVG dosya adını programın argümanı olarak verin; deneme sırasında tercihen mutlak bir yol kullanın. Çıkış kodu 1, bu örneğe tek bir dosya adı verilmediğini; 2 ise görüntüleyicinin geçerli bir belge bildirmediğini belirtir. Bu kodlar, bu örnekte seçilmiş değerlerdir; Qt'nin kendi hata kodu API'si değildir.

isValid(), yüklenen belgeyi kontrol eder. Görsel onay testi değildir. Açıkça belirtilen KeepAspectRatio ayarı, görüntüleyiciden oranları korumasını ister; QSvgRenderer başvurusu, geçerlilik kontrolünü ve en-boy oranı modlarını belgeler.

Kaynağın yanında şu CMakeLists.txt dosyasını kullanın:

cmake_minimum_required(VERSION 3.16)
project(LeafPreview LANGUAGES CXX)
set(CMAKE_CXX_STANDARD 17)
set(CMAKE_CXX_STANDARD_REQUIRED ON)
 
find_package(Qt6 REQUIRED COMPONENTS Widgets Svg SvgWidgets)
add_executable(leaf_preview main.cpp)
target_link_libraries(leaf_preview PRIVATE Qt6::Widgets Qt6::Svg Qt6::SvgWidgets)

Örnek, uygulama için Widgets, görüntüleme widget'ı için SvgWidgets ve görüntüleyici çağrıları için Svg ile bağlantı kurar. Qt, görüntüleyicinin Svg bileşenini SvgWidgets bileşeninden ayrı olarak listeler.

Yüklü Qt 6 geliştirme kitinizle yapılandırıp derleyin, ardından leaf_preview programını leaf.svg yolu ile çalıştırın. Bu, belgelere dayanan bir kaynak kod örneğidir; yerel bir Qt ortamında derlemedik veya çalıştırmadık. Kullanmaya başlamadan önce gerçek derlemeyi ve grafiği hedef sisteminizde deneyin.

Tarayıcıyla aynı desteği varsaymak yerine güncel desteği kontrol edin

Modern Qt SVG yalnızca statik SVG Tiny özellikleriyle sınırlı değildir. Qt, Qt 6.7'den itibaren varsayılan olarak ayrıştırılan ek öğeleri ve ayrıştırmayı Tiny özellikleriyle sınırlama seçeneğini belgeler. Genişletilmiş özellikler başvurusu, desteklenen ek özellikleri ve sınırlarını listeler.

Somut bir sınır clipPath özelliğidir: aynı sayfa bunun desteklenmediğini belirtir. Bu yüzden kırpmaya dayanan bir dosya, tarayıcıda doğru görünse bile kaynak incelemesi gerektirir. Belirli maskeler ve filtreler için destek belgelenmiştir, ancak bu her efektin veya dışa aktarım ayarının desteklendiği anlamına gelmez.

Basit yaprak çalışıyor ancak daha büyük bir illüstrasyon farklı görünüyorsa bir kopya oluşturun ve şüpheli özellikleri tek tek kaldırın. Kırpılmış grafiklerde, kırpma işlemine bağımlı kalmak yerine amaçlanan görünür geometriyi bir düzenleyicide oluşturmayı değerlendirin. Ana dosyanızı değiştirmeden önce ortaya çıkan silueti özgün dosyayla karşılaştırın.

Metin ayrı bir kontrol gerektirir. Yazı değişiyorsa SVG yazı tipi sorun giderme rehberini izleyin. Yazıyı şekillere dönüştürmek tasarım açısından bir ödünleşimdir; yanlış dosya adı veya eksik modül için ilk çözüm olmamalıdır.

İş akışınızın SVG'yi ne zaman piksellere dönüştürdüğünü fark edin

Kodunuzun yaprağı bir kez küçük bir QImage içine çizdirdiğini, bu görüntüden bir pixmap oluşturduğunu ve daha sonra pixmap'i büyüttüğünü düşünün. Büyütme, raster sonuç üzerinde yapılır. SVG kaynağı ortadan kalkmamıştır, ancak sonraki görüntüleme işlemi artık kaynaktan yeni bir görüntü oluşturmasını istemiyordur.

Qt'nin SVG görüntüleme rehberi, bir görüntüye çizdirme ile bir widget’ın çizim olayında çizdirme arasında ayrım yapar. Gösterim boyutunuz değişiyorsa SVG’nin nerede yeniden çizdirileceğine karar verin. Önbelleğe alınmış bir bitmap'i, kaynağın kendisinin ölçeklenemediğinin kanıtı olarak değerlendirmeyin.

Aynı ayrım, bir SVG simge seti hazırlarken de önemlidir. Kaynak sınırlarını tutarlı tutun, ardından her simgeyi gerçek kullanım boyutunda değerlendirin. Büyük boyutta tanınabilir olan bir yaprak, küçük gösterimde damarını veya ayrı dairesini yine de kaybedebilir.

Her şeyi sadeleştirmeden önce sonucu inceleyin

Benzer adlı başka bir dışa aktarım yerine gerçekten yüklediğiniz dosyayla başlayın. Basit örneğin göründüğünü doğrulayın, ardından üretimde kullanılacak grafiği hedef boyutta ve yeniden boyutlandırdıktan sonra karşılaştırın.

Yaprakta dairenin ayrı kaldığını, damarın görünür olduğunu ve geniş tuvalin çizimi esnetmediğini kontrol edin. Bunlar sizin çalıştırmanız için kabul kontrolleridir; bizim çalıştırmamızdan bildirdiğimiz sonuçlar değildir. Görünüm bütünüyle boşsa boş SVG kontrol listesi, görünmeyen grafikleri ve çizim sınırlarını uygulama kurulumundan ayırmanıza yardımcı olur.

Tasarıma uygunsa fotoğrafları veya dokulu illüstrasyonları raster varlıklar olarak koruyun. SVG seçmek bir grafik ihtiyacını karşılamalıdır; tek başına daha küçük dosyalar, daha hızlı görüntü oluşturma veya farklı motorlarda aynı çıktı sağlayacağını göstermez.

Yalnızca raster kaldığında bir kaynak ana dosyası oluşturun

Simge yalnızca PNG veya JPG olarak kaldıysa PerfectVector'ın görüntüden vektöre dönüştürme iş akışı, Qt'ye aktarmadan önce düzenlenebilir SVG grafiği hazırlamanıza yardımcı olabilir. Dönüşümden sonra silueti, boşlukları ve ayrı ayrıntıları inceleyin, ardından SVG'yi seçtiğiniz Qt yolunda deneyin. Vektörleştirme geometri hazırlar; görüntüleyiciye özellik eklemez veya görüntüleme widget'ını yol düzenleyicisine dönüştürmez.

Zaten temiz bir vektör ana dosyanız varsa doğrudan onu düzenleyin. Yalnızca belirli bir özellik veya küçük boyuttaki bir ayrıntı müdahale gerektiriyorsa bir kopyayı sadeleştirin ve gelecekteki düzenlemeler için daha zengin kaynağı saklayın.

Sık sorulan sorular

QSvgWidget mı, QSvgRenderer mı kullanmalıyım? Widgets arayüzünde SVG göstermek için QSvgWidget kullanın. Özel bir widget veya görüntü gibi seçilmiş bir hedefe çizdirme üzerinde denetim gerektiğinde QSvgRenderer kullanın.

Güncel Qt yalnızca SVG Tiny'yi mi destekliyor? Qt, statik SVG Tiny desteğini ve Qt 6.7'de eklenen belirli genişletmeleri belgeler. Yalnızca Tiny desteğini veya tarayıcıyla aynı desteği varsaymak yerine güncel özellik başvurusunu ve yapılandırılmış seçeneklerinizi kontrol edin.

SVG'yi bir pixmap'e koyduktan sonra neden bulanık görünebilir? Önce sabit boyutlu bir raster görüntüye çizdirdiyseniz sonucu büyütmek pikselleri ölçekler. Görüntü oluşturma hedefini ve SVG’nin gereken boyutta yeniden çizdirilip çizdirilmediğini gözden geçirin.

SVG'nin geçerli olarak yüklenmesi her ayrıntının doğru görüntülendiğini kanıtlar mı? Hayır. Geçerlilik kontrolü, görsel incelemenin yerini tutmaz. Gerçek hedef uygulamada sınırları, oranları, küçük ayrıntıları ve desteklenen özellikleri karşılaştırın.

Kaynaklar

1. Qt — Rendering SVG Files — Görüntüleme widget'ları, çizim aracı hedefleri ve widget içinde görüntüleme ile raster ara çıktılar arasındaki ayrım.
2. Qt — QSvgWidget Class — Görüntüleme widget'ı, görüntüleyiciye erişim ve SvgWidgets bağımlılığı.
3. Qt — QSvgRenderer Class — Svg bağımlılığı, belge geçerliliği ve en-boy oranı ayarları.
4. Qt — Extended Features — Modern genişletmeler ve desteklenmeyen kırpma yolları dahil açık özellik sınırları.

Küçük bir dosyayla başlayın ve seçtiğiniz Qt yolunda inceleyin. Raster grafiğin yeniden oluşturulması gerekiyorsa düzenlenebilir bir SVG adayı hazırlayın, şekilleri kaynakla karşılaştırın ve varlığınızı değiştirmeden önce uygulama düzeyindeki kontrolleri tekrarlayın.