SlideShare ist ein Scribd-Unternehmen logo
Einheitliche Oberflächen für iOS
Auto Layout
@michaelkotten @_openknowledge #WISSENTEILEN
Michael Kotten (a.k.a. @michaelkotten)
ÜBER MICH
MK
#WISSENTEILEN
• Head of mobile development
• Enterprise & Mobile
• Developer & Speaker
• IOT Fan
• zweifacher Vater, einfacher Ehemann
Branchenneutrale Softwareentwicklung und IT-Beratung
ÜBER OPEN KNOWLEDGE
#WISSENTEILEN
Wo ist das Problem?
#WISSENTEILEN
• User dreht das Device
• Verschiedene Displaygrößen und
Auflösungen
• Unterschiedliche Geräteklassen (iPhone,
iPad)
• Split View (iPad)
• Statusbar bei aktivem Anruf oder GPS
? Äußere Faktoren
Wo ist das Problem?
#WISSENTEILEN
• Angezeigter Content ändert die Größe
• Internationalisierung
• Dynamic Type
? Interne Faktoren
Lösung ?
#WISSENTEILEN
- (BOOL)shouldAutorotateToInterfaceOrientation:
(UIInterfaceOrientation)interfaceOrientation {
return (interfaceOrientation == UIInterfaceOrientationPortrait);
}
Lösung ?
#WISSENTEILEN
BOOL isIPhone = [[UIDevice currentDevice] userInterfaceIdiom] ==
UIUserInterfaceIdiomPhone;
BOOL isIPhone4 = isIPhone && ([[UIScreen mainScreen] bounds].size.height > 480.0);
BOOL isIPhone5 = isIPhone4 && ([[UIScreen mainScreen] bounds].size.height > 960.0);
BOOL isIPhone6 = isIPhone5 && ([[UIScreen mainScreen] bounds].size.height > 1136.0);
BOOL isIPhone6plus = isIPhone6 && ([[UIScreen mainScreen] bounds].size.height > 1334.0);
Autoresizing Masks
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
• Definiert das Resizing Verhalten einer View
• Relativ zur Superview
• Einstellung für
• Höhe und Breite
• Abstand zum Rand
• Mögliche Werte sind
• fixed
• flexible
Springs & Struts
#WISSENTEILEN
Springs & Struts
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
Autoresizing Masks
#WISSENTEILEN
#WISSENTEILEN
WTF?!?!
Autoresizing Masks
Probleme mit Autoresizing Masks
#WISSENTEILEN
• Autoresize wird automatisch berechnet,
kann nicht beinflusst werden
• Keine Beziehung zu Nachbar-Views
• Kann programmatisch korrigiert werden
• Großer Aufwand bei versch. Auflösungen
Auto Layout
Auto Layout to the rescue
#WISSENTEILEN
• Beziehung zwischen einzelnen Views
• Relative Größen und Positionen
• Design by intent
• „Mathematische“ Beschreibung
• Wird definiert durch Constraints
• Benötigt Constraints für Größe und Position
Auto Layout
#WISSENTEILEN
Auto Layout
#WISSENTEILEN
Auto Layout
#WISSENTEILEN
Auto Layout
#WISSENTEILEN
Auto Layout
#WISSENTEILEN
Auto Layout
#WISSENTEILEN
Trait variation aka Size Classes
#WISSENTEILEN
Auto Layout
#WISSENTEILEN
Auto Korrektur
#WISSENTEILEN
Auto Korrektur
#WISSENTEILEN
Auto Layout
#WISSENTEILEN
+
Auto Layout
#WISSENTEILEN
Ausrichtung
#WISSENTEILEN
Fehlerquellen
#WISSENTEILEN
Fehlerquellen
#WISSENTEILEN
Fehlerquellen
#WISSENTEILEN
2016-08-19 13:38:21.101780 AutoLayout[94041:23616079] [LayoutConstraints] Unable to simultaneously
satisfy constraints.
Probably at least one of the constraints in the following list is one you don't want.
Try this:
(1) look at each constraint and try to figure out which you don't expect;
(2) find the code that added the unwanted constraint or constraints and fix it.
(
"<NSLayoutConstraint:0x60000008b220 UIView:0x7f8ea0709c90.width == 288 (active)>"
)
Will attempt to recover by breaking constraint
Auto Layout
Fehlerquellen
#WISSENTEILEN
• So wenig Constraints wie möglich, so viele
Constraints wie nötig
• Fehler werden von Interface Builder nicht
immer erkannt
Auto Layout
Intrinsic Content Size
#WISSENTEILEN
• „Innere“ Größe
• Für bestimmte Controls wie z.B. Button oder
Label
• Control bestimmt seine Größe selbst
• Kann überschrieben werden
• Betrifft nur das Control selbst
Intrinsic Content Size
#WISSENTEILEN
Auto Layout
Compression Resistance
#WISSENTEILEN
• verhindert das View kleiner als Intrinsic
Content Size wird
• höhere Priorität verhindert, dass View sich
verkleinert
Auto Layout
Content Hugging
#WISSENTEILEN
• verhindert das View größer als Intrinsic
Content Size wird
• höhere Priorität verhindert, dass View wächst
Content Hugging und Compression Resistance
#WISSENTEILEN
Content Hugging und Compression Resistance
#WISSENTEILEN
Content Hugging und Compression Resistance
#WISSENTEILEN
Programmically Auto Layout
#WISSENTEILEN
NSLayoutConstraint(item: redView, attribute: .leading, relatedBy: .equal, toItem: blueView,
attribute: .trailing, multiplier: 1.0, constant: 8.0)
Programmically Auto Layout
#WISSENTEILEN
redView.leadingAnchor.constraint(equalTo: blueView.trailingAnchor, constant: 8.0)
Programmically Auto Layout
#WISSENTEILEN
let views = ["blueView" : blueView, "redView" : redView]
NSLayoutConstraint.constraints(withVisualFormat: "H:[blueView]-20-[redView]", options: [], metrics: nil, views: views)
#WISSENTEILEN
What‘s next?
Autoresizing Masks
#WISSENTEILEN
Auto Layout
Zusammenfassung
#WISSENTEILEN
• Beziehung zwischen einzelnen Views
• Relative Größen und Positionen
• Design by intent
• „Mathematische“ Beschreibung
• Wird definiert durch Constraints
• Benötigt Constraints für Größe und Position
FRAGEN
? ? ?
#WISSENTEILEN
Michael Kotten
Head of mobile development
michael.kotten@openknowledge.de
+49 (0)441 4082 – 0
OFFENKUNDIGGUT
KONTAKT
#WISSENTEILEN
Icons in this presentation designed by “Freepik”, “Nice and
Serious” and “Elegant Themes” from www.flaticon.com
BILDNACHWEISE
#WISSENTEILEN

