iOS UIPageViewController with background - ios

I have a container UIViewController (IntroViewController), in which I load a UIPageViewController (PageViewController). In the UIPageViewController, I have IntroPageContentViewControllers and a LastIntroPageContentViewController.
I want to have a background image in the UIPageViewController. If I put it in IntroViewController, it isn't viewable. I can't put it in the UIPageViewController, and when I put it in one of the ContentViewControllers it scrolls in and out with each page. I want it to be in one place and only scroll the content.
Where do I put the UIImageView and where should I bringSubviewToFront or something alike?

Simply put the UIImageView into container UIViewController and set view.backgroundColor property to [UIColor clearColor] for both content view controllers.
Here you have an example how it works:
https://github.com/Wojdan/stackAnswers/tree/master/33912671

UIView *view = [[UIView alloc] init];
view.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
UIImageView *imageView1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"login_backgroung"]];
imageView1.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
[view addSubview:imageView1];
// Create page view controller
self.pageViewController = [self.storyboard
instantiateViewControllerWithIdentifier:#"PageViewController"];
self.pageViewController.dataSource = self;
self.pageViewController.view.backgroundColor = [UIColor clearColor];
[self.pageViewController.view insertSubview:view atIndex:0];
UIPageControl *pageControl = [UIPageControl appearance];
pageControl.pageIndicatorTintColor = [UIColor whisperWhite];
pageControl.currentPageIndicatorTintColor = [UIColor whisperDarkGray];
pageControl.backgroundColor = [UIColor clearColor];

Ideally, You should be adding UIPageViewControlleras child of it parentViewController. In your case IntroViewController is parent and PageViewController will become child of it.
Now, you set IntroViewController background colour from image like below :
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"background"]];
And then, you can clear background colours for content view controllers which are you planning to add into UIPageViewController.
However, you may have to comment below delegate to remove page control from bottom of `UIPageViewController'
- (NSInteger)presentationCountForPageViewController:(UIPageViewController *)pageViewController
{
}
Hope this helps.

Related

when home button pressed view origin changed?

I have this code in viewDidLoad:
[self.navigationController setNavigationBarHidden:YES];
self.edgesForExtendedLayout = UIRectEdgeNone;
self.view.autoresizingMask = UIViewAutoresizingFlexibleHeight;
self.view.backgroundColor = [UIColor whiteColor];
//we need to add white background behind the status bar
CGFloat statusBarHeight = [UIApplication sharedApplication].statusBarFrame.size.height;
UIView* statusBarWhiteBackGround = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, statusBarHeight)];
[statusBarWhiteBackGround setBackgroundColor:[UIColor whiteColor]];
[self.view addSubview:statusBarWhiteBackGround];
UIView * redBackGroundColor = [[UIView alloc] init];
[redBackGroundColor setBackgroundColor:[UIColor redColor]];
redBackGroundColor.frame =CGRectMake(0,statusBarHeight , self.view.frame.size.width, self.view.frame.size.height-statusBarHeight);
[self.view addSubview:redBackGroundColor];
statusWhiteBackGround view is used to change the color of the status bar.
here is the result of the above code:
but when the app enter background and then back to foreground, the redBackGroundColor view change it's orging.y as you can see in the bellow picture:
what's the problem ?thanks
Create a UIView programatically on method
-(void)viewDidLayoutSubviews{
screen=[[UIScreen mainScreen] bounds];
//Simple view
self.customView = [[CustomAlertOKView alloc]initWithFrame:CGRectMake(0, 20, screen.size.width, screen.size.height)];
[self.view addSubView:customView];
}
or
Create a view using storyboard and set the x as 0, y value as 20,width and height based on the screen size
#IBOutlet UIView *customView;
set the outlet in the storyboard,
Then set the background color of the custom view to redcolor and main view to white color
self.view.backgroundColor = [UIColor whiteColor];
customView.backgroundColor = [UIColor redColor];

UIPageViewController and UIPageControl transparent background color - iOS

I'm making a tutorial when app launches for the first time and using UIPageViewController for that. Everything is working fine but the background color of UIPageViewController is not getting transparent. It's always black, as shown below:
Here's how I'm adding the UIPageViewController (in a tabbar controller)
.h file:
#interface CHMainTabViewController : UITabBarController <UIPageViewControllerDataSource>
#property (strong, nonatomic) UIPageViewController *pageViewController;
#end
.m file (in viewDidLoad):
// Create page view controller
self.pageViewController = [self.storyboard instantiateViewControllerWithIdentifier:#"PageViewController"];
self.pageViewController.dataSource = self;
self.pageViewController.view.backgroundColor = [UIColor clearColor];
TutorialViewController *startingViewController = [self viewControllerAtIndex:0];
NSArray *viewControllers = #[startingViewController];
[self.pageViewController setViewControllers:viewControllers direction:UIPageViewControllerNavigationDirectionForward animated:NO completion:nil];
[self presentViewController:_pageViewController animated:YES completion:nil];
in my AppDelegate.m, I've also set UIPageControl's background color to clear:
UIPageControl *pageControl = [UIPageControl appearance];
pageControl.pageIndicatorTintColor = [UIColor lightGrayColor];
pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
pageControl.backgroundColor = [UIColor clearColor];
[pageControl setOpaque:NO];
self.window.backgroundColor = [UIColor clearColor];
I know that the issue is with the UIPageViewController's background color. Is it not possible to set a Controller's background to be transparent?
Please help!
Thanks.
Okay I've found the solution:
Set a background image on the UIPageViewController.
UIView *view = [[UIView alloc] init];
view.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
UIImageView *imageView1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"login_backgroung"]];
imageView1.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
[view addSubview:imageView1];
// Create page view controller
self.pageViewController = [self.storyboard
instantiateViewControllerWithIdentifier:#"PageViewController"];
self.pageViewController.dataSource = self;
self.pageViewController.view.backgroundColor = [UIColor clearColor];
[self.pageViewController.view insertSubview:view atIndex:0];
For your PageViewController viewControllers , choose a PNG Image with graphics or whatever you want, but make sure the background is transparent.
Set your UIPageControl's background as transparent in appDelegate.m
UIPageControl *pageControl = [UIPageControl appearance];
pageControl.pageIndicatorTintColor = [UIColor whisperWhite];
pageControl.currentPageIndicatorTintColor = [UIColor whisperDarkGray];
pageControl.backgroundColor = [UIColor clearColor];
Now run and your UIPageViewController will look like this, (notice the background static and only the text is moving, as we swipe from right to left):
Set these to the page view controller before presenting it
pageViewController.providesPresentationContextTransitionStyle = YES;
pageViewController.definesPresentationContext = YES;
[pageViewController setModalPresentationStyle:UIModalPresentationOverCurrentContext];

How to add a custom UIView to Navigation Bar in iOS7+ like this

Is there a way to insert any UIView in NavigationBar like the image below?
Is this not working?
UINavigationBar *navBar = [[UINavigationBar alloc] initWithFrame: CGRectMake(0.0f, 20.0f, 320.0f, 32.0f)];
UIView *tempView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 20)];
[[self view] addSubview: tempView];
[[self view] addSubview: navBar];
UINavigationItem *navItem = [[UINavigationItem alloc] initWithTitle: #"Controls"];
[navBar pushNavigationItem:navItem animated:NO];
In the code below, I embed a view into the navbar, where my embedded view draws the background and the new buttons. The code also deals with relaying out the view when the device is rotated.
- (void)viewDidLayoutSubviews {
[super viewDidLayoutSubviews];
if (view.superview == nil) {
[self.navigationBar addSubview:view];
[self.navigationBar setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault];
}
CGRect frame = self.navigationBar.frame;
frame.size.height = MY_NAVBAR_HEIGHT;
self.navigationBar.frame = frame;
view.frame = self.navigationBar.bounds;
}
An alternative solution is to use a regular UIView as a NavBar, and by saying that what I mean is you have to set the UIView in navbar place and hide the NavigationController bar in the main VC and show it in the next one read this article Here https://medium.com/me/stats/post/54bc5fc56d6c

UIPageControl - How to make the background transparent?

I am using UIPageControl and trying to make the background transparent.
UIPageControl *pageControl = [UIPageControl appearance];
pageControl.pageIndicatorTintColor = [UIColor lightGrayColor];
pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
pageControl.backgroundColor = [UIColor blackColor];
Any suggestions?
Tried
pageControl.backgroundColor = [UIColor clearColor];
no luck.
============
Okay, as mentioned by #powerj1984 and #daniellarsson UIPageControl seems to be not alterable with respect to position and background color.
So I decided to move this to UIViewController and created a UIPageControl and
#property (weak, nonatomic) IBOutlet UIPageControl *pageControl;
And then bring this to top of my UIPageViewController as in viewDidLoad
self.pageControl.numberOfPages = self.pageTitles.count;
[self.view addSubview:_pageControl.viewForBaselineLayout];
Then I updated the index of UIPageControl in viewControllerBeforeViewController and viewControllerAfterViewController
NSUInteger index = ((HomePageContentViewController*) viewController).pageIndex;
self.pageControl.currentPage = index;
Okay, as mentioned by #powerj1984 and #daniellarsson UIPageControl seems to be not alterable with respect to position and background color.
So I decided to move this to UIViewController and created a UIPageControl and
#property (weak, nonatomic) IBOutlet UIPageControl *pageControl;
And then bring this to top of my UIPageViewController as in viewDidLoad
self.pageControl.numberOfPages = self.pageTitles.count;
[self.view addSubview:_pageControl.viewForBaselineLayout];
Then I updated the index of UIPageControl in viewControllerBeforeViewController and viewControllerAfterViewController
NSUInteger index = ((HomePageContentViewController*) viewController).pageIndex;
self.pageControl.currentPage = index;
pageControl.backgroundColor = [UIColor clearColor];
is working but!! than you have to set the backgroundColor of the UIPageViewController also on [UIColor clearColor] and than! you will see the backgroundcolor of the container view.
- (void)initPageViewController
{
_pageController = [[UIPageViewController alloc] initWithTransitionStyle:UIPageViewControllerTransitionStyleScroll
navigationOrientation:UIPageViewControllerNavigationOrientationHorizontal
options:nil];
UIImageView *imgView= [[UIImageView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
imgView.image = [UIImage imageNamed:#"NiceBGImage"];
[self.view addSubview:imgView];
self.view.backgroundColor = [UIColor clearColor];
_pageController.view.frame = ({
CGRect frame = [[UIScreen mainScreen] bounds];
frame;
});
_pageController.delegate = self;
_pageController.dataSource = self;
_pageController.view.backgroundColor = [UIColor clearColor];
NSArray *controllers = #[_controllers[0]];
[self.pageController setViewControllers:controllers
direction:UIPageViewControllerNavigationDirectionForward
animated:NO
completion:nil];
UIPageControl *pageControl = [UIPageControl appearance];
pageControl.pageIndicatorTintColor = [UIColor lightGrayColor];
pageControl.currentPageIndicatorTintColor = [UIColor whiteColor];
pageControl.backgroundColor = [UIColor clearColor];
pageControl = [UIPageControl appearanceWhenContainedIn:[_pageController class], nil];
[self addChildViewController:_pageController];
[[self view] addSubview:_pageController.view];
[self.pageController didMoveToParentViewController:self];
}
Page control is transparent by default.
Check with this sample code:
UIPageControl *pageControl = [[UIPageControl alloc] init];
pageControl.frame = CGRectMake(10,10,100,100);
pageControl.numberOfPages = 8;
pageControl.currentPage = 0;
[self.view addSubview:pageControl];
[self.view bringSubviewToFront:pageControl];
[self.view setBackgroundColor:[UIColor blackColor]];
Please find the more customization possibilities below
Appearance of Page Controls
You can customize the appearance of a page control by setting the properties depicted below.
To customize the appearance of all page controls in your app, use the appearance proxy (for example, [UIPageControl appearance]). For more information about appearance proxies, see Appearance Proxies.
Tint Color
The only way to customize the appearance of a page control is by setting custom tints for the dots representing each page. The Current Page (currentPageIndicatorTintColor) field affects the color of the dot representing the currently displayed page, and the Tint Color (pageIndicatorTintColor) field affects the color of the dots representing every other page. The default color is white for the current page dot, and translucent gray for the other page dots.
If you want your custom colors to be translucent, you must specify a color with an alpha value of less than 1.0. This must be done programmatically, as in the following example:
self.myPageControl.currentPageIndicatorTintColor = [UIColor colorWithRed:0.0 green:0.0 blue:1.0 alpha:0.5];
self.myPageControl.pageIndicatorTintColor = [UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:0.5];
Check more details in UIPageControl - Developer.Apple documentation
As of Xcode 6.1.1 and iOS 8.1.1, I know that setting the background color of a UIPageControl object to the clear color worked for me.
[[self pageControl] setBackgroundColor:[UIColor clearColor]];
I finally found a working solution for this problem in Swift. You can find the original code and answer in this link.
It requires you to override the viewDidLayoutSubviews() function to bring the page control to the front of the view.
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
let subViews: NSArray = view.subviews
var scrollView: UIScrollView? = nil
var pageControl: UIPageControl? = nil
for view in subViews {
if view.isKindOfClass(UIScrollView) {
scrollView = view as? UIScrollView
}
else if view.isKindOfClass(UIPageControl) {
pageControl = view as? UIPageControl
}
}
if (scrollView != nil && pageControl != nil) {
scrollView?.frame = view.bounds
view.bringSubviewToFront(pageControl!)
}
}
It could work if you set the background color of the UIPageControl to a background image that looks the same as your VC's background color:
[UIPageControl appearance].backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"pageControllerBackground"]];
Here is the answer with extension of Juan Ariza
override func viewDidLayoutSubviews() {
super.viewDidLayoutSubviews()
let subViews: NSArray = view.subviews
var scrollView: UIScrollView? = nil
var pageControl: UIPageControl? = nil
for view in subViews {
if view.isKindOfClass(UIScrollView) {
scrollView = view as? UIScrollView
}
else if view.isKindOfClass(UIPageControl) {
pageControl = view as? UIPageControl
pageControl?.pageIndicatorTintColor = UIColor.lightGrayColor()
pageControl?.currentPageIndicatorTintColor = UIColor.blackColor()
pageControl?.backgroundColor = UIColor.clearColor()
}
}
if (scrollView != nil && pageControl != nil) {
scrollView?.frame = view.bounds
view.bringSubviewToFront(pageControl!)
}
}
Try this:
pageControl = [UIPageControl appearance];
//for change the bullets color
pageControl.pageIndicatorTintColor = [UIColor colorWithRed:(129.0/255) green:(129.0/255) blue:(129.0/255) alpha:1.0];
pageControl.currentPageIndicatorTintColor = [UIColor colorWithRed:(06.0/255) green:(122.0/255) blue:(145.0/255) alpha:1.0];
pageControl.backgroundColor = [UIColor clearColor];

Why does navigationItem.titleView align left when presentmodalviewcontroller called?

I'm using a UILabel for the titleView of a navigation bar (I'm making simple in-app web browser). It works fine, except that when I present a modal view controller, the titleView shifts from the center of the navbar to the far left (underneath the back button). I've tested in 3.0 and up. Here is relevant code:
- (void)viewDidLoad {
[super viewDidLoad];
// Title view label
CGRect labelFrame = CGRectMake(0.0, 0.0, 120.0, 36.0);
UILabel *label = [[[UILabel alloc] initWithFrame:labelFrame] autorelease];
label.font = [UIFont boldSystemFontOfSize:14];
label.numberOfLines = 2;
label.backgroundColor = [UIColor clearColor];
label.textAlignment = UITextAlignmentCenter;
label.textColor = [UIColor whiteColor];
label.shadowColor = [UIColor blackColor];
label.shadowOffset = CGSizeMake(0.0, -1.0);
label.lineBreakMode = UILineBreakModeMiddleTruncation;
self.navigationItem.titleView = label;
}
-(void)displayComposerSheet:(NSString*)mailto
{
MFMailComposeViewController *picker = [[MFMailComposeViewController alloc] init];
picker.mailComposeDelegate = self;
[self presentModalViewController:picker animated:YES];
[picker release];
}
Screenshots:
Any idea why this is happening? Thanks.
I looked into the problem with some hit and try and found the following facts:
If the UINavigationBar doesn't have the rightBarButtonItem, the titleView shifts towards the right by ~30pts.
It could be reproduced for leftBarButtonItem. But I haven't tried.
In a scenario where the a default UINavigationBar's (with no changes to rightBarButtonItem defaults) titleView is set. And then a new UIView is pushed to the navigation stack which HAS a rightBarButtonItem. Now, if this view is popped [with back button], the navigation bar will remove the rightBarButtonItem. And this will account for the weird offset that shifts the titleView towards a side.
How I fixed the problem was like this:
self.navigationItem.titleView = myCustomTitleView;
// Fake right button to align titleView properly.
UIBarButtonItem *rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:[[UIView alloc] initWithFrame:CGRectMake(0, 0, 50, 1)]];
// Width equivalent to system default Done button's (which appears on pushed view in my case).
rightBarButtonItem.enabled = NO;
self.navigationItem.rightBarButtonItem = rightBarButtonItem;
Everything is sweet now. yummmm.
Thanks to DougW for pointing me in right direction. Here's the best hack I found. Basically I retain the UILabel as a class property. Before presenting modal view I unset the titleView, and then reset it immediately after. When the modal view is dismissed I unset then reset the titleView. To the user none of this is visibly notable.
-(void)displayComposerSheet:(NSString*)mailto
{
self.navigationItem.titleView = nil;
MFMailComposeViewController *picker = [[MFMailComposeViewController alloc] init];
picker.mailComposeDelegate = self;
picker.navigationBar.tintColor = [APPDELEGATE getNavTintColor];
[picker setToRecipients:[NSArray arrayWithObject:mailto]];
[self presentModalViewController:picker animated:YES];
[picker release];
self.navigationItem.titleView = titlelabel;
}
- (void)mailComposeController:(MFMailComposeViewController*)controller didFinishWithResult:(MFMailComposeResult)result error:(NSError*)error
{
self.navigationItem.titleView = nil;
self.navigationItem.titleView = titlelabel;
[self dismissModalViewControllerAnimated:YES];
}
Does it animate? It may be animating the title view as though it's transitioning to a new view. I don't see anything wrong with your code as written.
I would suggest in your displayComposerSheet, you just unset the titleView, or animate the alpha of the titleView to 0.0. Then, animate it back to 1.0 when you dismiss the modal view controller. Not ideal, but it may look better that way.
Frankly, the whole UINavigation system is crap. We went ahead and re-wrote it ground up because of bizarre issues like these.
The only problem is your frame size. so u have to change it.
Try this one.
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0.0, 0.0, 320.0, 36.0)];
label.font = [UIFont boldSystemFontOfSize:14];
label.numberOfLines = 2;
label.backgroundColor = [UIColor clearColor];
label.textAlignment = UITextAlignmentCenter;
label.textColor = [UIColor whiteColor];
label.shadowColor = [UIColor blackColor];
label.shadowOffset = CGSizeMake(0.0, -1.0);
label.lineBreakMode = UILineBreakModeMiddleTruncation;
label.text=#"Stack Overflow";
self.navigationItem.titleView = label;
You can try move the code in viewDidAppear:
- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];
// You code to customize title view
self.navigationItem.titleView = logoImage;
}
It works for me.
If you change the width size to be small like 100 points or smaller instead of 120 you set, this problem may go away. Setting width of the label smaller worked for me.
UIView *view= [[UIView alloc] initWithFrame:CGRectMake(0, 0, 40, 40)];
[view setUserInteractionEnabled:NO];
view.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:#"logo_small.png"]];
UIBarButtonItem *barButton=[[UIBarButtonItem alloc]initWithCustomView:view ];
self.navigationItem.leftBarButtonItem = barButton;

Resources