UICollectionView lag

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • UICollectionView lag

    Hi leute,

    Habe eine UICollectionView mit 24 Elementen.

    So sieht die cellForRow methode aus:

    Quellcode

    1. - (UICollectionViewCell *) collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
    2. {
    3. DoorCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"DoorCell" forIndexPath:indexPath];
    4. if(!cell)
    5. {
    6. cell = [[NSBundle mainBundle] loadNibNamed:@"DoorCell" owner:self options:0][0];
    7. }
    8. [cell.backgroundImageView setImage:[UIImage imageNamed:[NSString stringWithFormat:@"%ld_Door", indexPath.row+1]]];
    9. cell.titleLabel.text = [NSString stringWithFormat:@"%ld", indexPath.row+1];
    10. return cell;
    11. }
    Alles anzeigen

    Es lagt und scrollt schlimm wie sau auf dem iPad Air 1.

    Steh ich aufm Schlauch oder bin ich nur behindert? :D

    Danke & Gruß
    Every language has an optimization operator. In ObjC that operator is ‘//’.

    golbros.de
  • Viele Subviews mit CornerRadius sind böse in ScrollViews und somit auch in einer CollectionView. Hier muss massig Blending betrieben werden.

    Was mir schon bessere Performance gebracht hat:
    Eine weitere UIImageView darüberlegen welche als Rand abgerundete Ecken in der Farbe des Hintergrunds der CollectionView hat, und in der Mitte transparent ist.

    Hier muss das Blending nur einmal gemacht werden wenn die Cell reused wird.

    Bei der Variante mit den echten transparenten Ecken deiner Cell (also mit CornerRadius) muss das für 60fps eben 60 mal die Sekunde passieren.

    Mit ein paar großen Cells geht sowas noch, aber wenn man viele kleine Cells hat (besonders auf dem großen Display des iPads) geht die GPU schnell in die Knie.

    Anstatt einer zweiten UIImageView kann man auch mit CoreGraphics den Rand in das Bild zeichnen. Async und dann im Mainthread zuweisen.

    Hat den Vorteil, dass das Blending die CPU übernimmt (ist dann Offscreen Drawing) und nicht die GPU. Während dem Scrollen ist die GPU meist stärker ausgelastet und die CPU kann unter Umständen eher gelangweilt sein.
  • Den Sch....ß mit den abgerundeten Ecken hab ich aufgegeben. Hab auch nie eine Lösung dafür gefunden, mich aber auch nie wieder darum gekümmert.
    Ohne die Rundungen läuft das fluffig, in meinen Apps jedenfalls.

    Abgerundete Ecken (und Verläufe und so'n Kram) sind layoutmäßig sowieso out, im Moment jedenfalls. Kommt sicher irgendwann wieder.
    Ich bin gegen Signaturen!!!
  • Flat Design bedeuted ja nicht, dass alles nur quadratisch ist. ;)

    Das wäre ja noch langweiliger als es eh schon ist.
    Gerade das Spiel mit Formen und Farben rettet diesen Trend ja noch ein wenig.

    Auch runde Views (ggf. auch mit einem Border) sind über CornerRadius und Layer Effekte zu erreichen.
    Außerhalb von komplexen Animationen oder ScrollViews verwende ich das gern so, da es mit wenigen Zeilen Code zu erledigen ist.
    Solang eine View nur selten neu gezeichnet wird, ist das von der Performance ja kein Problem.

    Was mir noch als Möglichkeit eingefallen ist:
    Eine ContainerView in die CollectionView packen und da hinein die ImageView.
    Nun nur der ImageView den cornerRadius zuweisen.
    Die ContainerView sollte wieder Opaque sein und die Hintergrundfarbe der CollectionView ohne transparenz zugewiesen bekommen.

    Am Ende dann bei der ContainerView shouldRasterize setzen.
    Damit sollte sich die Cell auch nicht mehr bei jedem Frame des Scrollens neu gezeichnet werden (Sie cached ihren gezeichneten Zustand selbst).
    Da die Cell im gesamten selbst keine transparenten Stellen hat, findet auch kein aufwändiges Blending statt.


    Eine Voraussetzung haben aber alle diese Lösungen für Fake-Transparenten Ecken:
    Deine CollectionView benötigt eine einheitliche Hintergrundfarbe.

    Wenn du hier irgendein Bild oder Verlauf als Hintergrund hast, muss ja zwingend Blending betrieben werden,
    damit die Ecken auch den richtigen Content dahinter "durchlassen".

    In diesem Fall hilft nur eine kleinere Anzahl transparenter Bereiche auf dem Bildschirm wenn es auf dem iPad nicht so rennt wie auf dem iPhone.
    Sprich z.B. den Content etwas strecken auf dem iPad, oder mehr Abstand/größere Zellen.
    Ebenfalls könnte man sich die Frage stellen, ob es anderen Content gibt, den du auf dem iPhone in einem anderen Tab darstellst.
    Evtl. kannman den du auf dem iPad in einer SplitView anzeigen, so dass
    a) der Bildschirmbereich der collectionView kleiner wird
    b) der User vielleicht sowieso einen Mehrwert durch ein angepasstes iPad Layout hat.
  • 2015 und ich darf meine Views nicht abrunden...

    beage schrieb:

    Abgerundete Ecken (und Verläufe und so'n Kram) sind layoutmäßig sowieso out, im Moment jedenfalls. Kommt sicher irgendwann wieder.
    Da hast du, wie ich finde, sogar recht. Benutze abgerundete Ecken und Shadow daher nur bei Dingen die sich nicht bewegen.
    Aber hier habe nun 24 Views, die scrollbar sind. Und ich wollte vermeiden nun 24 Bilder mit GIMP oder so mit abgerundeten Ecken zu speichern.
    Außerdem ist die App ein Adventskalender, da kommt das "Flat Design" nicht zum tragen :D


    Dass das echt noch so ein Problem ist, zumindest auf "alten" Geräten find ich schade.

    Ich habe erst demletzt eine App für einen Kunden entwickelt, der seine Produkte schön und animiert auf der Messe präsentieren wollte.

    Aber da auch alles mit ScrollViews, cornerRadius shadows etc gemacht. Auf dem iPad Air 2 läuft das super!
    Auf dem iPad Air 1 grauenvoll.
    Every language has an optimization operator. In ObjC that operator is ‘//’.

    golbros.de