[ProgressView] Address progress view example problems with safe area …

…insets and impr… (#4895) Addressing clipping of progress views on iPhone X as well as improper alignment on iOS 12. Closes #4785 Closes #3718 "Before" pic for both issues: ![image](https://user-images.githubusercontent.com/2329102/44110190-183a476e-9fcd-11e8-86ae-59e9de787e76.png) "After" pics for both issues: ![simulator screen shot - iphone x - 2018-08-24 at 16 19 50](https://user-images.githubusercontent.com/8020010/44606294-988e0500-a7ba-11e8-83d8-0444f3d95f38.png) ![simulator screen shot - iphone x - 2018-08-24 at 16 19 46](https://user-images.githubusercontent.com/8020010/44606295-988e0500-a7ba-11e8-9dda-2e131ec194d4.png)
material-components · Aug 31, 2018 · 19372e3 · 19372e3
1 parent 349c191
commit 19372e3
Showing 1 changed file with 43 additions and 17 deletions.
diff --git a/components/ProgressView/examples/ProgressViewExample.m b/components/ProgressView/examples/ProgressViewExample.m
@@ -25,6 +25,8 @@
 
 @interface ProgressViewExample : UIViewController
 
+@property(nonatomic, strong) UIView *container;
+
 @property(nonatomic, strong) MDCProgressView *stockProgressView;
 @property(nonatomic, strong) UILabel *stockProgressLabel;
 
@@ -50,13 +52,13 @@ @implementation ProgressViewExample
 - (void)setupProgressViews {
   _stockProgressView = [[MDCProgressView alloc] init];
   _stockProgressView.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_stockProgressView];
+  [self.container addSubview:_stockProgressView];
   // Hide the progress view at setup time.
   _stockProgressView.hidden = YES;
 
   _tintedProgressView = [[MDCProgressView alloc] init];
   _tintedProgressView.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_tintedProgressView];
+  [self.container addSubview:_tintedProgressView];
   _tintedProgressView.progressTintColor = self.colorScheme.primaryColor;
   _tintedProgressView.trackTintColor =
       [self.colorScheme.primaryColor colorWithAlphaComponent:(CGFloat)0.24];
@@ -65,23 +67,23 @@ - (void)setupProgressViews {
 
   _fullyColoredProgressView = [[MDCProgressView alloc] init];
   _fullyColoredProgressView.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_fullyColoredProgressView];
+  [self.container addSubview:_fullyColoredProgressView];
   _fullyColoredProgressView.progressTintColor = MDCPalette.greenPalette.tint500;
   _fullyColoredProgressView.trackTintColor = MDCPalette.yellowPalette.tint500;
   // Hide the progress view at setup time.
   _fullyColoredProgressView.hidden = YES;
 
   _backwardProgressResetView = [[MDCProgressView alloc] init];
   _backwardProgressResetView.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_backwardProgressResetView];
+  [self.container addSubview:_backwardProgressResetView];
   // Have a non-zero progress at setup time.
   _backwardProgressResetView.progress = 0.33f;
 
   _backwardProgressAnimateView = [[MDCProgressView alloc] init];
   _backwardProgressAnimateView.translatesAutoresizingMaskIntoConstraints = NO;
   _backwardProgressAnimateView.backwardProgressAnimationMode =
       MDCProgressViewBackwardAnimationModeAnimate;
-  [self.view addSubview:_backwardProgressAnimateView];
+  [self.container addSubview:_backwardProgressAnimateView];
   // Have a non-zero progress at setup time.
   _backwardProgressAnimateView.progress = 0.33f;
 }
@@ -107,6 +109,7 @@ - (void)viewDidLoad {
   self.title = @"Progress View";
   self.view.backgroundColor = self.colorScheme.backgroundColor;
 
+  [self setupContainer];
   [self setupProgressViews];
   [self setupLabels];
   [self setupConstraints];
@@ -119,45 +122,67 @@ - (void)viewDidLoad {
   self.navigationItem.rightBarButtonItem.accessibilityIdentifier = @"animate_button";
 }
 
+-(void)viewDidLayoutSubviews {
+  [super viewDidLayoutSubviews];
+  [self positionContainer];
+}
+
+-(void)setupContainer {
+  self.container = [[UIView alloc] initWithFrame:self.view.bounds];
+  [self.view addSubview:self.container];
+}
+
+- (void)positionContainer {
+  CGFloat originX = CGRectGetMinX(self.view.bounds) + self.view.layoutMargins.left;
+  CGFloat originY = CGRectGetMinY(self.view.bounds) + self.view.layoutMargins.top;
+  CGFloat width = self.view.bounds.size.width
+      - (self.view.layoutMargins.left + self.view.layoutMargins.right);
+  CGFloat height = self.view.bounds.size.height
+      - (self.view.layoutMargins.top + self.view.layoutMargins.bottom);
+  CGRect frame = CGRectMake(originX, originY, width, height);
+  self.container.frame = frame;
+}
+
 - (void)setupLabels {
   _stockProgressLabel = [[UILabel alloc] init];
   _stockProgressLabel.text = @"Progress";
   _stockProgressLabel.font = self.typographyScheme.caption;
   _stockProgressLabel.textColor = self.colorScheme.onBackgroundColor;
   _stockProgressLabel.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_stockProgressLabel];
+  [self.container addSubview:_stockProgressLabel];
 
   _tintedProgressLabel = [[UILabel alloc] init];
   _tintedProgressLabel.text = @"Progress with progress tint";
   _tintedProgressLabel.font = self.typographyScheme.caption;
   _tintedProgressLabel.textColor = self.colorScheme.onBackgroundColor;
   _tintedProgressLabel.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_tintedProgressLabel];
