2013-10-31 3 views
7

Ich aktualisiere meine App, um Dynamic Type in iOS 7 zu unterstützen. Es war relativ einfach, den Text abhängig von der Systemeinstellung seine Größe anzupassen, aber wie ich es im Kontext eines UITableView und Zellen mit mehreren verwenden UILabels in ihnen, Textgröße ist nicht die einzige Sache, über die ich mich sorgen muss. Wenn der Text wächst, sollte auch die Höhe der Zelle sein, wenn der Text kleiner wird, sollte es auch die Zellenhöhe sein.Wie kann ich bei Dynamic Type in iOS 7 erweiterte Layoutprobleme berücksichtigen, z. B. den Abstand zwischen Labels/Ansichten?

Auch wenn es kleiner wird, sollte es offensichtlich weniger Abstand zwischen den Elementen im Vergleich zu seiner größten Größe (wie bei einer kleinen Größe die Zwischenräume zwischen Riese wäre).

Wie ändere ich erweiterte Layoutprobleme wie diese, wenn der Benutzer die Größe des dynamischen Typs ändert?


Im Moment mache ich etwas wirklich hässliches, das kaum funktioniert. Ich betrachte die Höhe eines meiner Labels und skaliere meine Konstanten mit ihrer Größe. Aber es ist sehr ungenau, da 110% einer UILabel-Höhe bei der aktuellen Textgröße, die als das Padding zwischen Elementen verwendet wird, nicht notwendigerweise universell arbeiten werden.

Also hier ist, was ich in diesem Beispiel zu tun.

CGRect articleTitleRect = [article.title boundingRectWithSize:CGSizeMake(CGRectGetWidth(self.contentView.bounds) - 29, MAXFLOAT) 
                  options:NSStringDrawingUsesFontLeading 
                 attributes:@{ NSFontAttributeName: [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline] } 
                  context:nil]; 
    self.urlConstant.constant = articleTitleRect.size.height/5; 
    self.previewConstant.constant = articleTitleRect.size.height/5; 

(Im Grunde genommen um herauszufinden, was die Höhe eines Etiketts wird, dann Prozentsatz, die mit dem Abstand zu schließen, wieder sehr ungenau und doesn 't funktionieren gut universell.)

Die andere Sache, die ich in Betracht gezogen habe, war zu überprüfen, was der aktuelle ist gleich bei einer Punktgröße, und für bestimmte Werte hardcode die Schnittstelle Anpassungen/Abstand. Das funktioniert ein wenig besser, aber es scheint immer noch nicht optimal zu sein, was Apple vorhatte, da es nicht besonders dynamisch ist (es bricht, wenn es beispielsweise eine andere Schriftgröße hinzufügt) und du schnüffelst fast nach Werten, die sie nicht haben. t geben Sie aus der Fledermaus (was es scheint hacky).


Also, was tun Anwendungen wie Tweetbot 3 (das jetzt dynamische Art verwenden, um ihre UITableViewCell Elemente eingestellt) tun, um ihre UI so gut gemacht über verschiedene dynamische Typ Größen aussehen? Was ist der beste Weg, dies zu tun? Es scheint ehrlich gesagt keine Tutorials zu diesem Thema zu geben.

+0

Können Sie einige Screenshots zeigen, wie Tweetbot 3 den Abstand zwischen Textelementen in Abhängigkeit vom dynamischen Typ ändert? –

Antwort

0

Ich habe noch keinen dynamischen Typ verwendet. Aber ich denke, ein Ansatz, den Sie verwenden könnten, wäre die Verwendung von Auto-Layout, um Ihren Zelleninhalt zu planen, und lassen Sie die Auto-Layout-Engine Ihre benötigten Zellenhöhen bestimmen. Wenn dann die dynamische Schriftgröße aktualisiert wird, müssen Sie lediglich die Tabellenansicht entweder neu laden oder neu berechnen lassen (über beginUpdates/endUpdates).

antwortete ich eine Frage mit einem Beispiel dafür, wie Auto-Layout zu verwenden, um die Tableview Zellenhöhe für jede gegebene Zelle zu berechnen, hier:

How to resize superview to fit all subviews with autolayout?

EDIT

Per Ihrem Kommentar:

Höhe ist nicht wirklich das Problem hier, ich kann das eherberechnen 210 leicht.Meine Frage ist, wie man mit den härteren Dingen, wie Abstand zwischen den Etiketten zum Beispiel, wo, wenn die Etiketten größer werden ihr Abstand sollte auch leicht wachsen. im Grunde nur auch lernen, wie man am besten Layouts von Dynamic Typ

Immer, wenn Sie eine Einschränkung zur Laufzeit benötigen betroffen passt einzustellen, sobald die Einschränkung erstellt und registriert wurde, tun Sie dies, indem Sie die constant Eigenschaft der Zwangs Einstellung . Wenn Sie also den Abstand zwischen zwei Elementen basierend auf einer anderen Eigenschaft (z. B. Textgröße) optimieren möchten, müssen Sie dies manuell tun, indem Sie die Constraint-Konstante anpassen, die den Abstand für diese beiden Elemente verwaltet. Wenn die Einschränkung in Interface Builder erstellt wurde, müssen Sie sie an ein IBOutlet binden, damit Sie im Code darauf verweisen können.

Constraints verfügen auch über eine Multiplikatoreigenschaft, mit der Sie eine Constraint basierend auf dem berechneten Attributwert einer anderen Ansicht dynamisch anpassen können. Ich glaube nicht, dass Sie dies im Interface Builder manipulieren können, aber wenn Sie Ihre Einschränkungen im Code erstellen, können Sie das tun. Mit dem Multiplikator sollten Sie in der Lage sein, eine Abstandsbeschränkung einzurichten, die basierend auf der Höhe eines anderen Elements größer oder kleiner wird.

In einem komplexeren Szenario möchten Sie möglicherweise das Layout bei einer Änderung der Eigenschaften (z. B. der Textgröße) drastisch ändern, abgesehen von der Optimierung einfacher Abstandseinschränkungen. In diesem Fall würde ich einen der folgenden Punkte empfehlen:

1) Erstellen und verwalten Sie Ihre Einschränkungen vollständig im Code. Zerreißen und die richtigen Einschränkungen erstellen, wenn Sie eine Layout-Umstellung festlegen.