Weitere ähnliche Inhalte

Was ist angesagt?

Der perfekte Microservice
Der perfekte MicroserviceDer perfekte Microservice
Der perfekte Microservice
OPEN KNOWLEDGE GmbH
 
Das passende Backend für meine Apps
Das passende Backend für meine AppsDas passende Backend für meine Apps
Das passende Backend für meine Apps
OPEN KNOWLEDGE GmbH
 
The Day after – nach dem Release ist vor dem Release
The Day after – nach dem Release ist vor dem ReleaseThe Day after – nach dem Release ist vor dem Release
The Day after – nach dem Release ist vor dem Release
OPEN KNOWLEDGE GmbH
 
Herausforderung „Multi-Channel Architecture”
Herausforderung „Multi-Channel Architecture”Herausforderung „Multi-Channel Architecture”
Herausforderung „Multi-Channel Architecture”
OPEN KNOWLEDGE GmbH
 
Microservices mit dem MicroProfile
Microservices mit dem MicroProfileMicroservices mit dem MicroProfile
Microservices mit dem MicroProfile
OPEN KNOWLEDGE GmbH
 
Less Server vs. Serverless?
Less Server vs. Serverless?Less Server vs. Serverless?
Less Server vs. Serverless?
OPEN KNOWLEDGE GmbH
 
