TCanvas Formen sehen auf verschiedenen Bildschirmen anders (unscharf) aus

[egon89]

Hallo,

in meiner Anwendung werden verschiedene Formen mittels TCanvas erstellt (Kreise, Rechtecke, Linien …usw.). Auf dem Bildschirm, auf dem ich arbeite, sehen die Formen dann richtig gut und scharf aus. Wenn ich meine Anwendung dann aber auf einem anderen Bildschirm laufen lassen, sehen die Formen auf einmal verpixelt und unscharf aus und Linien sind auf einmal nicht mehr gerade (siehe Bilder).

Wenn meine Anwendung startet, misst diese erst einmal die Höhe und Breite des Fensters aus (in Pixel). Der Höhe und Breite weiße ich einen Wert zu. Anschließend werden die Formen in Relation zu diesen Werten erstellt.
Das heißt die Start- und Endwerte sind in konkreten Zahlen immer anders (je nach Höhe und Breite), aber in Relation sind die Formen immer gleich (z.B. 2cm vom Rand entfernt).

Das Problem habe ich aber auch bei Nicht-TCanvas Formen wie z.B. TStringGrid, das ist auch komplett unscharf.

Ich arbeite mit TImage.Canvas und VCL.

Leider weiß ich im Moment überhaupt nicht, wo ich anfangen kann, mich mit diesem Problem zu beschäftigen – ich dachte bereits, es hat etwas mit ScaleFactor oder so zu tun, aber ich habe ehrlich gesagt nicht einmal eine Ahnung, was das Problem sein könnte (vor allem, da das Problem auch nicht-TCanvas Komponenten betrifft).

Danke und Gruß
Gregor

[egon89]

Habe wohl einen Ansatz gefunden.

Werde mich mal mit Direct2D und/oder GDI+ auseinandersetzen.

[TurboMagic]

Hallo,

haben diese anderen Bildschirme evtl. andere Auflösungen/Zoomfaktoren in den Bildschirmeinstellungen?
Und wie sind die HiDPI Einstellungen deiner Anwendung unter Projekt Optionen?

[Redeemer]

Wenn man gerne mit Canvas arbeiten und sich beim Generieren der Zeichnung nicht um die Skalierung kümmern möchte, kann man zuerst in Standardgröße auf eine TMetafileCanvas malen und anschließend das resultierende TMetaFile in der gewünschten Größe zeichnen so wie jedes andere Bild - mit der richtigen Zeichenmethode ist das dann aber immer scharf - sofern die DPI-Einstellungen so sind, dass die Skalierung nicht durch Windows passiert. Ein anderes Zwischenformat ist SVG, dafür gibt es kleinere (RedeemerSVG) und größere Bibliotheken, aber SVG kann keine Hatches.

[egon89]

Zitat:

Zitat von TurboMagic (Beitrag 1538959)

Hallo,

haben diese anderen Bildschirme evtl. andere Auflösungen/Zoomfaktoren in den Bildschirmeinstellungen?
Und wie sind die HiDPI Einstellungen deiner Anwendung unter Projekt Optionen?

Ja, die Auflösungen sind unterschiedlich - "4096 x 2304" beim "guten" Bildschirm, "3840 x 2160" beim "schlechten" Bildschirm.
Wenn ich aber die Auflösung beim "schlechten" Bildschirm hochschraube, wird das Problem leider nicht gelöst.

Auch die Anpassung bei High DPI von "Automatisch (Bilschirm PPI)" auf Benutzerdefiniert (150 oder 480 PPI) oder auch auf "Low DPI" macht gar keinen Unterschied.

[Uwe Raabe]

Zitat:

Zitat von egon89 (Beitrag 1538987)

Auch die Anpassung bei High DPI von "Automatisch (Bilschirm PPI)" auf Benutzerdefiniert (150 oder 480 PPI) oder auch auf "Low DPI" macht gar keinen Unterschied.

Die sind ja auch nur für das Design in der IDE relevant.

[himitsu]

Und was ist mit der Skalierung der ganzen Form, bzw. Anwendung?

Form.Scaled usw.
sowie
Projektoptionen > Anwendung > Manifest > DPI-Unterstützung

Wenn das Fenster durch Windows skaliert wird, dann hat das Canvas der Form und somit auch alle untergeordneten Canvas intern eine andere Auflösung.

[TurboMagic]

Zitat:

Zitat von Redeemer (Beitrag 1538963)

Wenn man gerne mit Canvas arbeiten und sich beim Generieren der Zeichnung nicht um die Skalierung kümmern möchte, kann man zuerst in Standardgröße auf eine TMetafileCanvas malen und anschließend das resultierende TMetaFile in der gewünschten Größe zeichnen so wie jedes andere Bild - mit der richtigen Zeichenmethode ist das dann aber immer scharf - sofern die DPI-Einstellungen so sind, dass die Skalierung nicht durch Windows passiert. Ein anderes Zwischenformat ist SVG, dafür gibt es kleinere (RedeemerSVG) und größere Bibliotheken, aber SVG kann keine Hatches.