2) Erstellen Sie mehrere Nibs, um mehrere UI-Layouts über von Interface Builder definierte Einschränkungen zu verwalten. Laden oder laden Sie die richtige Feder dynamisch, wenn Sie eine Layout-Umschaltung festlegen. Der möglicherweise unerwünschte Nebeneffekt davon ist, dass alle Ihre Ansichten/Steuerelemente neu erstellt werden.

+0

Höhe ist nicht wirklich das Problem hier, ich kann das ziemlich leicht berechnen. Meine Frage ist mehr, wie man mit den härteren Dingen umgeht, wie zum Beispiel dem Raum zwischen den Etiketten, wo die Abstände zwischen den Etiketten auch etwas größer werden. Außerdem erfahren Sie im Grunde, wie Sie die von Dynamic Type betroffenen Layouts am besten anpassen können. –

+0

Ich verstehe, wie man Konstanten ändert, aber sie zu den Werten zu ändern ist der verwirrende Teil hier. Woher weiß ich, welchen Multiplikator verwendet werden soll? Nur Vermutungen zu machen, indem man sich das Wachstum anderer UI-Elemente ansieht, ist ein ziemlich ungenauer Weg. –

1

Dies ist etwas, was Sie selbst tun müssen, aber iOS hat Ihnen die Tools zur Verfügung gestellt, die Sie mit TextKit benötigen. Es gibt tatsächlich eine Menge Dokumentation in der Test Programming Guide.

Zum Beispiel im Abschnitt Working with Font Objects der UIContentSizeDidChangeNotification, der Ihre App darüber informiert, dass sich der Wert für den dynamischen Typ geändert hat, mit einem userInfo Wörterbuch mit dem neuen Wert. Dies ist der Einstiegspunkt für die Änderungen, die Sie vornehmen möchten. Wenn zum Beispiel der neue Wert UIContentSizeCategoryAccessibilityMedium ist, beträgt der Abstand zwischen zwei Labels 10 Punkte, aber wenn der neue Wert UIContentSizeCategoryAccessibilityLarge ist, können Sie ihn auf 15 setzen. Natürlich erfinde ich nur Werte und finde heraus, was am besten funktioniert etwas, was Sie durch Versuch und Irrtum tun müssen. Sobald Sie jedoch die richtigen Entfernungen herausgefunden haben, sollten Sie sicherstellen, dass alles funktioniert, und nicht mehr als ein Dutzend Zeilen Code benötigen.

Schauen Sie sich auch UIFontDescriptor, vor allem die Konstanten am Ende dieser Referenz. Sie ermöglichen Ihnen den Zugriff auf nahezu jede Schriftarteigenschaft und -eigenschaft. Sie können das verwenden, um Ihre eigene Schriftart mit benutzerdefinierten Eigenschaften zu "bauen". Wenn Sie diesen Weg gehen wollen, wird es ein bisschen mehr Code benötigen, aber TextKit bietet Ihnen viele verschiedene APIs, wenn es darum geht, Text auf dem Bildschirm zu zeigen.

Verwandte Themen