Aus der Rubrik "Spaß mit Microservices": Transaktionen
Aus der Rubrik "Spaß mit Microservices": TransaktionenAus der Rubrik "Spaß mit Microservices": Transaktionen
Aus der Rubrik "Spaß mit Microservices": Transaktionen
OPEN KNOWLEDGE GmbH
 
Modern Lightweight Enterprise Architectures mit Java
Modern Lightweight Enterprise Architectures mit JavaModern Lightweight Enterprise Architectures mit Java
Modern Lightweight Enterprise Architectures mit Java
OPEN KNOWLEDGE GmbH
 
Die Matrix: Enterprise-Architekturen jenseits von Microservices
Die Matrix: Enterprise-Architekturen jenseits von MicroservicesDie Matrix: Enterprise-Architekturen jenseits von Microservices
Die Matrix: Enterprise-Architekturen jenseits von Microservices
OPEN KNOWLEDGE GmbH
 
Spaß mit Microservices: Transaktionen
Spaß mit Microservices: TransaktionenSpaß mit Microservices: Transaktionen
Spaß mit Microservices: Transaktionen
OPEN KNOWLEDGE GmbH
 
Web-API-Design jenseits von REST und Request/Response
Web-API-Design jenseits von REST und Request/ResponseWeb-API-Design jenseits von REST und Request/Response
Web-API-Design jenseits von REST und Request/Response
OPEN KNOWLEDGE GmbH
 
The Day after
The Day afterThe Day after
The Day after
OPEN KNOWLEDGE GmbH
 
Enterprise Java auf Diät
Enterprise Java auf DiätEnterprise Java auf Diät
Enterprise Java auf Diät
OPEN KNOWLEDGE GmbH
 
Microservices Architecture: Architektur und Patterns
Microservices Architecture: Architektur und PatternsMicroservices Architecture: Architektur und Patterns
Microservices Architecture: Architektur und Patterns
OPEN KNOWLEDGE GmbH
 
Shared Data in verteilten Systemen
Shared Data in verteilten SystemenShared Data in verteilten Systemen
Shared Data in verteilten Systemen
OPEN KNOWLEDGE GmbH
 
Web APIs jenseits von REST & Request/Response
Web APIs jenseits von REST & Request/ResponseWeb APIs jenseits von REST & Request/Response
Web APIs jenseits von REST & Request/Response
OPEN KNOWLEDGE GmbH
 
Cloud Architekturen - von "less Server" zu Serverless
Cloud Architekturen - von "less Server" zu ServerlessCloud Architekturen - von "less Server" zu Serverless
Cloud Architekturen - von "less Server" zu Serverless
OPEN KNOWLEDGE GmbH
 
Mobile- & Offline-First: Mehr als nur Buzzword-Bingo
Mobile- & Offline-First: Mehr als nur Buzzword-BingoMobile- & Offline-First: Mehr als nur Buzzword-Bingo
Mobile- & Offline-First: Mehr als nur Buzzword-Bingo
OPEN KNOWLEDGE GmbH
 
Mehr Sicherheit durch Automatisierung
Mehr Sicherheit durch AutomatisierungMehr Sicherheit durch Automatisierung
Mehr Sicherheit durch Automatisierung
OPEN KNOWLEDGE GmbH
 
Mobile Ideation aka "Der mobile Mehrwert"
Mobile Ideation aka "Der mobile Mehrwert"Mobile Ideation aka "Der mobile Mehrwert"
Mobile Ideation aka "Der mobile Mehrwert"
OPEN KNOWLEDGE GmbH
 

Was ist angesagt? (20)

Der perfekte Microservice
Der perfekte MicroserviceDer perfekte Microservice
Der perfekte Microservice
 
Das passende Backend für meine Apps
Das passende Backend für meine AppsDas passende Backend für meine Apps
Das passende Backend für meine Apps
 
The Day after – nach dem Release ist vor dem Release
The Day after – nach dem Release ist vor dem ReleaseThe Day after – nach dem Release ist vor dem Release
The Day after – nach dem Release ist vor dem Release
 
Herausforderung „Multi-Channel Architecture”
Herausforderung „Multi-Channel Architecture”Herausforderung „Multi-Channel Architecture”
Herausforderung „Multi-Channel Architecture”
 
