Wie kann ich ein pixcel-perfektes (1) pixcel mit Umrandungslinie in einer UICollectionView erhalten (z. B. um einen Monatskalender zu erstellen). Das Problem ist, dass wo Zellen treffen ihre Grenzen treffen, so dass es effektiv 2 Pixcels (nicht 1 Pixcel).
Das Problem ist daher ein mit CollectionView-Layout zusammenhängendes Problem. So wie jede Zelle ihren eigenen 1-Pixel-Rahmen setzt, entsteht, wenn die Zellen alle mit einem Abstand von Null zusammentreffen, ein Bild, das wie ein 2-Pixel-Rahmen aussieht (mit Ausnahme der äußeren Kanten des Collection-Views, der 1 Pixel ist) >
Suchen, welcher Ansatz / Code verwendet werden soll, um dies zu lösen.
Hier ist die benutzerdefinierte UICollectionViewCell-Klasse, die ich verwende, und ich lege hier die Zellen mit drawrect fest.
%Vor%Es gibt einige Strategien, die Sie ergreifen können, um dieses Problem zu lösen. Was am besten ist hängt von einigen Details Ihres Layouts ab.
Zeichnen Sie um die Hälfte die gewünschte Breite um jedes Element. Dies wurde vorgeschlagen. Es wird die richtige Breite für die Rahmen zwischen den Elementen erreicht, aber die Rahmen um den Rand der Kollektion herum sind ebenfalls halb so breit wie gewünscht. Um dies zu lösen, können Sie einen Rahmen um die gesamte Sammlung oder Abschnitte ziehen.
Wenn Sie im Monatslayout nur Tage eines bestimmten Monats darstellen, dh jeder Monat eine eindeutige nicht rechteckige Form hat, ist das Festlegen der Kantenränder komplizierter als es wert ist.
Zeichnen Sie die volle Umrandung um jeden Gegenstand, aber passen Sie die Rahmen so an, dass sie sich um die Hälfte der Breite der Umrandungen überlappen und die Redundanz verstecken.
Dies ist die einfachste Strategie und funktioniert gut, aber beachten Sie einige Dinge:
Anstatt Grenzen für die Zelle zu verwenden, können Sie einen Rahmen um den Container hinzufügen und anschließend die Grenzen in der Superansicht manuell zeichnen. Dies könnte durch Überschreiben von drawRect(_:) und Verwenden von UIBezierPaths zum Zeichnen von horizontalen und vertikalen Linien in den Intervallen der Zellen erreicht werden. Dies ist die manuelleste Option. Es gibt Ihnen mehr Kontrolle, ist aber viel mehr Arbeit.
Anstatt die Rahmenbreite und die Rahmenfarbe der Ebene festzulegen, die einen Rahmen um die gesamte Ansicht zeichnet, zeichnen Sie die Ränder der Zellen selektiv. Zum Beispiel: jede Zelle konnte nur ihre untere und rechte Kante zeichnen, außer wenn keine Zelle über oder rechts davon ist.
Dies kann wiederum zu Komplikationen führen, wenn Sie ein unregelmäßiges Gitter haben. Es erfordert auch, dass jede Zelle über ihren Kontext im Raster informiert, der mehr Struktur erfordert. Wenn Sie diesen Weg gehen, würde ich vorschlagen, subclassing UICollectionViewLayoutAttributes und zusätzliche Informationen darüber, welche Kanten gezeichnet werden sollten. Die Kantenzeichnung selbst kann erneut durchgeführt werden, indem UIBezierPath in drawRect(_:) für jede Kante erstellt wird.
Im Hinblick auf die sehr gründlich akzeptierte Antwort glaube ich nicht, dass eine dieser Methoden sehr sauber ist. Um dies in allen Szenarien gut aussehen zu lassen, werden Sie das Raster "manuell" zeichnen wollen, aber dies in einem drawRect zu tun ist keine gute Idee a), da dies Ihre Zellen unter zeichnen wird b) drawRect malt den Bildschirm 60 Mal pro Sekunde, so dass bei einer großen Scroll-Ansicht Performance-Probleme auftreten.
Besser IMO ist CALayers zu verwenden. Mit CALayer können Sie einmal eine Gitterlinie auf die Ansicht legen und von da an auf der GPU bleiben, so dass sogar ein riesiges Raster mit 60 fps gezeichnet werden kann. Ich finde auch die Implementierung einfacher und flexibler. Hier ist ein funktionierendes Beispiel:
%Vor%Tags und Links uitableview ios uicollectionview uiview uicollectionviewlayout