Nur Interesse halber: was sind Hatches?

[himitsu]

z.B. Brush.Style, also diese Linienmuster/Fillpattern

Sieht aber so aus, als wenn SVG sowas doch kann. :gruebel:
https://codepen.io/layalk/pen/mmXpog

[Redeemer]

Zitat:

Zitat von himitsu (Beitrag 1538992)

Sieht aber so aus, als wenn SVG sowas doch kann. :gruebel:
https://codepen.io/layalk/pen/mmXpog

Ja schon, aber es ist halt wesentlich mehr Aufwand. Auch RedeemerSVG kann das (glaube ich), rastert es aber.

[egon89]

Ich habe bereits die SVG Canvas library von WinSoft ausprobiert, aber die spuckt einen sehr schlechten SVG Code aus und außerdem funktioniert die Konvertierung nicht so richtig (auf einmal waren Bögen um 180° gedreht), daher hab ich das dann auch gelassen.

[egon89]

Zitat:

Zitat von himitsu (Beitrag 1538990)

Und was ist mit der Skalierung der ganzen Form, bzw. Anwendung?

Form.Scaled usw.
sowie
Projektoptionen > Anwendung > Manifest > DPI-Unterstützung

Wenn das Fenster durch Windows skaliert wird, dann hat das Canvas der Form und somit auch alle untergeordneten Canvas intern eine andere Auflösung.

Das hat gar nix gebracht. Habe mal die unterschiedlichen Unterstützungen ausprobiert, aber das hat nicht viel geholfen.

[Redeemer]

Zitat:

Zitat von egon89 (Beitrag 1538994)

Ich habe bereits die SVG Canvas library von WinSoft ausprobiert, aber die spuckt einen sehr schlechten SVG Code aus und außerdem funktioniert die Konvertierung nicht so richtig (auf einmal waren Bögen um 180° gedreht), daher hab ich das dann auch gelassen.

Dann nimmst du halt TMetafileCanvas. Funktioniert ähnlich, aber da kommt statt einer SVG eine WMF oder EMF raus. Unbedingt EMF nehmen (Enhanced auf True setzen), sonst halt du Probleme mit Konturen und Bézier.
Ich schreibe den Code für meine SVGs immer selbst.

[Uwe Raabe]

Kannst du mal etwas Code posten, damit wir auch sehen können, was du da machst?

[TomyN]

Ich würde mal Graphics32 / TCanvas32 ins Rennen werfen, da kann man single Koordinaten verwenden. Und es ist sehr nahe am TCanvas, so dass der Umstellungsaufwand nicht so hoch ist.

[jaenicke]

Was mir beim Vergleich der Screenshots auffällt:
Die Stecker auf dem Bild mit guter Qualität haben ein richtiges Muster, während dieses bei schlechter Qualität nicht etwa nur pixelig ist, sondern der Ausschnitt quasi kleiner ist. Etwa um den gleichen Faktor sehen die Pixel dort größer aus.

Für mich sieht es so aus, als ob dort einfach mit viel geringerer Auflösung gezeichnet und hochskaliert wird. Den gleichen Eindruck macht der Text daneben.

Wäre es nicht möglich ein kleines Testprojekt zu bauen? Dadurch, dass das auch die Komponenten betrifft, sollte das ja nicht viel Aufwand sein. Zusätzlich ist die oben schon nachgefragte Skalierung der Monitore (100%, 150%, ...) wichtig, außerdem die Windows- und Delphiversion (denn in beidem hat sich diesbezüglich viel getan).

[egon89]

Zitat:

Zitat von Redeemer (Beitrag 1538996)

Zitat:

Zitat von egon89 (Beitrag 1538994)

Ich habe bereits die SVG Canvas library von WinSoft ausprobiert, aber die spuckt einen sehr schlechten SVG Code aus und außerdem funktioniert die Konvertierung nicht so richtig (auf einmal waren Bögen um 180° gedreht), daher hab ich das dann auch gelassen.

Dann nimmst du halt TMetafileCanvas. Funktioniert ähnlich, aber da kommt statt einer SVG eine WMF oder EMF raus. Unbedingt EMF nehmen (Enhanced auf True setzen), sonst halt du Probleme mit Konturen und Bézier.
Ich schreibe den Code für meine SVGs immer selbst.

Ich werde mir das das Wochenende auf jeden Fall mal anschauen - klingt nach einem guten Ansatz

[egon89]

Zitat:

Zitat von jaenicke (Beitrag 1539000)

Zusätzlich ist die oben schon nachgefragte Skalierung der Monitore (100%, 150%, ...) wichtig, außerdem die Windows- und Delphiversion (denn in beidem hat sich diesbezüglich viel getan).

Ich arbeite auf Windows 10 mit Delphi 11.3.
Ja, die Auflösungen sind unterschiedlich - "4096 x 2304" beim "guten" Bildschirm, "3840 x 2160" beim "schlechten" Bildschirm.
Die Skalierung liegt bei 200%, ist aber bei beiden Bildschirmen gleich.