Microservices mit dem MicroProfile
Microservices mit dem MicroProfileMicroservices mit dem MicroProfile
Microservices mit dem MicroProfile
 
Less Server vs. Serverless?
Less Server vs. Serverless?Less Server vs. Serverless?
Less Server vs. Serverless?
 
Aus der Rubrik "Spaß mit Microservices": Transaktionen
Aus der Rubrik "Spaß mit Microservices": TransaktionenAus der Rubrik "Spaß mit Microservices": Transaktionen
Aus der Rubrik "Spaß mit Microservices": Transaktionen
 
Modern Lightweight Enterprise Architectures mit Java
Modern Lightweight Enterprise Architectures mit JavaModern Lightweight Enterprise Architectures mit Java
Modern Lightweight Enterprise Architectures mit Java
 
Die Matrix: Enterprise-Architekturen jenseits von Microservices
Die Matrix: Enterprise-Architekturen jenseits von MicroservicesDie Matrix: Enterprise-Architekturen jenseits von Microservices
Die Matrix: Enterprise-Architekturen jenseits von Microservices
 
Spaß mit Microservices: Transaktionen
Spaß mit Microservices: TransaktionenSpaß mit Microservices: Transaktionen
Spaß mit Microservices: Transaktionen
 
Web-API-Design jenseits von REST und Request/Response
Web-API-Design jenseits von REST und Request/ResponseWeb-API-Design jenseits von REST und Request/Response
Web-API-Design jenseits von REST und Request/Response
 
The Day after
The Day afterThe Day after
The Day after
 
Enterprise Java auf Diät
Enterprise Java auf DiätEnterprise Java auf Diät
Enterprise Java auf Diät
 
Microservices Architecture: Architektur und Patterns
Microservices Architecture: Architektur und PatternsMicroservices Architecture: Architektur und Patterns
Microservices Architecture: Architektur und Patterns
 
Shared Data in verteilten Systemen
Shared Data in verteilten SystemenShared Data in verteilten Systemen
Shared Data in verteilten Systemen
 
Web APIs jenseits von REST & Request/Response
Web APIs jenseits von REST & Request/ResponseWeb APIs jenseits von REST & Request/Response
Web APIs jenseits von REST & Request/Response
 
Cloud Architekturen - von "less Server" zu Serverless
Cloud Architekturen - von "less Server" zu ServerlessCloud Architekturen - von "less Server" zu Serverless
Cloud Architekturen - von "less Server" zu Serverless
 
Mobile- & Offline-First: Mehr als nur Buzzword-Bingo
Mobile- & Offline-First: Mehr als nur Buzzword-BingoMobile- & Offline-First: Mehr als nur Buzzword-Bingo
Mobile- & Offline-First: Mehr als nur Buzzword-Bingo
 
Mehr Sicherheit durch Automatisierung
Mehr Sicherheit durch AutomatisierungMehr Sicherheit durch Automatisierung
Mehr Sicherheit durch Automatisierung
 
Mobile Ideation aka "Der mobile Mehrwert"
Mobile Ideation aka "Der mobile Mehrwert"Mobile Ideation aka "Der mobile Mehrwert"
Mobile Ideation aka "Der mobile Mehrwert"
 

Andere mochten auch

Autolayout primer
Autolayout primerAutolayout primer
Autolayout primer
Inferis
 
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Derek Lee Boire
 
Core data basic Workshop slides NSSpain 2013
Core data basic Workshop slides NSSpain 2013Core data basic Workshop slides NSSpain 2013
Core data basic Workshop slides NSSpain 2013
Diego Freniche Brito
 
Practical auto layout
Practical auto layoutPractical auto layout
Practical auto layout
Inferis
 
Zehn Jahre JPA – Architekturkonzepte und Best Practices revisited
Zehn Jahre JPA – Architekturkonzepte und Best Practices revisitedZehn Jahre JPA – Architekturkonzepte und Best Practices revisited
Zehn Jahre JPA – Architekturkonzepte und Best Practices revisited
OPEN KNOWLEDGE GmbH
 
Intro to Core Data
Intro to Core DataIntro to Core Data
Intro to Core Data
Make School
 
