Wie wird ein leerer Bereich zwischen einem Rahmen und einem Hintergrund in einer Schaltfläche mit abgerundeten Ecken korrigiert?

8

Ich habe eine einfache Schaltflächenvorlage für meine WPF-Anwendung erstellt:

%Vor%

Aber wie Sie auf dem Screenshot unten sehen können, haben Schaltflächen einen kleinen leeren Platz in den Ecken:

Hier ist ein gezoomter Teil der Schaltfläche:

Wie kann ich das beheben?

Danke!

    
0wl 02.09.2013, 21:49
quelle

4 Antworten

3

Wenn Sie einen weiteren Rahmen für den Hover über dem vorhandenen hinzufügen, führt dies schließlich zu den gewünschten Effekten:

%Vor%     
0wl 02.09.2013, 22:40
quelle
9

WPF rendert die Elemente standardmäßig mit Anti-Aliasing. Dies kann zu kleinen Lücken zwischen Shapes führen.

Setze EdgeMode auf Aliased auf deinem Border , dies sollte die kleine Lücke beseitigen

%Vor%

Beispiel:

%Vor%

Ergebnis:

Vorher (Anti-Aliasing): Nach (Alias):

Option 2:

Eine weitere einfache Option besteht darin, Grid in Style in Border zu ändern und Background und CornerRadius gleich zu setzen, aber Margin auf -1, was zu a führt glatterer Ansatz als mit Aliased und entfernen Sie die kleine Lücke

Beispiel:

%Vor%     
sa_ddam213 02.09.2013 22:20
quelle
2

Versuchen Sie, die Eigenschaft BorderThickness Ihres buttonBorder Border auf "0" oder eine größere Zahl zu setzen. Nachdem ich das gesagt habe, habe ich das noch nie zuvor bei einem meiner Border -Elemente gesehen ... bist du wirklich sicher, dass das nicht nur eine Verzerrung auf dem Bild ist der Schaltfläche?

    
Sheridan 02.09.2013 22:13
quelle
0

Ich habe mich schon eine ganze Weile daran gehalten und habe regelmäßig Probleme mit Button-Styles. Die obigen Antworten haben mir sehr geholfen, aber alle haben einige Mängel.

  • Aliasing macht es verschwommen
  • Grenze für Hover erfordert Änderung des Randes für verschiedene Randdicken

Da ich meine eigene Stilbibliothek für die Verwendung in mehreren Projekten erstellen wollte, waren das keine großartigen Lösungen, obwohl sie für jeden Stil besonders geeignet war.

Nun, es scheint jetzt sehr einfach zu sein, und sagen Sie mir, wenn ich falsch liege, aber ein zusätzlicher Rand im Stamm des Templates macht den Job wie erwartet.

Positioniert unter anderen Elementen, ohne Dicke, sollte die Hintergrundfarbe des Hintergrunds als Hintergrund verwendet werden. Gib ihm Größeneigenschaften vom inneren Rand und genieße!

%Vor%

Link zum Bild vorher / nachher, 4 kb

Beachten Sie, dass Sie die Farbe dieses Rahmens in Triggern ändern müssen, wenn Sie auch andere Farben durch Trigger ändern. Ansonsten bleibt es wie im statischen Zustand und ist in der Lücke sichtbar, wenn man gedrückt / gedrückt wird.

    
Lark3D 10.06.2016 16:05
quelle

Tags und Links