I've successfully integrated the Parse.com login service to my app, but am having trouble changing the logo in the login window (PFLoginViewController). Specifically, the logo's view appears to change position after the new logo is set.
Original 'Parse' logo frame: (159,128,222,68)
New custom logo frame: (60,12,420,68)
The other big problem is that the username and password fields move up ~100 px if I use a different logo. This means that they overlap the new logo, and it all looks quite messy. Here are the coordinates of the username field in both cases.
Username field with 'Parse' logo: (60,232,420,44)
Username field with custom logo: (60,116,420,44)
I'm not sure what I'm missing, so any guidance would be terrific. Thanks for reading!
Miscellanea:
The new logo is 720x300.
For the logo substitution, I subclassed PFLoginViewController using code based on Parse's login tutorial.
I've found a workable way forward, and though I'm still on the lookout for something better, I wanted to share this solution in the meantime.
Because PFLoginViewController appears to a) reset the size and position of the original logo view right before viewDidAppear, and b) position the rest of the window elements (e.g., username field) relative to the logo's view, I stopped trying to replace the original logo altogether.
Instead, I added two subviews to the original logo's view: the first is a UIView to cover up the original logo (in case your new logo has transparency); the second is a UIImageView with the new logo. The code goes in viewWillAppear and appears to work fine. (The main downside is that the new logo ends up with the same size and position of the old logo.)
// Create a UIView to "cover up" original Parse logo
UIView *blankRect=[[UIView alloc] initWithFrame:CGRectMake(0,
0,
self.logInView.logo.frame.size.width,
self.logInView.logo.frame.size.height)];
[blankRect setBackgroundColor:self.logInView.backgroundColor];
[self.logInView.logo addSubview:blankRect];
// Add a subview with the new logo to the original logo's view
UIImageView *newLogo=[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"LoginLogoTight.png"]];
[newLogo setContentMode:UIViewContentModeScaleAspectFill];
[newLogo setFrame:CGRectMake(0,0,self.logInView.logo.frame.size.width,self.logInView.logo.frame.size.height)];
[self.logInView.logo addSubview:newLogo];
You need to create a PFLoginViewController subclass so you can custom theses view controllers. If you want to change the frame you should override and set there the new frame for "loginview.logo"
- (void)viewDidLayoutSubviews {
[super viewDidLayoutSubviews];
[self.logInView.logo setFrame:CGRectMake(60.0, 12.0, 420.0, 68.0)];
}
I found the tutorial really helpful, I hope this work for you
https://www.parse.com/tutorials/login-and-signup-views
Related
I'm working on an iBooks type of app for iOS 5 and have everything working except for the background image. Specifically in landscape mode.
Up to this point I've been using:
UIImageView *background = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"book.png"]];
[self.view addSubview:background];
[self.view sendSubviewToBack:background];
If I do this on the RootViewController, the spine obviously doesn't show through the page view controller's view and if I use this inside the page view controller class, it removes the ability to use CGRectInset to specify where the pagecurl should begin.
I'm sure this is probably something pretty basic, but I've looked through every book that I have as well as Google, and I don't see this covered anywhere. Any help would be appreciated.
Thanks
You will need to use a background image for your book and then use a right page image for the right side and a left side image for the left side. These will need to align and match up with the full book background image. You can use a UIImageView for all three. Keep in mind that the left and right page images will need to be perfectly square (except for the spine) with no transparent area, otherwise you get a weird shadowing effect. Also make sure all background colors are set to clear.
So you will have this hierarchy:
Root View (full screen bounds)
Book Background View (However big you want)
Page View Controller (A little smaller than the book background view, you'll have to play with this until everything looks right)
Left page view controller
Image of left page and whatever else goes on the page
Right page view controller
Image of right page and whatever else goes on the page
I hope this makes sense.
I have a working IPad App. I built everything on a default white screen and I want to add an image to background of the image. I read a couple of articles and most of the suggest to create a new UIImage with the background image and stretch it to the full screen. I tried that but I am using a couple UIImage to display the photos taken and my UIImage s seem to stay at the back of the background and they don't get shown.
What is the proper way to set the background of IPad App?
this is the screenshot of my IPad App
Follow these steps :
1) Add UIImageView to your UIView.
2) Fill it with your Background UIImage.
3) Select your Background UIImageView and Select "Send to Back" Option....
The key is your view hierarchy. If you do not want to hassle around with moving the subviews along and sendings ome to back and some to front, then start with a proper view hierarchy from the beginning.
Basic rules are: the subviews overlay their superviews.
If siblings overlay each other, then the last one added is shown.
Your view hierarchy could be:
\UIView (A: the underlying self.view from the view controller's point of view.)
\UIImageView (B: the view for your background image. Empty or hidden from start.)
\UIView (C: Container for all of your views, no background color, no background image)
\UIImageView (C1: One of your picuters)
\UIImageView (C2: One of your picuters)
\UIImageView (C3: One of your picuters)
\UILabel (C4: One of your labels)
\ ...
Build up your view hierarchy. And when you need to add or change the background then assign the appropriate UIImage ot the View B.
Certainly, there is more than one way to achieve this. However, I personally thinkthat some proper view hierarchy works best, regardless whether you do that in IB or programmatically.
The proper way is to create a UIImageView and set it to the size of your view, and put all the others View in fron of it. The tutorials that you read are giving you the right way.
If you do not want to add an image, only a color you can set the background color of your view to this color.
You can use this code to send the ImageView to the back:
[self.view sendSubviewToBack:YouBackgroundImageView];
EDIT
Because you posted and XIB screenshot:
Your background image view must be in the first position, like this image:
I'm completely stumped as to how to do it.
First, the view looks something like this:
Next, you tap in the tags bar (I assume it is a modified UITextField with a placeholder image) and the tags bar animates to the top of the view. As seen in the photo below:
You can add a tag by typing a word or series of words and clicking return on the keyboard. Once you do this, a bubble encompasses the tag and it also shows up on the tag bar.
Once you have finished, you clicked the "Done" button and the tags bar animates downward to its original position, along with the tags in the bar, as shown below:
I have several questions:
How do I animate the tags bar and tags field downward, and how to do animate the tags field upward (I assume with CoreAnimation - but I have no experience with it. Do I group the views together to do this, or do it one-by-one)
How would I produce this "tagging affect" in the UITextView/Field?
My one theory is to group the bottom two views together as a UIView, and animate that as a whole. Then for the tagging process, don't do bubbles (I would have no idea on how to do this), but just allow single-word tags and parse the textview and insert the words manually into the bar. I think this may produce a bit of a lagging affect though.
I just finished creating a pretty versatile class that should do what you need. You can find it here: RoleModel/RMSTokenView.
from the looks of their layout, the tag graphic and settings button containing the tag are housed in one UIView (let's refer to this as #property UIView* tagsView), and then there is a special view that has a UITextView, over which they are placing special UIView objects with rounded corners (possibly with .cornerRadius set as provided via Quartz) that have the text of each accepted tag in them (let's call the container for this #property UIView* tagsEditorView).
then, to answer the question regarding animating the tags bar and the tag field upward in order to add/edit tags (or downward upon pressing done), the simplest way to do this would be use UIView class methods for animation.
CGFlot keyboardTop = y; // calculate keyboard top here.
newTagsFrame = CGFrameMake(0, 0, _tagsView.size.width, _tagsView.size.height);
newTagsEditorFrame = CGFrameMake(0, _tagsView.size.height, _tagsView.size.width, keyboardTop);
[UIView animateWithDuration:0.5 animations:^{
_tagsView.frame = newTagsFrame;
_tagsEditorView.frame = newTagsEditorFrame;
}];
to answer the second question, for the shape, as mentioned above, if you #import <QuartzCore/QuarzCore.h>, you can set the cornerRadius and shape the items as you want. and for the items themselves, you should just be able to add them as UIButton objects (or UILabel objects if you prefer) as subviews of tagsEditorView, positioned as you see fit.
#import <QuartzCore/QuartzCore.h>
// ...
// at the point at which it is determined that a tag is valid, non-duplicated, etc.
UILabel* tagLabel = [[UILabel alloc] init];
// set the label text, background color, text color, borders, frame size, etc
// at the point at which it is determined that a tag is valid, non-duplicated, etc.
tagLabel.layer.cornerRadius = (tagButton.frame.size.height / 2);
_tagsArray = [_tagsArray.mutableCopy append:tagLabel];
[_tagsEditorView addSubview:tagLabel];
// ...
// at the point of ultimate display
for (UILabel* tagLabel in _tagsArray)
{
// the following will give an initial rect to work with based on label contents,
// and the font can be changed if desired by changing the minFontSize: argument
CGRect tagLabelRect
= [tagLabel.text sizeWithFont:[myFont fontWithSize:_myFontSize]
minFontSize:_myFontSize
actualFontSize:&actualFontSize
forWidth:_tagsEditorView.frame.size.width
lineBreakMode:NSLineBreakByWordWrapping];
// calculate tagLabel.frame based on individual tag and on preceding
// number of edited tags (filling/wrapping left as an exercise to reader)
}
positioning the tags themselves is just math based on what you consider acceptable layout of tags in your view.
If you are looking for a UITextfield based solution, here is a nice open source component JSTokenField available
Take a look at this open source project TURecipientBar.
It look like Apple Mail recipients view. I didn't tested the solution but it look clean and handy.
I am working on a screen where user selects an option from drop-down. Based on this selection he adds a bunch of controls to screen. My drop-down is at the bottom-right corner of the screen. It takes up 20-25% of screen space at the bottom. In the remaining 75% screen at the bottom i need to add 9 labels,6 UItext fields ,2 drop-downs and 2 buttons. I am attaching a markup here.
My question is: in ASP.NET, I have a repeater which has all the above controls. In one of the buttons named "Add More". If I click that button, it adds the same repeater at the bottom of the current one. Do we have anything like that in iOS? Like a repeater which has a bunch of controls and click add and that exact repeater is added at the bottom and so-on and so forth. If any ideas/new ideas based on my explanation pop-up then please let me know. Thanks.
The link
http://dl.dropbox.com/u/40597849/mockup2.png
So, the big rectangle to the right containing 8 labels, textboxes, drop-downs and the 2 buttons below it(one is named as "Add More") should be added again when user clicks on Add More. Please ask me if you need more information.
ITMCustomView *cView = [[ITMCustomView alloc] initWithFrame:frame];
cView.delegate =self;
CGPoint scrollPoint = CGPointMake(0.0, (frame.origin.y/400)*400);
[self.scrollView setContentOffset:scrollPoint animated:YES];
[self.scrollView addSubview:cView];
Initially the very first custom view i add, i add it with this frame size (187, 585, 350, 21); . Next whenever i hit add more i call this delegate
[self.delegate addNewSize:CGRectMake(187,self.y+ 400 , 400, 400)];
This calls the above 5 lines of code and makes a new custom view and adds it to scroll view. I store the self.y as the y value of whatever frame currently being built. So how do i make my scroll view move up and down freely. The screen shows the custom view as they are added but doesnt allow me to go up anymore. I wanted to suppose add the custom view 5 times and i added 4 i just want to scroll up , see i added 4 scroll down and just add 1 more custom view and do other processing with it. But my scroll view is non-functional and its stuck at the just added custom view disabling me to scroll up. If you need more information, please ask me. Thanks.
Use a custom view that contains all your views.
1.) Make a custom class myView which subclasses UIView.
2.) Add all the controls you need in that view class.
3.) include myView in your main view.
4.) initiate as many myView as you like and add them to your main view.
I hope that is clear enough to get you going.
Update: As to elaborate more on the comment bgoers made.
When you create a new class myView sub-classing UIView you get an empty sheet. This sheet will have the frame that you specify either in the class or when you initiate (up to you). Within that frame (myView.h and myView.m in initWithFrame), you can add subViews like buttons or labels. Those subviews will placed relative to the sheet myView.
For example, your draw up is a custom view with all the controls. I can have another one looking exactly like it by simply initiating another custom view without adding more subviews. All I need to do is move the second custom view to where I would like, all the subviews will follow.
I encourage you to read up on how to subclass and how that works in iOS. It is very simple once you get the hang of it.
I have an srollview with many images. After some image had touched I should open new view controller with this image and related images for image that was touched.
Now I use pushViewController.
So question is. Is it possible to open new viewController wiht zoom animation?
i.e. after user touched image, this image is zooming into the center of the screen (and this is new viewController already)
If it's possible please let me know with what I can realise it.
Thanks
I have good news and bad news for you. The good news is yes, it can be done! The bad news is that it can be complex.
The way I ended up doing it was as follows
when the user taps the image, you know what image to zoom, and you grab a reference and a frame
overlay a new view over the current view containing the scrollView, then add a NEW UIImageView containing another UIImage of the one the user tapped (could even be a higher resolution version)
animate that view to fill the screen (this image can be in a zoomable scrollview too, that's for future work!)
when you want to dismiss, you animate the frame down to be exactly whats in the scrollView, then you remove the overlay view
now users is more or less back to where they were before the tap