1 00:00:02,350 --> 00:00:07,180 Zurück in unserem Code, hier im Startbildschirm, dem ersten Bildschirm, den wir sehen, konnten 2 00:00:07,370 --> 00:00:13,070 wir bereits sehen, dass unsere beiden Schaltflächen - Zurücksetzen und Bestätigen - auch nicht so gut in 3 00:00:13,160 --> 00:00:14,980 unserem Schaltflächencontainer positioniert waren. 4 00:00:15,080 --> 00:00:21,650 Schauen wir uns also das Styling an, das wir dort unten eingerichtet haben. Was wir hier sehen 5 00:00:21,650 --> 00:00:24,790 können, ist, dass wir dem Button-Container die 6 00:00:24,830 --> 00:00:28,380 Breite von 100% zuweisen, aber worauf bezieht sich diese Größe? 7 00:00:28,400 --> 00:00:34,820 Nun, diese Größe in dieser Ansicht hier bezieht sich natürlich, wenn wir 100% sagen, am Ende auf das umgebende 8 00:00:34,820 --> 00:00:38,150 übergeordnete Element, bei dem es sich in diesem Fall um 9 00:00:38,150 --> 00:00:46,370 diese Karte, diesen Eingabecontainer und in diesem Eingabecontainer handelt. Wir haben tatsächlich eine Breite von 300 festgelegt ist einfach zu klein, kombiniert mit unseren Schaltflächen, 10 00:00:46,370 --> 00:00:52,640 die wir eine feste Breite von 100 haben, erhalten wir diesen Look, den wir nicht wollen, den wir übrigens 11 00:00:52,640 --> 00:00:58,570 sehen können, wenn wir etwas ändern, so dass unsere App neu erstellt und daher neu gestartet wird 12 00:00:58,590 --> 00:01:01,280 Wir sehen diesen Startbildschirm wieder. Hier ist der 13 00:01:01,340 --> 00:01:03,530 Look, den wir nicht wollen. 14 00:01:03,530 --> 00:01:06,210 Was wollen wir hier? 15 00:01:06,210 --> 00:01:13,500 Nun, vielleicht wollen wir hier nicht die Breite von 300, sondern eine flexiblere Breite. Wir legen eine maximale Breite von 80% fest. Wir 16 00:01:13,500 --> 00:01:22,020 können hier immer eine Breite von beispielsweise 80 oder 90% festlegen und einfach sicherstellen, dass diese immer eine minimale Breite von 17 00:01:23,790 --> 00:01:31,230 300 hat, damit wir immer eine haben Zumindest so viele Pixel für den Fall, dass wir ein kleines 18 00:01:31,230 --> 00:01:36,180 Gerät haben, bei dem 80% weniger wären, und dass wir mindestens dies 19 00:01:36,180 --> 00:01:39,750 haben und jetzt würde dies hier besser aussehen. 20 00:01:39,750 --> 00:01:40,630 Warum? 21 00:01:40,710 --> 00:01:43,520 Weil wir jetzt standardmäßig 80% haben und vorher 22 00:01:43,620 --> 00:01:46,070 hatten wir es als maximale Breite. 23 00:01:46,650 --> 00:01:50,280 Wenn Sie nun einen Standardwert festlegen, wird sichergestellt, dass dies nicht unsere Grenze 24 00:01:50,280 --> 00:01:51,830 ist, sondern unsere Standardgröße. Wir 25 00:01:51,840 --> 00:01:57,030 möchten jedoch auch festlegen, dass die Mindestbreite 300 beträgt. Auf diesem kleinen Gerät überschreibt diese 26 00:01:57,060 --> 00:02:02,760 Mindestbreite unsere Standardbreite, da 80% auf diesem kleinen Gerät tatsächlich weniger als 27 00:02:02,760 --> 00:02:04,730 300 betragen würden. 28 00:02:04,740 --> 00:02:10,200 Jetzt könnten Sie natürlich ein noch kleineres Gerät haben, bei dem diese Regel jedoch zu einem Problem 29 00:02:10,200 --> 00:02:16,950 führt, bei dem eine Mindestbreite von 300 im Grunde bedeutet, dass Ihr Gerät kleiner als das ist, nicht breit genug ist 30 00:02:16,950 --> 00:02:20,800 und Ihr Container daher die Grenzen unseres Geräts überschreiten würde Bildschirm. 31 00:02:20,820 --> 00:02:26,070 Das ist vielleicht immer noch nicht die perfekte Regel, aber es ist sicherlich besser, wie wir hier sehen können, denn auf dem 32 00:02:26,070 --> 00:02:30,900 größeren Bildschirm sieht dies hier auf dem iPhone immer noch gut aus, auf dem kleineren Bildschirm sieht es jetzt 33 00:02:30,900 --> 00:02:31,800 auch gut aus. 34 00:02:31,800 --> 00:02:38,730 Um sicherzustellen, dass wir unsere Grenzen nie verlassen, können wir auch eine maximale Breite festlegen und diese so einstellen, dass sie beispielsweise 35 00:02:38,970 --> 00:02:42,920 95% beträgt, sodass wir zumindest einen kleinen Abstand um sie herum haben. 36 00:02:42,960 --> 00:02:50,340 Jetzt stellen wir sicher, dass unser Container niemals außerhalb unseres Bildschirms fährt, sondern 80% benötigt. Wenn wir 37 00:02:50,670 --> 00:02:53,780 jedoch einen superkleinen Bildschirm haben, benötigt 38 00:02:53,790 --> 00:02:57,840 er 300, aber niemals mehr als 95% der verfügbaren Breite. 39 00:02:58,440 --> 00:03:04,440 Jetzt haben wir hier einfach flexiblere Regeln aufgestellt, die auf einer breiteren Palette von Geräten funktionieren, was, wie Sie sehen 40 00:03:04,500 --> 00:03:06,390 können, hier etwas besser ist.