Authentication and Authorization
Authentication and AuthorizationAuthentication and Authorization
Authentication and Authorization
TechMaster Vietnam
 
Postgresql các vấn đề thực tế
Postgresql các vấn đề thực tếPostgresql các vấn đề thực tế
Postgresql các vấn đề thực tế
TechMaster Vietnam
 
Auto Layout part 1
Auto Layout part 1Auto Layout part 1
Auto Layout part 1
Liyao Chen
 
Knex Postgresql Migration
Knex Postgresql MigrationKnex Postgresql Migration
Knex Postgresql Migration
TechMaster Vietnam
 
Postgresql security
Postgresql securityPostgresql security
Postgresql security
TechMaster Vietnam
 

Andere mochten auch (11)

Autolayout primer
Autolayout primerAutolayout primer
Autolayout primer
 
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
 
Core data basic Workshop slides NSSpain 2013
Core data basic Workshop slides NSSpain 2013Core data basic Workshop slides NSSpain 2013
Core data basic Workshop slides NSSpain 2013
 
Practical auto layout
Practical auto layoutPractical auto layout
Practical auto layout
 
Zehn Jahre JPA – Architekturkonzepte und Best Practices revisited
Zehn Jahre JPA – Architekturkonzepte und Best Practices revisitedZehn Jahre JPA – Architekturkonzepte und Best Practices revisited
Zehn Jahre JPA – Architekturkonzepte und Best Practices revisited
 
Intro to Core Data
Intro to Core DataIntro to Core Data
Intro to Core Data
 
Authentication and Authorization
Authentication and AuthorizationAuthentication and Authorization
Authentication and Authorization
 
Postgresql các vấn đề thực tế
Postgresql các vấn đề thực tếPostgresql các vấn đề thực tế
Postgresql các vấn đề thực tế
 
Auto Layout part 1
Auto Layout part 1Auto Layout part 1
Auto Layout part 1
 
Knex Postgresql Migration
Knex Postgresql MigrationKnex Postgresql Migration
Knex Postgresql Migration
 
Postgresql security
Postgresql securityPostgresql security
Postgresql security
 

Ähnlich wie iOS: einheitliche Oberflächen mit Auto Layout

Qooxdoo 0.8 - Das Neue Gui Toolkit
Qooxdoo 0.8 - Das Neue Gui ToolkitQooxdoo 0.8 - Das Neue Gui Toolkit
Qooxdoo 0.8 - Das Neue Gui Toolkit
Fabian Jakobs
 
Microservices Migration: Vom Monolithen zu Microservices
Microservices Migration: Vom Monolithen zu MicroservicesMicroservices Migration: Vom Monolithen zu Microservices
Microservices Migration: Vom Monolithen zu Microservices
OPEN KNOWLEDGE GmbH
 
Offline-first Architekturen: Wer bitte braucht schon Internet
Offline-first Architekturen: Wer bitte braucht schon InternetOffline-first Architekturen: Wer bitte braucht schon Internet
Offline-first Architekturen: Wer bitte braucht schon Internet
OPEN KNOWLEDGE GmbH
 
Hilfe, ich will meinen Monolithen zurück!
Hilfe, ich will meinen Monolithen zurück!Hilfe, ich will meinen Monolithen zurück!
Hilfe, ich will meinen Monolithen zurück!
OPEN KNOWLEDGE GmbH
 
Java EE meets Microservices: MicroProfile 2.x to the Rescue
Java EE meets Microservices: MicroProfile 2.x to the RescueJava EE meets Microservices: MicroProfile 2.x to the Rescue
Java EE meets Microservices: MicroProfile 2.x to the Rescue
OPEN KNOWLEDGE GmbH
 
WP Camp 2012 Mobile First & Wordpress
WP Camp 2012 Mobile First & WordpressWP Camp 2012 Mobile First & Wordpress
WP Camp 2012 Mobile First & Wordpress
KirstenSchelper
 
Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.
GFU Cyrus AG
 

Ähnlich wie iOS: einheitliche Oberflächen mit Auto Layout (7)

