UISplitView with toolbar/tabbar at bottom of detail view - tabs

So here goes. I started with a standard out of the box splitview application for iPad. Root view left and detail view to the right. Detail view has it's toolbar at the top.
What I would like to add is a tab bar to the bottom of the detail view and have the tabs load in the details view, between the toolbar tabbar.
Here is the problem, do I add another view between them to load the tabs into, if so how do I get it resize and respect the toolbar and tabbar heights.
Clear?
Hope someone can point me in the right direction. Examples would be great, every example on the web seems to just be out of the box hello world style.

Yes the answer is really very simple. UITabBarControllers like SplitViewControllers were intended by Apple to only ever be the Root View Controller and hence you cannot nest a TabBarController in another view, but you can nest a UITabBar in a view, however.
I added the Tabbar to the details view at the bottom, a Navigation bar at the top and then a placeholder view between them. All in Interface Builder!, You will want to switch everything on with the autosize on the Placeholder view.
Next, Implement the UITabBarDelegate. For this you will need:
- (void)tabBar:(UITabBar *)tabBar didSelectItem:(UITabBarItem *)item {
from that you can use item.tag which if you give each item a unique tag in Interface Builder will let you know which tab the user clicked. I setup defined values for mine:
#define VIEW_TAB_A 0
#define VIEW_TAB_B 1
#define VIEW_TAB_C 2
Then you will then want to... well best I just let you see
- (void)tabBar:(UITabBar *)tabBar didSelectItem:(UITabBarItem *)item {
[self switchToView:item];
}
- (void) switchToView : (UITabBarItem*) item {
if( currentViewController != nil ) {
[currentViewController viewWillDisappear:NO];
[currentViewController.view removeFromSuperview];
}
switch(item.tag) {
case VIEW_TAB_A:
currentViewController = self.viewA;
break;
case SCAN_VIEW_TAB_B:
currentViewController = self.viewB;
break;
case PROMOTIONS_VIEW_TAB_C:
currentViewController = self.viewC;
break;
}
UIView *aView = currentViewController.view;
aView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
aView.frame = placeholderView.frame;
[currentViewController viewWillAppear:NO];
[self.view insertSubview:aView aboveSubview:placeholderView];
if( currentViewController != nil ) {
[currentViewController viewDidDisappear:NO];
}
[currentViewController viewDidAppear:NO];
}
Remember to alloc the views (viewA, viewB, viewC) first in you viewDidLoad and obviously release in dealloc. Also take note of the autoresizingMask!
Hope this helps others.

Related

Adjusting the height of a wkwebview programmatically

This is my first question on Stack Overflow. I just started learning swift programming and got sucked into something.
I followed IAP tutorials on YouTube and successfully implemented AdMob banners and interstitial ads in my app. I was also able to turn off ads using the IAP. My question is:
I have a view in which I have two UI elements (WKWebViewand a GADBannerView). The WKWebView element covers 90% of the screen starting from x:0,y:0, whereas the GADBannerView element covers 10%. I turned off ads and hid the GADBannerView element using IAP.
Now I want to dynamically/programmatically adjust the WKWebView size to fill the entire screen, i.e 100%. In other words, I want the WKWebView element to extend over the hidden GADBannerView element.
This is because hiding the GADBannerView leaves a blank field which is not cool to the view and the WKWebView looks truncated.
Please note that neither of the views are subviews. Both are independent views added separately. I understand that I can initially make the web view fill entire screen, add the GADBannerView on top of it, and when I remove ads and hid the GADBannerView, the web view will fill screen. That is not what I want because some content of the web view can not be seen using this approach. If I have a button at the end of HTML page that loads on the web view, this button can not be clicked because it will always be behind the gad banner view even when scrolling reached the bottom. Yes, you can scroll and hold to see the button, but once you release it, it will go back down.
So as a recap, I have two separate views and want to hid one and extend the length of the other to cover the entire screen.
Please tell me how to achieve that.
thirdBannerView.isHidden = true //Hide the banner view
//then code below to increase the size of the web view to equal device //screen width and height i.e full screen.
func webViewDidFinishLoad(webView: WKWebView) {
//let screenBounds = UIScreen.main.bounds
// let heightq = screenBounds.height
//let widthq = screenBounds.width
//webView.frame.size.height = heightq
//webView.frame.size = webView.sizeThatFits(CGSize.zero)
//webView.frame = CGRectMake(0, 0, widthq, heightq);
webView.frame = CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.height)
}
This code is not effective at all as nothing changes. Please let me know how to achieve this.
This particular scenario looks promising for applying UIStackview. Add your two view ( WKWebview and GADBannerView). apply fixed height for the GADBannerview. Whenever necessary just hide the GADBannerview.
Sample code
class StackviewController : UIViewController {
let stackview: UIStackView = {
let view = UIStackView()
view.axis = .vertical
view.distribution = .fill
view.translatesAutoresizingMaskIntoConstraints = false
return view
}()
// Your WKWebview here
let sampleWKWebView: UIView = {
let view = UIView()
view.backgroundColor = .red
view.translatesAutoresizingMaskIntoConstraints = false
return view
}()
// Your GADBannerView here
let sampleGADBannerView: UIView = {
let view = UIView()
view.backgroundColor = .green
view.translatesAutoresizingMaskIntoConstraints = false
return view
}()
override func viewDidLoad() {
super.viewDidLoad()
setupViews()
}
func setupViews() {
view.addSubview(stackview)
stackview.addArrangedSubview(sampleWKWebView)
stackview.addArrangedSubview(sampleGADBannerView)
NSLayoutConstraint.activate([
stackview.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 0.0),
stackview.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 0.0),
stackview.topAnchor.constraint(equalTo: view.topAnchor, constant: 0.0),
stackview.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 0.0),
sampleGADBannerView.heightAnchor.constraint(equalToConstant: 100.0)
])
// Enable this line to hide the GADBannerView
// sampleGADBannerView.isHidden = true
}
}
Here is the output
I use two UIView to represent the WKWebView & GADBannerView. In the sample code uncomment the following to hide the bottom banner like green view.
sampleGADBannerView.isHidden = true

