I found rather odd behavior of UINavigationBar of UISplitViewController. I have a stadard rootViewController on the picture below:
When the bar button is pressed(it is temporarily for debug styled as "Add button"), I add a new Navigation bar(NOTE: I add, I do not replace!) that handles events done on screen.
Explanation - the button is pressed and user starts drawing stuff on screen, the new bar is added for interaction to make the drawing mode stop.
Problem - however, when I add this bar a strange graphical detail appears where the bar of my rootViewController is split in two pieces. Picture below(marked red):
Is it a known issue or is it there for a reason?
CODE:
UINavigationBar *tmpBar = [[UINavigationBar alloc] initWithFrame:CGRectOffset(CGRectMake(0.0, 0.0, 1024.0, 44.0), 0, - 44.0)];
UINavigationItem *it = [[UINavigationItem alloc] initWithTitle:#"Draw, baby, draw!"];
it.leftBarButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:#selector(cancelDrawing)];
it.rightBarButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:#selector(sendMail)];
tmpBar.items = [[NSArray alloc] initWithObjects:it, nil];
self.canvasBar = tmpBar;
[self.splitViewController.view addSubview:self.canvasBar];
[self.splitViewController.view bringSubviewToFront:self.canvasBar];
[UIView beginAnimations:#"animateBarOn" context:NULL];
[UIView setAnimationDuration:1.0];
[self.canvasBar setFrame:CGRectOffset([self.canvasBar frame], 0, 44)];
[UIView commitAnimations];
NOTE: I am not looking for an alternative solution, but for EXPLANATION why this is happening.
Your second nav bar is added a bit lower than the first, so you are seeing the division in the blue bar. As for why, I can't say without more information on how you are adding it.
Related
How can I create a material component tab bar bottom navigation? The docs describe
that I have to implement positionForBar: and return UIBarPositionBottom to configure the tab bar as a bottom navigation bar. The bar will automatically update with the appropriate styling. How ever it looks like it doesn't work -example:
ViewController.h
...
#interface ViewController : MDCCollectionViewController <MDCTabBarDelegate>
ViewController.m
- (void)viewDidLoad {
[super viewDidLoad];
self.styler.cellStyle = MDCCollectionViewCellStyleCard;
// Do any additional setup after loading the view, typically from a nib.
self.appBar = [[MDCAppBar alloc] init];
[self addChildViewController:self.appBar.headerViewController];
self.appBar.headerViewController.headerView.backgroundColor = [UIColor colorWithRed:120.0/255 green:144.0/255 blue:156.0/255 alpha:1.0];//rgba(38,50,56 ,1)
self.appBar.headerViewController.headerView.trackingScrollView = self.collectionView;
self.appBar.navigationBar.tintColor = [UIColor blackColor];
[self.appBar addSubviewsToParent];
self.title = #"W0rX";
MDCTabBar *tabBar = [[MDCTabBar alloc] initWithFrame:self.view.bounds];
tabBar.items = #[
[[UITabBarItem alloc] initWithTitle:#"Recents" image:[UIImage imageNamed:#"phone"] tag:0],
[[UITabBarItem alloc] initWithTitle:#"Favorites" image:[UIImage imageNamed:#"heart"] tag:0],
];
tabBar.itemAppearance = MDCTabBarItemAppearanceTitledImages;
tabBar.delegate = self;
tabBar.autoresizingMask =
UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin;
[tabBar sizeToFit];
[self.view addSubview:tabBar];
}
- (UIBarPosition)positionForBar:(id <UIBarPositioning>)bar {
NSLog(#"######## UIBarPositionBottom");
return UIBarPositionBottom;
}
Thanks for using MDC-iOS.
Looks like your code is almost there!
What's missing is setting the frame of the tab bar to the bottom of the screen. See BottomNavigationBarExample for an example of how to do that. In that example view controller, the tab bar is placed at the bottom of the screen in viewWillLayoutSubviews:
barFrame.origin.y = CGRectGetMaxY(bounds) - barFrame.size.height
I know you just put a snippet of code here but I don't see you setting the origin except when you instantiate the tab bar. Your line
MDCTabBar *tabBar = [[MDCTabBar alloc] initWithFrame:self.view.bounds];
puts the top-left corner as the origin for the tab bar (0,0) to start with. Which is fine. But you'll need to move it down to the bottom of the view eventually.
BTW: Also take a look at MDCTabBarViewController which is a lot like a UITabBarViewController. It may work for you depending on what you're trying to do.
I'm trying to create modalviewcontroller, which should look like this
My problem is in the close button. As you can see in this example it almost out of uiview.
I was tried uiview, who has close button, make transparent but when modalview opens it's still in light gray color.
There is bit of my code :
Settings *new = [[Settings alloc]init];
new.modalPresentationStyle = UIModalPresentationFormSheet;
//i was change to other presentation styles, but that no I want.
new.view.backgroundColor = [UIColor clearColor];
[self presentModalViewController:new animated:YES];
CGRect r = CGRectMake(self.view.center.x - 327,
self.view.center.y - 255,
630, 490);
r = [self.view convertRect:r toView:new.view.superview.superview];
new.view.superview.frame = r;
If you still don't understand, what I want there is ilustration of modal view I need:
What is your suggestion, how can I make it?
Currently, I am trying to set the next/previous buttons on my keyboard toolbar to the new, sleek iOS 7 back button/forward buttons that get put in navigation controllers to go back. Here is what I am trying. How can I use the system bar button item instead of the boring static text?
[self setToolbar:[[UIToolbar alloc] initWithFrame:self.frame]];
[self.toolbar setBarStyle:UIBarStyleDefault];
[self.toolbar setAutoresizingMask:(UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth)];
[self addSubview:self.toolbar];
[self setSegmentedControl:[[UISegmentedControl alloc] initWithItems:#[ NSLocalizedStringFromTable(#"Previous", #"BSKeyboardControls", #"Previous button title."),
NSLocalizedStringFromTable(#"Next", #"BSKeyboardControls", #"Next button title.") ]]];
Here is what it looks like now:
Here is what I want it to look like:
Any ideas on how to access those system items without actually using images? I know its the exact iOS 7 back bar button item, I just don't know how to access it in a tool bar. I've searched everywhere. If it helps, i'm using BSKeyboardControls.
EDIT: To make it look exactly like the second image, use the images provided by Joshua, and save them as back#2x.png, and forward#2x.png into your xcode proj. Use Chun's code, but make sure to call the method for getting the images like this: imageNamed:#"back", and not #"back#2x". You now have iOS 7 back and forward buttons :)
EDIT2: To get it to look exactly like the next/previous arrow buttons use the following customizations in the correct implementation methods:
[self.segmentedControl setWidth:50 forSegmentAtIndex:0];
[self.segmentedControl setWidth:38 forSegmentAtIndex:1];
negativeSeparator.width = -19;
EDIT3: The toolbar with the < > arrows comes by default with all UIWebViews, and it appears when you tap a textfield.
If anyone is interested in a sample project, let me know, and i'll upload a link!
EDIT4: As of May 24, 2014, BSKeyboardControls now has this functionality by default.
These are the images used in toolbar, e.g. the back and forward button images:
Use the icons shared by Joshua and then try with below piece of code and you will be good to go. I have not added the done button here.
UIImage *backImage = [[UIImage imageNamed:#"backImage"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIImage *forwardImage = [[UIImage imageNamed:#"forward"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
self.segmentedControl = [[UISegmentedControl alloc] initWithItems:#[backImage, forwardImage]];
[self.segmentedControl addTarget:self action:#selector(segmentedControlChangedState:) forControlEvents:UIControlEventValueChanged];
self.segmentedControl.segmentedControlStyle = UISegmentedControlStyleBar;
self.segmentedControl.tintColor = [UIColor clearColor];
UIBarButtonItem *aSegmentedControlBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:self.segmentedControl];
[self setItems:#[aSegmentedControlBarButtonItem, self.flexibleSpace]];
1) Download latest files from: https://github.com/simonbs/BSKeyboardControls
2) Import the images for back/next buttons. These can be whatever you want and you can set the appropriate sizes so that they look good. Joshua has a good set. I have mine saved as "keyboardBack.png" and "keyboardForward.png"
3) In BSKeyboardControls.m, update initWithFields:fields. Here you can do some customization like setting the width of your back/next buttons. I removed the Done button here too to follow your screenshot but you can add it back.
- (id)initWithFields:(NSArray *)fields
{
if (self = [super initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 44.0f)])
{
// Creates toolbar
[self setToolbar:[[UIToolbar alloc] initWithFrame:self.frame]];
[self.toolbar setBarStyle:UIBarStyleDefault];
[self.toolbar setAutoresizingMask:(UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth)];
[self addSubview:self.toolbar];
// Import images
UIImage *backImage = [[UIImage imageNamed:#"keyboardBack"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIImage *forwardImage = [[UIImage imageNamed:#"keyboardForward"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
// Create segmentedcontrol
self.segmentedControl = [[UISegmentedControl alloc] initWithItems:#[backImage, forwardImage]];
self.segmentedControl.tintColor = [UIColor clearColor];
// Set button widths
[self.segmentedControl setWidth:50 forSegmentAtIndex:0];
[self.segmentedControl setWidth:50 forSegmentAtIndex:1];
// Other BSKeyboardControls stuff
[self.segmentedControl addTarget:self action:#selector(segmentedControlValueChanged:) forControlEvents:UIControlEventValueChanged];
[self.segmentedControl setMomentary:YES];
[self.segmentedControl setEnabled:NO forSegmentAtIndex:BSKeyboardControlsDirectionPrevious];
[self.segmentedControl setEnabled:NO forSegmentAtIndex:BSKeyboardControlsDirectionNext];
[self setSegmentedControlItem:[[UIBarButtonItem alloc] initWithCustomView:self.segmentedControl]];
[self setVisibleControls:(BSKeyboardControlPreviousNext)];
[self setFields:fields];
}
return self;
}
4) The left padding on the toolbar is a bit too much, so you can fix it by adding a negative separator in toolbarItems: in BSKeyboardControls.m:
- (NSArray *)toolbarItems
{
NSMutableArray *items = [NSMutableArray arrayWithCapacity:3];
if (self.visibleControls & BSKeyboardControlPreviousNext)
{
UIBarButtonItem *negativeSeperator = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
target:nil
action:nil];
negativeSeperator.width = -12;
[items addObject:negativeSeperator];
[items addObject:self.segmentedControlItem];
}
if (self.visibleControls & BSKeyboardControlDone)
{
[items addObject:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil]];
[items addObject:self.doneButton];
}
return items;
}
Note: I probably don't have the button widths and paddings to the exact specs, but you can tweak it to your liking!
If you don't mind living on the edge you could use Apple's undocumented system items to achieve the iOS 7 look. Here are left and right bar button items.
[self setDoneButton:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:105 target:nil action:nil]];
[self setDoneButton:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:106 target:nil action:nil]];
Source: http://iphonedevwiki.net/index.php/UIBarButtonItem
You can use this great tool by #iftekhar and customise IQSegmentedNextPrevious according to your need for giving images instead of next previous button.
Using Xcode 7.3, you can also just enter a symbol as the title for the Bar Item. This works both in code and in Interface Builder:
Place your cursor where you want the symbol to appear (eg, title box in IB or within quotes in code).
In Xcode's menu, click Edit, then Emoji & Symbols. (Alternatively, press control-command-space to bring up the list of characters.)
In the search box, type less or greater.
Then, select the symbol you want.
The less-than and greater-than symbols are colored blue in the toolbar by default.
In code:
backButton.title = "＜"
In IB:
Use this: https://github.com/simonbs/BSKeyboardControls
But it uses the segmented control which got flattened in iOS 7.
Edit:
Just change the text of the segments:
[self setSegmentedControl:[[UISegmentedControl alloc] initWithItems:#[#"<",#">") ]]];
This may not be the most elegant. (Not even sure this exact code compiles, but you see the point)
I have researched this question for a few hours, sounds pretty simple to me but haven't been able to find a viable solution. I have an iPad application where I'm using a UIActionSheet to confirm a delete. I'm adding a label to increase the font size. Everything looks and works great. I also have a requirement to dim and lock the background while the Action Sheet is visible. I can dim but cannot see how to lock the background so that the user must make a selection on the Action Sheet to dismiss it. I have tried setting UserInteractionEnabled but it doesn't work. Any Ideas?
// dim the background
UIView *dimViewDelete = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)];
dimViewDelete.backgroundColor = [UIColor blackColor];
dimViewDelete.alpha = 0.3f;
dimViewDelete.tag = 2222;
[self.view addSubview:dimViewDelete];
if ([self.listArray count] > 0)
{
// create Action Sheet
UIActionSheet * action = [[UIActionSheet alloc]
initWithTitle:#" "
delegate:self
cancelButtonTitle:#"Cancel"
destructiveButtonTitle:#"Delete"
otherButtonTitles:nil];
[action addButtonWithTitle:#"Cancel"];
[action setActionSheetStyle:UIActionSheetStyleBlackTranslucent];
[action showInView:self.view];
// change the font size of the title
CGRect oldFrame = [(UILabel*)[[action subviews] objectAtIndex:0] frame];
UILabel *addTitle = [[UILabel alloc] initWithFrame:oldFrame];
addTitle.font = [UIFont boldSystemFontOfSize:22];
addTitle.textAlignment = UITextAlignmentCenter;
addTitle.backgroundColor = [UIColor clearColor];
addTitle.textColor = [UIColor whiteColor];
addTitle.text = #"Are You Sure?";
[addTitle sizeToFit];
addTitle.frame = CGRectMake(oldFrame.origin.x, oldFrame.origin.y,
oldFrame.size.width, addTitle.frame.size.height);
[action addSubview:addTitle];
}
Your best option is to implement your own custom action sheet-like control.
You need a simple view controller that has the two buttons and a label (for the title). Show the view controller in a popover. Make the view controller modal so it can only be dismissed by tapping one of the buttons. This also makes the background appear locked.
If you really need to dim the background as well, just before displaying the popover, add a screen sized UIView to the main window. Set this view's background to [UIColor whiteColor:0 alpha:0.7]. Adjust the alpha as needed to get the right dimming effect. You can even animate the alpha of the view so it fades in and out as needed.
Basically what I am trying to figure out to do is, say I have one View Controller, called V1, that has a regular view inside it and a button. Now, when you tap that button, I want that button to create an action that pop-ups another View Controller, called V2, within the same view controller, V1.
V2 will be reduced in size some so that it does not fill the entire screen, but you can still see the first layer which is V1 behind V2. So basically, you never really leave V1. I hope this makes sense for what I'm trying to do. I know the MTV app has this functionity. An image of what I'm talking about is here: https://docs.google.com/leaf?id=0BzlCAVXRsIPcNWUxODM2MDAtNDE3OS00ZTc4LTk5N2MtZDA3NjFlM2IzNmZk&hl=en_US
Sample code or an example is what I'm looking for as well.
Thanks
You can create such view by setting appropriate property type of modalPresentationStyle. See my example below:
UIViewController *V2 = [[UIViewController alloc] init];
V2.modalPresentationStyle = UIModalPresentationFormSheet;
V2.modalTransitionStyle = UIModalTransitionStyleCoverVertical;
[V1 presentViewController:V2 animated:YES completion:nil];
V2.view.superview.frame = CGRectMake(0, 0, 540, 620); //it's important to do this after presentModalViewController
V2.view.superview.center = V1.view.center;
[V1 release];
Try this:
V2 *d = [[V2 alloc]initWithNibName:#"V2" bundle:nil];//assuming V2 is name of your nib as well
d.delegate = self; //Optional:you only need this if you want to delegate
//create popover and put V2 in the popover view
UIPopoverController *popoverController = [[UIPopoverController alloc] initWithContentViewController:d];
popoverController.delegate = self; //optional
CGSize size = CGSizeMake(325, 75); // size of view in popover…V2
popoverController.popoverContentSize = size;
[d release];
[popoverController presentPopoverFromRect:yourButton.frame inView:self.view permittedArrowDirections:UIPopoverArrowDirectionAny animated:YES];
If you want to present this as a modal popup in iOS 8 with a similar style to the OP's screenshot here's what I did:
UIViewController *V2 = [[UIViewController alloc] init]; // V2 is the popup
V2.modalPresentationStyle = UIModalPresentationFormSheet;
V2.modalTransitionStyle = UIModalTransitionStyleCoverVertical;
V2.preferredContentSize = CGSizeMake(325, 75); // size of popup view
[V1 presentModalViewController:V2 animated:YES]; // V1 is the current topmost view controller
I like this better than using a UIPopover because you don't need to mess with arrow directions and the user cannot close it by tapping outside of the popup.
These properties can also be set in a storyboard/nib via the designer. To set preferredContentSize check "Use Preferred Explicit Size" and set the values.
This only works on the iPad.
There is a very good library to display a view controller as Popup on iPhone
see here https://github.com/martinjuhasz/MJPopupViewController
If you're using Storyboard, you can follow this step:
Add a view controller (V2), setup the UI the way you want it
*based on the image you attached
add an UIView - set background to black and opacity to 0.5
add an UIImageView - that will serve as your popup (Pls take note that the image and the view must not have the same level/hierarchy. Dont make the imageview the child of the view otherwise the opacity of the uiview will affect the uiImageView)
Present V2 Modally
Click the segue. In the Attributes inspector, Set Presentation as Over Full Screen. Remove animation if you like
Select V2. In the Attributes inspector, Set Presentation as Over Full Screen. Check Defines Context and Provides Context
Select the MainView of your V2 (Pls. Check image). Set backgroundColor to Clear Color
file .m ---> this is the implementation file
-(IBAction)anyAlert:(id)sender{
UIAlertView *alert = [[UIAlertView alloc] initWithTitle:#"Title" message:#"A Message" delegate:self cancelButtonTitle:#"Cancel" otherButtonTitles:#"OK!", #"Other Title", nil];
[alert show];
[alert release];
}
remember declare
-(IBAction)anyAlert:(id)sender;
in the file .h ---> header file
It works for me, hopefully for you...
Create UIView for v2 and add in v1.
- (void)viewDidLoad
{
UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[button addTarget:self
action:#selector(aMethod:)
forControlEvents:UIControlEventTouchDown];
[button setTitle:#"Show View" forState:UIControlStateNormal];
button.frame = CGRectMake(80.0, 210.0, 160.0, 40.0);
[self.view addSubview:button];
}
- (void)aMethod:(id)sender
{
CGRect * imageFrame = CGRectMake(10, 90, 300, 300);
V2 *v2 = [[V2 alloc] initWithFrame:imageFrame];
[self.view addSubview:v2];
}