Qooxdoo 0.8 - Das Neue Gui Toolkit
Qooxdoo 0.8 - Das Neue Gui ToolkitQooxdoo 0.8 - Das Neue Gui Toolkit
Qooxdoo 0.8 - Das Neue Gui Toolkit
 
Microservices Migration: Vom Monolithen zu Microservices
Microservices Migration: Vom Monolithen zu MicroservicesMicroservices Migration: Vom Monolithen zu Microservices
Microservices Migration: Vom Monolithen zu Microservices
 
Offline-first Architekturen: Wer bitte braucht schon Internet
Offline-first Architekturen: Wer bitte braucht schon InternetOffline-first Architekturen: Wer bitte braucht schon Internet
Offline-first Architekturen: Wer bitte braucht schon Internet
 
Hilfe, ich will meinen Monolithen zurück!
Hilfe, ich will meinen Monolithen zurück!Hilfe, ich will meinen Monolithen zurück!
Hilfe, ich will meinen Monolithen zurück!
 
Java EE meets Microservices: MicroProfile 2.x to the Rescue
Java EE meets Microservices: MicroProfile 2.x to the RescueJava EE meets Microservices: MicroProfile 2.x to the Rescue
Java EE meets Microservices: MicroProfile 2.x to the Rescue
 
WP Camp 2012 Mobile First & Wordpress
WP Camp 2012 Mobile First & WordpressWP Camp 2012 Mobile First & Wordpress
WP Camp 2012 Mobile First & Wordpress
 
Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.Cross-Apps-Entwicklung für iPhone, Android und Co.
Cross-Apps-Entwicklung für iPhone, Android und Co.
 

Mehr von OPEN KNOWLEDGE GmbH

Warum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AI
Warum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AIWarum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AI
Warum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AI
OPEN KNOWLEDGE GmbH
 
Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...
Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...
Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...
OPEN KNOWLEDGE GmbH
 
From Zero to still Zero: Die schönsten Fehler auf dem Weg in die Cloud
From Zero to still Zero: Die schönsten Fehler auf dem Weg in die CloudFrom Zero to still Zero: Die schönsten Fehler auf dem Weg in die Cloud
From Zero to still Zero: Die schönsten Fehler auf dem Weg in die Cloud
OPEN KNOWLEDGE GmbH
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)
OPEN KNOWLEDGE GmbH
 
FEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data Imputation
FEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data ImputationFEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data Imputation
FEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data Imputation
OPEN KNOWLEDGE GmbH
 
Nie wieder Log-Files!
Nie wieder Log-Files!Nie wieder Log-Files!
Nie wieder Log-Files!
OPEN KNOWLEDGE GmbH
 
Cloud-native and Enterprise Java? Hold my beer!
Cloud-native and Enterprise Java? Hold my beer!Cloud-native and Enterprise Java? Hold my beer!
Cloud-native and Enterprise Java? Hold my beer!
OPEN KNOWLEDGE GmbH
 
From Zero to still Zero: The most beautiful mistakes going into the cloud.
From Zero to still Zero: The most beautiful mistakes going into the cloud. From Zero to still Zero: The most beautiful mistakes going into the cloud.
From Zero to still Zero: The most beautiful mistakes going into the cloud.
OPEN KNOWLEDGE GmbH
 
API Expand Contract
API Expand ContractAPI Expand Contract
API Expand Contract
OPEN KNOWLEDGE GmbH
 
Ready for the Future: Jakarta EE in Zeiten von Cloud Native & Co
Ready for the Future: Jakarta EE in Zeiten von Cloud Native & CoReady for the Future: Jakarta EE in Zeiten von Cloud Native & Co
Ready for the Future: Jakarta EE in Zeiten von Cloud Native & Co
OPEN KNOWLEDGE GmbH
 
Shared Data in verteilten Architekturen
Shared Data in verteilten ArchitekturenShared Data in verteilten Architekturen
Shared Data in verteilten Architekturen
OPEN KNOWLEDGE GmbH
 
Machine Learning mit TensorFlow.js
Machine Learning mit TensorFlow.jsMachine Learning mit TensorFlow.js
Machine Learning mit TensorFlow.js
OPEN KNOWLEDGE GmbH
 