Stacking two ContainerViews?

I have an UIViewController with its TableView view.
For the TableView header, I need to show 2 separate views, based on some flags.
I have 2 ContainerViews, each with its own embedding, two separate UIViewControllers. I was trying to show/hide the ContainerViews's view, based on the above mentioned flags.
The problem is that, the embedded views are not showing up like I expect them to. Here is my code:
//main `UIViewController` code; simplified
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
if ([segue.identifier isEqualToString:#"header_1"]) {
if(_shouldShowH1){
self.headerViewController = (HeaderViewController *)segue.destinationViewController;
[self.view bringSubviewToFront:self.headerViewController.view];
}
} else if ([segue.identifier isEqualToString:#"header_2"]){
if(_shouldShowH2){
self.headerViewController2 = (HeaderViewController2 *)segue.destinationViewController;
[self.view bringSubviewToFront:self.headerViewController2.view];
}
}
}
My problem is that, even if I call bringSubviewToFront:, I don't see the actual View.
Any suggestions?
I actually solved my issue following this post http://sandmoose.com/post/35714028270/storyboards-with-custom-container-view-controllers with one minor modification: I don't need to swap the views, so I removed the functionality.
I decide beforehand which segue needs to be performed, so the decision branching is also removed.

How to get object referece of UIPickerView when it create through html select tag

I have a UIWebview contains a html "select" tag, which is shown as a on the screen.
When I click the dropdown, the UIWebview brings up a UIWebSelectSinglePicker View automatically, which is shown as .
I want to change the picker view background color and text color. How can I achieve this goal?
I tried to listen on UIKeyboardWillShowNotification event, but at that moment, this view has not been created.
Thanks in advance for any helps.
I managed to resolve the issue myself.
If someone also want to change the UIPickView on the fly, please take a look:
First, add a listener on UIKeyboardWillShowNotification event.
[[NSNotificationCenter defaultCenter] addObserver:self selector:#selector(_pickerViewWillBeShown:) name:UIKeyboardWillShowNotification object:nil];
Second, when notification fired, call change background color method after delay. <-- This is very important, if call method without delay, the pickview does not exist at that moment.
- (void)_pickerViewWillBeShown:(NSNotification*)aNotification {
[self performSelector:#selector(_resetPickerViewBackgroundAfterDelay) withObject:nil afterDelay:0];
}
Third, go through the UIApplication windows and find out pickerView. And you can change what ever you want for pickerView.
-(void)_resetPickerViewBackgroundAfterDelay
{
UIPickerView *pickerView = nil;
for (UIWindow *uiWindow in [[UIApplication sharedApplication] windows]) {
for (UIView *uiView in [uiWindow subviews]) {
pickerView = [self _findPickerView:uiView];
}
}
if (pickerView){
[pickerView setBackgroundColor:UIColorFromRGB(0x00FF00)];
}
}
(UIPickerView *) _findPickerView:(UIView *)uiView {
if ([uiView isKindOfClass:[UIPickerView class]] ){
return (UIPickerView*) uiView;
}
if ([uiView subviews].count > 0) {
for (UIView *subview in [uiView subviews]){
UIPickerView* view = [self _findPickerView:subview];
if (view)
return view;
}
}
return nil;
}
Hope it will help.
I believe I've come up with an alternate solution to this problem. There are certain circumstances with the other solution proposed where the label colours appear incorrect (using the system default instead of the overridden colour). This happens while scrolling the list of items.
In order to prevent this from happening, we can make use of method swizzling to fix the label colours at their source (rather than patching them after they're already created).
The UIWebSelectSinglePicker is shown (as you've stated) which implements the UIPickerViewDelegate protocol. This protocol takes care of providing the NSAttributedString instances which are shown in the picker view via the - (NSAttributedString *)pickerView:(UIPickerView *)pickerView attributedTitleForRow:(NSInteger)row forComponent:(NSInteger)component method. By swizzling the implementation with our own, we can override what the labels look like.
To do this, I defined a category on UIPickerView:
#implementation UIPickerView (LabelColourOverride)
- (NSAttributedString *)overridePickerView:(UIPickerView *)pickerView
attributedTitleForRow:(NSInteger)row
forComponent:(NSInteger)component
{
// Get the original title
NSMutableAttributedString* title =
(NSMutableAttributedString*)[self overridePickerView:pickerView
attributedTitleForRow:row
forComponent:component];
// Modify any attributes you like. The following changes the text colour.
[title setAttributes:#{NSForegroundColorAttributeName : [UIColor redColor]}
range:NSMakeRange(0, title.length)];
// You can also conveniently change the background of the picker as well.
// Multiple calls to set backgroundColor doesn't seem to slow the use of
// the picker, but you could just as easily do a check before setting the
// colour to see if it's needed.
pickerView.backgroundColor = [UIColor yellowColor];
return title;
}
#end
Then using method swizzling (see this answer for reference) we swap the implementations:
[Swizzle swizzleClass:NSClassFromString(#"UIWebSelectSinglePicker")
method:#selector(pickerView:attributedTitleForRow:forComponent:)
forClass:[UIPickerView class]
method:#selector(overridePickerView:attributedTitleForRow:forComponent:)];
This is the Swizzle implementation I developed based off the link above.
#implementation Swizzle
+ (void)swizzleClass:(Class)originalClass
method:(SEL)originalSelector
forClass:(Class)overrideClass
method:(SEL)overrideSelector
{
Method originalMethod = class_getInstanceMethod(originalClass, originalSelector);
Method overrideMethod = class_getInstanceMethod(overrideClass, overrideSelector);
if (class_addMethod(originalClass,
originalSelector,
method_getImplementation(overrideMethod),
method_getTypeEncoding(overrideMethod))) {
class_replaceMethod(originalClass,
overrideSelector,
method_getImplementation(originalMethod),
method_getTypeEncoding(originalMethod));
}
else {
method_exchangeImplementations(originalMethod, overrideMethod);
}
}
#end
The result of this is that when a label is requested, our override function is called, which calls the original function, which conveniently happens to return us a mutable NSAttributedString that we can modify in anyway we want. We could completely replace the return value if we wanted to and just keep the text. Find the list of attributes you can change here.
This solution allows you to globally change all the Picker views in the app with a single call removing the need to register notifications for every view controller where this code is needed (or defining a base class to do the same).

Slide view controller menu and status bar issue with IOS7

I have a slide view controller setup.
When viewing the app in IOS7 the status bar is shown and translucent so it is shown with the content.
Is there something I should be doing to offset the content below the status bar for this specific View Controller in my storyboard?
Awarded answer to #Idan for the suggestion but as this is a table view controller had to accomplish differently:
-(void)viewWillAppear:(BOOL)animated {
[super viewWillAppear:YES];
if (SYSTEM_VERSION_GREATER_THAN_OR_EQUAL_TO(#"7")) {
self.tableView.frame = CGRectMake(0, 20, self.tableView.frame.size.width, self.tableView.frame.size.height-20);
}
}
I've solved it by introducing setting the table header view as a 20 point height view.
This code in viewDidLoad
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0.f, 0.f, self.tableView.frame.size.width, 20.f)];
headerView.backgroundColor = [UIColor whiteColor];
self.tableView.tableHeaderView = headerView;
Two different methods (depands on what you are trying to do):
Add this value to plist: "View controller-based status bar appearance" and set it to "NO". then you can code whatever you want (setStatusBarHidden etc.)
If you just want to move the view when it's iOS7 (status bar is above), in interface builder -> attribute inspector -> set delta y to -20 (so it would be below status bar).

Can I set a UIView to a Container View

I'm trying to create an iPad view with effectively 2 views. The left side view will be a menu/login area, the right side view will be for the content depending on which menu item is selected on the left.
I have added 2 Container Views and I have no trouble with creating the left side menu. However, I am having trouble telling the right side to switch between view controllers. How do you assign a UIViewController to a container view? I need to be able to switch out the right side with different view controllers when menu items are chosen.
Is this even possible? I don't want to use the Split View Controller as the right side is a UITable and I don't want a UITable.
If I'm not on the right track, can someone point me in the right direction?
Many thanks in advance.
Here is one sample code, which updates container view content for two separate buttons.
And contents are two different UIViewControllers.
Note: Before adding one view to ContinerView don't forget to clear container view to manage memory.
.h file
MyViewController1 * myViewController1;
MyViewController2 * myViewController2;
#property (nonatomic, strong) IBOutlet UIView *containerView;
.m file
// Button-1
- (IBAction)button1_TouchUpInside:(UIButton *)sender {
for (UIView *view in [containerView subviews]) {
[view removeFromSuperview];
}
[button1 setSelected:YES];
myViewController1 = nil;
myViewController1 = [[MyViewController1 alloc]
initWithNibName:#"MyViewController1"
bundle:[NSBundle mainBundle]];
[self.containerView addSubView:myViewController1.view];
}
- (IBAction)button2_TouchUpInside:(UIButton *)sender {
for (UIView *view in [containerView subviews]) {
[view removeFromSuperview];
}
[button2 setSelected:YES];
myViewController2 = nil;
myViewController2 = [[MyViewController1 alloc]
initWithNibName:#"MyViewController1"
bundle:[NSBundle mainBundle]];
[self.containerView addSubView:myViewController2.view];
}
Hope this will help to solve your problem.