Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(ios): UI sizing of the audio capture controller according to parent view size #279

Merged
merged 2 commits into from
Aug 9, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
153 changes: 78 additions & 75 deletions src/ios/CDVCapture.m
Original file line number Diff line number Diff line change
Expand Up @@ -656,81 +656,6 @@ - (id)initWithCommand:(CDVCapture*)theCommand duration:(NSNumber*)theDuration ca
return nil;
}

- (void)loadView
{
if ([self respondsToSelector:@selector(edgesForExtendedLayout)]) {
self.edgesForExtendedLayout = UIRectEdgeNone;
}

// create view and display
CGRect viewRect = [[UIScreen mainScreen] bounds];
UIView* tmp = [[UIView alloc] initWithFrame:viewRect];

// make backgrounds
NSString* microphoneResource = @"CDVCapture.bundle/microphone";

BOOL isIphone5 = ([[UIScreen mainScreen] bounds].size.width == 568 && [[UIScreen mainScreen] bounds].size.height == 320) || ([[UIScreen mainScreen] bounds].size.height == 568 && [[UIScreen mainScreen] bounds].size.width == 320);
if (isIphone5) {
microphoneResource = @"CDVCapture.bundle/microphone-568h";
}

NSBundle* cdvBundle = [NSBundle bundleForClass:[CDVCapture class]];
UIImage* microphone = [UIImage imageNamed:[self resolveImageResource:microphoneResource] inBundle:cdvBundle compatibleWithTraitCollection:nil];
UIView* microphoneView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, viewRect.size.width, microphone.size.height)];
[microphoneView setBackgroundColor:[UIColor colorWithPatternImage:microphone]];
[microphoneView setUserInteractionEnabled:NO];
[microphoneView setIsAccessibilityElement:NO];
[tmp addSubview:microphoneView];

// add bottom bar view
UIImage* grayBkg = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/controls_bg"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
UIView* controls = [[UIView alloc] initWithFrame:CGRectMake(0, microphone.size.height, viewRect.size.width, grayBkg.size.height)];
[controls setBackgroundColor:[UIColor colorWithPatternImage:grayBkg]];
[controls setUserInteractionEnabled:NO];
[controls setIsAccessibilityElement:NO];
[tmp addSubview:controls];

// make red recording background view
UIImage* recordingBkg = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/recording_bg"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
UIColor* background = [UIColor colorWithPatternImage:recordingBkg];
self.recordingView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, viewRect.size.width, recordingBkg.size.height)];
[self.recordingView setBackgroundColor:background];
[self.recordingView setHidden:YES];
[self.recordingView setUserInteractionEnabled:NO];
[self.recordingView setIsAccessibilityElement:NO];
[tmp addSubview:self.recordingView];

// add label
self.timerLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, viewRect.size.width, recordingBkg.size.height)];
// timerLabel.autoresizingMask = reSizeMask;
[self.timerLabel setBackgroundColor:[UIColor clearColor]];
[self.timerLabel setTextColor:[UIColor whiteColor]];
[self.timerLabel setTextAlignment:NSTextAlignmentCenter];
[self.timerLabel setText:@"0:00"];
[self.timerLabel setAccessibilityHint:PluginLocalizedString(captureCommand, @"recorded time in minutes and seconds", nil)];
self.timerLabel.accessibilityTraits |= UIAccessibilityTraitUpdatesFrequently;
self.timerLabel.accessibilityTraits &= ~UIAccessibilityTraitStaticText;
[tmp addSubview:self.timerLabel];

// Add record button

self.recordImage = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/record_button"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
self.stopRecordImage = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/stop_button"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
self.recordButton.accessibilityTraits |= [self accessibilityTraits];
self.recordButton = [[UIButton alloc] initWithFrame:CGRectMake((viewRect.size.width - recordImage.size.width) / 2, (microphone.size.height + (grayBkg.size.height - recordImage.size.height) / 2), recordImage.size.width, recordImage.size.height)];
[self.recordButton setAccessibilityLabel:PluginLocalizedString(captureCommand, @"toggle audio recording", nil)];
[self.recordButton setImage:recordImage forState:UIControlStateNormal];
[self.recordButton addTarget:self action:@selector(processButton:) forControlEvents:UIControlEventTouchUpInside];
[tmp addSubview:recordButton];

// make and add done button to navigation bar
self.doneButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(dismissAudioView:)];
[self.doneButton setStyle:UIBarButtonItemStyleDone];
self.navigationItem.rightBarButtonItem = self.doneButton;

[self setView:tmp];
}

- (void)viewDidLoad
{
[super viewDidLoad];
Expand Down Expand Up @@ -785,6 +710,78 @@ - (void)viewDidLoad
}
}