+  [self.container addSubview:_tintedProgressLabel];
 
   _fullyColoredProgressLabel = [[UILabel alloc] init];
   _fullyColoredProgressLabel.text = @"Progress with custom colors";
   _fullyColoredProgressLabel.font = self.typographyScheme.caption;
   _fullyColoredProgressLabel.textColor = self.colorScheme.onBackgroundColor;
   _fullyColoredProgressLabel.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_fullyColoredProgressLabel];
+  [self.container addSubview:_fullyColoredProgressLabel];
 
   _backwardProgressResetLabel = [[UILabel alloc] init];
   _backwardProgressResetLabel.text = @"Backward progress (reset)";
   _backwardProgressResetLabel.font = self.typographyScheme.caption;
   _backwardProgressResetLabel.textColor = self.colorScheme.onBackgroundColor;
   _backwardProgressResetLabel.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_backwardProgressResetLabel];
+  [self.container addSubview:_backwardProgressResetLabel];
 
   _backwardProgressAnimateLabel = [[UILabel alloc] init];
   _backwardProgressAnimateLabel.text = @"Backward progress (animate)";
   _backwardProgressAnimateLabel.font = self.typographyScheme.caption;
   _backwardProgressAnimateLabel.textColor = self.colorScheme.onBackgroundColor;
   _backwardProgressAnimateLabel.translatesAutoresizingMaskIntoConstraints = NO;
-  [self.view addSubview:_backwardProgressAnimateLabel];
+  [self.container addSubview:_backwardProgressAnimateLabel];
 }
 
 - (void)setupConstraints {
   NSDictionary *views = @{
+    @"container" : _container,
     @"stockView" : _stockProgressView,
     @"stockLabel" : _stockProgressLabel,
     @"tintedView" : _tintedProgressView,
@@ -170,13 +195,14 @@ - (void)setupConstraints {
     @"backwardAnimateLabel" : _backwardProgressAnimateLabel,
   };
   NSDictionary *metrics = @{
-    @"p" : @20,
+    @"t" : @20,
+    @"p" : @0,
     @"s" : @40,
     @"h" : @2,
   };
 
   NSArray *verticalConstraints = [NSLayoutConstraint
-      constraintsWithVisualFormat:@"V:|-(p)-"
+      constraintsWithVisualFormat:@"V:|-(t)-"
                                    "[stockView(==h)]-(p)-[stockLabel]-(s)-"
                                    "[tintedView(==h)]-(p)-[tintedLabel]-(s)-"
                                    "[coloredView(==h)]-(p)-[coloredLabel]-(s)-"
@@ -194,11 +220,11 @@ - (void)setupConstraints {
     @"H:|-(p)-[coloredView]-(p)-|",
     @"H:|-(p)-[backwardResetView]-(p)-|",
     @"H:|-(p)-[backwardAnimateView]-(p)-|",
-    @"H:|-(>=p)-[stockLabel]-(>=p)-|",
-    @"H:|-(>=p)-[tintedLabel]-(>=p)-|",
-    @"H:|-(>=p)-[coloredLabel]-(>=p)-|",
-    @"H:|-(>=p)-[backwardResetLabel]-(>=p)-|",
-    @"H:|-(>=p)-[backwardAnimateLabel]-(>=p)-|",
+    @"H:|-(p)-[stockLabel]-(p)-|",
+    @"H:|-(p)-[tintedLabel]-(p)-|",
+    @"H:|-(p)-[coloredLabel]-(p)-|",
+    @"H:|-(p)-[backwardResetLabel]-(p)-|",
+    @"H:|-(p)-[backwardAnimateLabel]-(p)-|",
   ];
   for (NSString *format in horizontalVisualFormats) {
     [horizontalConstraints