KI und Architektur
KI und ArchitekturKI und Architektur
KI und Architektur
OPEN KNOWLEDGE GmbH
 
It's not Rocket Science: Neuronale Netze
It's not Rocket Science: Neuronale NetzeIt's not Rocket Science: Neuronale Netze
It's not Rocket Science: Neuronale Netze
OPEN KNOWLEDGE GmbH
 
Business-Mehrwert durch KI
Business-Mehrwert durch KIBusiness-Mehrwert durch KI
Business-Mehrwert durch KI
OPEN KNOWLEDGE GmbH
 
API-Design, Microarchitecture und Testing
API-Design, Microarchitecture und TestingAPI-Design, Microarchitecture und Testing
API-Design, Microarchitecture und Testing
OPEN KNOWLEDGE GmbH
 
Supersonic Java für die Cloud: Quarkus
Supersonic Java für die Cloud: QuarkusSupersonic Java für die Cloud: Quarkus
Supersonic Java für die Cloud: Quarkus
OPEN KNOWLEDGE GmbH
 
Das ist doch alles nur Frontend - Wer braucht da schon Architektur?
Das ist doch alles nur Frontend - Wer braucht da schon Architektur?Das ist doch alles nur Frontend - Wer braucht da schon Architektur?
Das ist doch alles nur Frontend - Wer braucht da schon Architektur?
OPEN KNOWLEDGE GmbH
 
Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“
Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“
Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“
OPEN KNOWLEDGE GmbH
 
Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...
Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...
Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...
OPEN KNOWLEDGE GmbH
 

Mehr von OPEN KNOWLEDGE GmbH (20)

Warum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AI
Warum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AIWarum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AI
Warum der Computer "Nein" sagt - Mehr Nachvollziehbarkeit dank Explainable AI
 
Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...
Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...
Machine Learning? Ja gerne! Aber was und wie? Eine Kurzanleitung für den erfo...
 
From Zero to still Zero: Die schönsten Fehler auf dem Weg in die Cloud
From Zero to still Zero: Die schönsten Fehler auf dem Weg in die CloudFrom Zero to still Zero: Die schönsten Fehler auf dem Weg in die Cloud
From Zero to still Zero: Die schönsten Fehler auf dem Weg in die Cloud
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)
 
FEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data Imputation
FEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data ImputationFEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data Imputation
FEHLENDE DATEN? (K)EIN PROBLEM!: Die Kunst der Data Imputation
 
Nie wieder Log-Files!
Nie wieder Log-Files!Nie wieder Log-Files!
Nie wieder Log-Files!
 
Cloud-native and Enterprise Java? Hold my beer!
Cloud-native and Enterprise Java? Hold my beer!Cloud-native and Enterprise Java? Hold my beer!
Cloud-native and Enterprise Java? Hold my beer!
 
From Zero to still Zero: The most beautiful mistakes going into the cloud.
From Zero to still Zero: The most beautiful mistakes going into the cloud. From Zero to still Zero: The most beautiful mistakes going into the cloud.
From Zero to still Zero: The most beautiful mistakes going into the cloud.
 
API Expand Contract
API Expand ContractAPI Expand Contract
API Expand Contract
 
Ready for the Future: Jakarta EE in Zeiten von Cloud Native & Co
Ready for the Future: Jakarta EE in Zeiten von Cloud Native & CoReady for the Future: Jakarta EE in Zeiten von Cloud Native & Co
Ready for the Future: Jakarta EE in Zeiten von Cloud Native & Co
 
Shared Data in verteilten Architekturen
Shared Data in verteilten ArchitekturenShared Data in verteilten Architekturen
Shared Data in verteilten Architekturen
 
Machine Learning mit TensorFlow.js
Machine Learning mit TensorFlow.jsMachine Learning mit TensorFlow.js
Machine Learning mit TensorFlow.js
 
KI und Architektur
KI und ArchitekturKI und Architektur
KI und Architektur
 
It's not Rocket Science: Neuronale Netze
It's not Rocket Science: Neuronale NetzeIt's not Rocket Science: Neuronale Netze
It's not Rocket Science: Neuronale Netze
 
Business-Mehrwert durch KI
Business-Mehrwert durch KIBusiness-Mehrwert durch KI
Business-Mehrwert durch KI
 