-(void) setupUI {
CGRect viewRect = self.view.bounds;
CGFloat topInset = self.navigationController.navigationBar.frame.size.height;
CGFloat bottomInset = 10;

// make backgrounds
NSString* microphoneResource = @"CDVCapture.bundle/microphone";

BOOL isIphone5 = ([[UIScreen mainScreen] bounds].size.width == 568 && [[UIScreen mainScreen] bounds].size.height == 320) || ([[UIScreen mainScreen] bounds].size.height == 568 && [[UIScreen mainScreen] bounds].size.width == 320);
if (isIphone5) {
microphoneResource = @"CDVCapture.bundle/microphone-568h";
}

NSBundle* cdvBundle = [NSBundle bundleForClass:[CDVCapture class]];
UIImage* microphone = [UIImage imageNamed:[self resolveImageResource:microphoneResource] inBundle:cdvBundle compatibleWithTraitCollection:nil];
UIImageView* microphoneView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, viewRect.size.width, viewRect.size.height)];
[microphoneView setImage:microphone];
[microphoneView setContentMode:UIViewContentModeScaleAspectFill];
[microphoneView setUserInteractionEnabled:NO];
[microphoneView setIsAccessibilityElement:NO];
[self.view addSubview:microphoneView];

// add bottom bar view
UIImage* grayBkg = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/controls_bg"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
UIImageView* controls = [[UIImageView alloc] initWithFrame:CGRectMake(0, viewRect.size.height - grayBkg.size.height - bottomInset,
viewRect.size.width, grayBkg.size.height + bottomInset)];
[controls setImage:grayBkg];
[controls setUserInteractionEnabled:NO];
[controls setIsAccessibilityElement:NO];
[self.view addSubview:controls];

// make red recording background view
UIImage* recordingBkg = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/recording_bg"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
UIColor* background = [UIColor colorWithPatternImage:recordingBkg];
self.recordingView = [[UIView alloc] initWithFrame:CGRectMake(0, topInset, viewRect.size.width, recordingBkg.size.height)];
[self.recordingView setBackgroundColor:background];
[self.recordingView setHidden:YES];
[self.recordingView setUserInteractionEnabled:NO];
[self.recordingView setIsAccessibilityElement:NO];
[self.view addSubview:self.recordingView];

// add label
self.timerLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, topInset, viewRect.size.width, recordingBkg.size.height)];
[self.timerLabel setBackgroundColor:[UIColor clearColor]];
[self.timerLabel setTextColor:[UIColor whiteColor]];
[self.timerLabel setTextAlignment:NSTextAlignmentCenter];
[self.timerLabel setText:@"0:00"];
[self.timerLabel setAccessibilityHint:PluginLocalizedString(captureCommand, @"recorded time in minutes and seconds", nil)];
self.timerLabel.accessibilityTraits |= UIAccessibilityTraitUpdatesFrequently;
self.timerLabel.accessibilityTraits &= ~UIAccessibilityTraitStaticText;
[self.view addSubview:self.timerLabel];

// Add record button

self.recordImage = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/record_button"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
self.stopRecordImage = [UIImage imageNamed:[self resolveImageResource:@"CDVCapture.bundle/stop_button"] inBundle:cdvBundle compatibleWithTraitCollection:nil];
self.recordButton.accessibilityTraits |= [self accessibilityTraits];
self.recordButton = [[UIButton alloc] initWithFrame:CGRectMake((viewRect.size.width - self.recordImage.size.width) / 2,
microphoneView.frame.size.height - bottomInset - grayBkg.size.height +
((grayBkg.size.height - self.recordImage.size.height) / 2),
self.recordImage.size.width, self.recordImage.size.height)];
[self.recordButton setAccessibilityLabel:PluginLocalizedString(captureCommand, @"toggle audio recording", nil)];
[self.recordButton setImage:recordImage forState:UIControlStateNormal];
[self.recordButton addTarget:self action:@selector(processButton:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:recordButton];

// make and add done button to navigation bar
self.doneButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(dismissAudioView:)];
[self.doneButton setStyle:UIBarButtonItemStyleDone];
self.navigationItem.rightBarButtonItem = self.doneButton;
}

- (UIInterfaceOrientationMask)supportedInterfaceOrientations
{
UIInterfaceOrientationMask orientation = UIInterfaceOrientationMaskPortrait;
Expand Down Expand Up @@ -953,4 +950,10 @@ - (void)presentationControllerDidDismiss:(UIPresentationController *)presentatio
[self dismissAudioView:nil];
}

- (void)viewWillAppear:(BOOL)animated
{
[super viewWillAppear:animated];
[self setupUI];
}

@end