mirror of
https://github.com/material-components/material-components-ios.git
synced 2026-02-20 08:27:32 +08:00
294 lines
13 KiB
Objective-C
294 lines
13 KiB
Objective-C
// Copyright 2016-present the Material Components for iOS authors. All Rights Reserved.
|
|
//
|
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
|
// you may not use this file except in compliance with the License.
|
|
// You may obtain a copy of the License at
|
|
//
|
|
// http://www.apache.org/licenses/LICENSE-2.0
|
|
//
|
|
// Unless required by applicable law or agreed to in writing, software
|
|
// distributed under the License is distributed on an "AS IS" BASIS,
|
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
// See the License for the specific language governing permissions and
|
|
// limitations under the License.
|
|
|
|
#import <UIKit/UIKit.h>
|
|
|
|
#import "ShadowElevationsPointsLabel.h"
|
|
|
|
#import "MaterialMath.h"
|
|
#import "MaterialShadowElevations.h"
|
|
#import "MaterialSlider.h"
|
|
|
|
static NSString *const kDefaultShadowElevationLabelString = @"";
|
|
|
|
static const CGFloat kShadowElevationLabelTopOffset = 0;
|
|
static const CGFloat kShadowElevationLabelHeight = 70;
|
|
static const CGFloat kShadowElevationsDefault = 8;
|
|
static const CGFloat kShadowElevationsMax = 24;
|
|
static const CGFloat kShadowElevationsSliderFrameHeight = 27;
|
|
static const CGFloat kShadowElevationsSliderFrameMargin = 20;
|
|
static const CGFloat kShadowElevationsElementSpace = 20;
|
|
static const CGFloat kShadowElevationsPaperDimRange = 130;
|
|
static const CGFloat kShadowElevationsPaperBottomMargin = 20;
|
|
|
|
@interface ShadowElevationsPointsView : UIView <MDCSliderDelegate>
|
|
|
|
@property(nonatomic) ShadowElevationsPointsLabel *paper;
|
|
@property(nonatomic) UILabel *elevationLabel;
|
|
@property(nonatomic) MDCSlider *sliderControl;
|
|
|
|
@end
|
|
|
|
@implementation ShadowElevationsPointsView
|
|
|
|
- (id)initWithFrame:(CGRect)frame {
|
|
self = [super initWithFrame:frame];
|
|
if (self) {
|
|
self.backgroundColor = [UIColor whiteColor];
|
|
|
|
// Add label
|
|
_elevationLabel =
|
|
[[UILabel alloc] initWithFrame:CGRectMake(0, kShadowElevationLabelTopOffset,
|
|
frame.size.width, kShadowElevationLabelHeight)];
|
|
_elevationLabel.textAlignment = NSTextAlignmentCenter;
|
|
_elevationLabel.text =
|
|
[[self class] elevationStringForShadowElevationValue:kShadowElevationsDefault];
|
|
[self addSubview:_elevationLabel];
|
|
|
|
// Add slider control
|
|
self.sliderControl = [[MDCSlider alloc] initWithFrame:CGRectZero];
|
|
self.sliderControl.numberOfDiscreteValues = (NSUInteger)kShadowElevationsMax + 1;
|
|
self.sliderControl.maximumValue = kShadowElevationsMax;
|
|
self.sliderControl.value = kShadowElevationsDefault;
|
|
self.sliderControl.delegate = self;
|
|
self.sliderControl.translatesAutoresizingMaskIntoConstraints = NO;
|
|
self.sliderControl.accessibilityLabel = @"Displayed shadow elevation";
|
|
[self.sliderControl addTarget:self
|
|
action:@selector(sliderValueChanged:)
|
|
forControlEvents:UIControlEventValueChanged];
|
|
[self addSubview:self.sliderControl];
|
|
|
|
[NSLayoutConstraint constraintWithItem:self.sliderControl
|
|
attribute:NSLayoutAttributeTop
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:_elevationLabel
|
|
attribute:NSLayoutAttributeBottom
|
|
multiplier:1.0
|
|
constant:kShadowElevationsElementSpace]
|
|
.active = YES;
|
|
[NSLayoutConstraint constraintWithItem:self.sliderControl
|
|
attribute:NSLayoutAttributeHeight
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:nil
|
|
attribute:NSLayoutAttributeNotAnAttribute
|
|
multiplier:1.0
|
|
constant:kShadowElevationsSliderFrameHeight]
|
|
.active = YES;
|
|
[NSLayoutConstraint constraintWithItem:self.sliderControl
|
|
attribute:NSLayoutAttributeLeftMargin
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self
|
|
attribute:NSLayoutAttributeLeftMargin
|
|
multiplier:1.0
|
|
constant:kShadowElevationsSliderFrameMargin]
|
|
.active = YES;
|
|
[NSLayoutConstraint constraintWithItem:self.sliderControl
|
|
attribute:NSLayoutAttributeRightMargin
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self
|
|
attribute:NSLayoutAttributeRightMargin
|
|
multiplier:1.0
|
|
constant:-kShadowElevationsSliderFrameMargin]
|
|
.active = YES;
|
|
|
|
// Add paper
|
|
_paper = [[ShadowElevationsPointsLabel alloc] initWithFrame:CGRectZero];
|
|
_paper.translatesAutoresizingMaskIntoConstraints = NO;
|
|
_paper.textAlignment = NSTextAlignmentCenter;
|
|
_paper.text = [NSString stringWithFormat:@"%ld pt", (long)kShadowElevationsDefault];
|
|
_paper.elevation = kShadowElevationsDefault;
|
|
[self addSubview:_paper];
|
|
[NSLayoutConstraint constraintWithItem:_paper
|
|
attribute:NSLayoutAttributeCenterX
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self
|
|
attribute:NSLayoutAttributeCenterX
|
|
multiplier:1.0
|
|
constant:0]
|
|
.active = YES;
|
|
[NSLayoutConstraint constraintWithItem:_paper
|
|
attribute:NSLayoutAttributeTop
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self.sliderControl
|
|
attribute:NSLayoutAttributeBottom
|
|
multiplier:1.0
|
|
constant:kShadowElevationsElementSpace]
|
|
.active = YES;
|
|
[NSLayoutConstraint constraintWithItem:_paper
|
|
attribute:NSLayoutAttributeBottom
|
|
relatedBy:NSLayoutRelationLessThanOrEqual
|
|
toItem:self
|
|
attribute:NSLayoutAttributeBottom
|
|
multiplier:1.0
|
|
constant:kShadowElevationsPaperBottomMargin]
|
|
.active = YES;
|
|
[NSLayoutConstraint constraintWithItem:_paper
|
|
attribute:NSLayoutAttributeWidth
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:_paper
|
|
attribute:NSLayoutAttributeHeight
|
|
multiplier:1.0
|
|
constant:0]
|
|
.active = YES;
|
|
[NSLayoutConstraint constraintWithItem:_paper
|
|
attribute:NSLayoutAttributeWidth
|
|
relatedBy:NSLayoutRelationGreaterThanOrEqual
|
|
toItem:nil
|
|
attribute:NSLayoutAttributeNotAnAttribute
|
|
multiplier:1.0
|
|
constant:kShadowElevationsPaperDimRange]
|
|
.active = YES;
|
|
}
|
|
return self;
|
|
}
|
|
|
|
#pragma mark - MDCSliderDelegate methods
|
|
|
|
- (NSString *)slider:(MDCSlider *)slider displayedStringForValue:(CGFloat)value {
|
|
NSInteger points = (NSInteger)round(value);
|
|
return [NSString stringWithFormat:@"%ld pt", (long)points];
|
|
}
|
|
|
|
- (void)sliderValueChanged:(MDCSlider *)slider {
|
|
MDCShadowElevation points = [self shadowElevationFromSliderValue:slider.value];
|
|
self.paper.text = [NSString stringWithFormat:@"%ld pt", (long)points];
|
|
self.paper.elevation = points;
|
|
self.elevationLabel.text = [[self class] elevationStringForShadowElevationValue:points];
|
|
}
|
|
|
|
- (NSString *)slider:(MDCSlider *)slider accessibilityLabelForValue:(CGFloat)value {
|
|
MDCShadowElevation points = [self shadowElevationFromSliderValue:slider.value];
|
|
NSString *elevationName = [[self class] elevationStringForShadowElevationValue:points];
|
|
if (elevationName.length > 0) {
|
|
return elevationName;
|
|
} else {
|
|
return [NSString stringWithFormat:@"Unlabeled elevation of %@", @((NSInteger)points)];
|
|
}
|
|
}
|
|
|
|
#pragma mark - Internal methods
|
|
|
|
- (MDCShadowElevation)shadowElevationFromSliderValue:(CGFloat)sliderValue {
|
|
return round(sliderValue);
|
|
}
|
|
|
|
+ (NSString *)elevationStringForShadowElevationValue:(MDCShadowElevation)shadowElevationValue {
|
|
NSString *elevationString = kDefaultShadowElevationLabelString;
|
|
|
|
if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationNone)) {
|
|
elevationString = @"MDCShadowElevationNone";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationSwitch)) {
|
|
elevationString = @"MDCShadowElevationSwitch";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationRaisedButtonResting)) {
|
|
elevationString = @"MDCShadowElevationRaisedButtonResting";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationRefresh)) {
|
|
elevationString = @"MDCShadowElevationRefresh";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationAppBar)) {
|
|
elevationString = @"MDCShadowElevationAppBar";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationFABResting)) {
|
|
elevationString = @"MDCShadowElevationFABResting";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationRaisedButtonPressed)) {
|
|
elevationString = @"MDCShadowElevationRaisedButtonPressed";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationSubMenu)) {
|
|
elevationString = @"MDCShadowElevationSubMenu";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationFABPressed)) {
|
|
elevationString = @"MDCShadowElevationFABPressed";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationNavDrawer)) {
|
|
elevationString = @"MDCShadowElevationNavDrawer";
|
|
} else if (MDCCGFloatEqual(shadowElevationValue, MDCShadowElevationDialog)) {
|
|
elevationString = @"MDCShadowElevationDialog";
|
|
}
|
|
|
|
return elevationString;
|
|
}
|
|
|
|
@end
|
|
|
|
@interface ShadowElevationsTypicalUseViewController : UIViewController
|
|
@property(nonatomic) ShadowElevationsPointsView *shadowsView;
|
|
@end
|
|
|
|
@implementation ShadowElevationsTypicalUseViewController
|
|
|
|
- (void)viewDidLoad {
|
|
[super viewDidLoad];
|
|
self.view.backgroundColor = [UIColor whiteColor];
|
|
self.title = @"Shadow Elevations";
|
|
_shadowsView = [[ShadowElevationsPointsView alloc] initWithFrame:self.view.bounds];
|
|
[self.view addSubview:_shadowsView];
|
|
|
|
self.shadowsView.autoresizingMask =
|
|
UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
|
|
}
|
|
|
|
- (void)setupShadowsViewConstraints {
|
|
[NSLayoutConstraint constraintWithItem:self.shadowsView
|
|
attribute:NSLayoutAttributeTop
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self.topLayoutGuide
|
|
attribute:NSLayoutAttributeBottom
|
|
multiplier:1.0
|
|
constant:0]
|
|
.active = YES;
|
|
|
|
[NSLayoutConstraint constraintWithItem:self.shadowsView
|
|
attribute:NSLayoutAttributeLeading
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self.view
|
|
attribute:NSLayoutAttributeLeading
|
|
multiplier:1.0
|
|
constant:0]
|
|
.active = YES;
|
|
|
|
[NSLayoutConstraint constraintWithItem:self.shadowsView
|
|
attribute:NSLayoutAttributeWidth
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self.view
|
|
attribute:NSLayoutAttributeWidth
|
|
multiplier:1.0
|
|
constant:0]
|
|
.active = YES;
|
|
|
|
[NSLayoutConstraint constraintWithItem:self.shadowsView
|
|
attribute:NSLayoutAttributeBottom
|
|
relatedBy:NSLayoutRelationEqual
|
|
toItem:self.bottomLayoutGuide
|
|
attribute:NSLayoutAttributeTop
|
|
multiplier:1.0
|
|
constant:0]
|
|
.active = YES;
|
|
}
|
|
|
|
- (void)viewSafeAreaInsetsDidChange {
|
|
[super viewSafeAreaInsetsDidChange];
|
|
CGRect insetedShadowViewFrame = CGRectMake(
|
|
self.view.bounds.origin.x, self.view.bounds.origin.y + self.view.safeAreaInsets.top,
|
|
self.view.bounds.size.width - self.view.safeAreaInsets.left - self.view.safeAreaInsets.right,
|
|
self.view.bounds.size.height - self.view.safeAreaInsets.top -
|
|
self.view.safeAreaInsets.bottom);
|
|
self.shadowsView.frame = insetedShadowViewFrame;
|
|
}
|
|
|
|
#pragma mark catalog by convention
|
|
|
|
+ (NSDictionary *)catalogMetadata {
|
|
return @{
|
|
@"breadcrumbs" : @[ @"Shadow", @"Shadow Elevations" ],
|
|
@"primaryDemo" : @NO,
|
|
@"presentable" : @YES,
|
|
};
|
|
}
|
|
|
|
@end
|