API-Design, Microarchitecture und Testing
API-Design, Microarchitecture und TestingAPI-Design, Microarchitecture und Testing
API-Design, Microarchitecture und Testing
 
Supersonic Java für die Cloud: Quarkus
Supersonic Java für die Cloud: QuarkusSupersonic Java für die Cloud: Quarkus
Supersonic Java für die Cloud: Quarkus
 
Das ist doch alles nur Frontend - Wer braucht da schon Architektur?
Das ist doch alles nur Frontend - Wer braucht da schon Architektur?Das ist doch alles nur Frontend - Wer braucht da schon Architektur?
Das ist doch alles nur Frontend - Wer braucht da schon Architektur?
 
Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“
Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“
Auf geht‘s in die Cloud: „Das kann doch nicht so schwer sein!“
 
Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...
Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...
Das Product Goal oder "Ohne Ziele laufen eben alle in die Richtung, die ihnen...
 

iOS: einheitliche Oberflächen mit Auto Layout

Hinweis der Redaktion

  1. Nur Portrait
  2. Apples Lösung für verschiedene Screens und Orientierungen seit iOS 2 bis iOS 6 heisst AutoResizing Masks.
  3. Strut = Strebe Abstand zum Rand, auch Margin
  4. Höhe und Breite der View
  5. Wir haben hier unsere tolle App
  6. So soll die App aussehen
  7. So siehts leider aus! Was machen wir jetzt?
  8. Vorher für alle drei Views
  9. Oben links
  10. Oben rechts usw.
  11. So siehts jetzt aus.
  12. Was ist jetzt passiert?
  13. Intent = Absicht When you design by intent, you’re expressing what you want to accomplish but not necessarily how it should be accomplished Oberfläche beschreiben
  14. Beispiel für die Berechnung
  15. Attribute die verwendet werden können auf der rechten Seite der Formel Not an attribute ist der Wert der genutzt wird bei festen Grössen. view.height = 1.0 * Not An Attribute + 30
  16. Gleiche Breite für beide Views
  17. Abstand zwischen linker und rechter View. Die restlichen Constraints erklären! untere View: Abstand links, rechts und unten zu Super view, oben zu linker oder rechter View Obere views: oberer Abstand zu Super view Gleiche Höhe für alle Views Wenn nicht alle nötigen Constraints gesetzt sind -> Fehler!
  18. So solls am Ende aussehen.
  19. Platz nach oben normal
  20. Zum testen können hier die verschiedenen Device Typen durchprobiert werden
  21. Die Views müssen nicht nach den Constraints gezeichnet werden
  22. Update Frames passt die Views an. Update constraints passt die Constraints an
  23. Autoresizing masks einstellung
  24. Auto Layout einstellung
  25. Links und unten an der linken seite ausrichten, alternative zu leading space. Vorteil: nur ein Constraint muss geändert werden.
  26. Die Berechung muss am Ende immer X, Y, Höhe und Breite ergeben.
  27. Zu viele Constraints, entweder Breite fixed oder Abstand zum Rand
  28. Teilweise werden Fehler erst durch andere Bedingungen sichtbar, z.B. neuer Content oder andere Sprache => TESTEN
  29. Grundprinzipien von Auto Layout sind jetzt klar
  30. Zwei Views die sich automatisch an die Größe ihres Inhalts anpassen. Was passiert wenn die blaue View größer wird?
  31. Intent = Absicht When you design by intent, you’re expressing what you want to accomplish but not necessarily how it should be accomplished Oberfläche beschreiben
  32. Intent = Absicht When you design by intent, you’re expressing what you want to accomplish but not necessarily how it should be accomplished Oberfläche beschreiben
  33. sieht fast aus wie die Formel
  34. sieht noch natürlicher aus
  35. Bei vielen Constraints kann man auch per Visual Format Language Constraints definieren.
  36. Mit Xcode 8 werden wieder Autoresizing Masks eingeführt. Parallel mit Auto Layout nutzbar
  37. Intent = Absicht When you design by intent, you’re expressing what you want to accomplish but not necessarily how it should be accomplished Oberfläche beschreiben