I am asking a very basic question in which I am getting some problem.
I know the difference between the iPhone and iPad ...that iPad supports SplitView, popup over but while designing I am getting error.
I have designd a UITextView
UITextView *textview = [[UITextView alloc] initWithFrame:CGRectMake(42, 150, 440, 60)];
this is basic code to design a textview but when I run this code on iPad simulator it seems fine to me. but When I run it on iPhone ,It does not goes well ..because size for that iPhone is different .In that case what should I do to run it well on both iPhone and iPad.
I am assuming that you are opting for a universal executable, so conditional compilation is not an option for you.
When you make a universal executable, you should check the features that you are relying upon before making calls dependent on the device type. In this particular case you are relying upon the screen having a particular size. Instead of hard-coding the "magic numbers" (42, 15, 440, and 60) you should calculate them from the current size of the available screen:
CGFloat w = [UIScreen mainScreen].bounds.size.width;
CGFloat h = [UIScreen mainScreen].bounds.size.height;
// Do something like this if you can
UITextView *textview = [[UITextView alloc]
initWithFrame:CGRectMake(w*0.025, h*0.25, w*0.5, h*0.125)
];
There is a chance that calculating actual sizes from the screen size is not possible, because you do not want your view to scale proportionally to the screen. In cases like that you can check the values of h and w, detect the device size, and use the corresponding set of pre-defined sizes to init your view.
Related
I never used Interface Builder ever in my app, and don't think it is something good to do.
My app was already designed for iPad/iPad2 layout, without ever considering making it work on iPhone4/iPhone5/iPAD-mini. Now I want my app to work on all of them.
I think it would be extremely ugly to have 4+ layout the universal app, like this:
if(ipad or ipad2)
view.frame = CGRectMake(0,0,100,100);
else if(ipad-mini)
view.frame = CGRectMake(0,0,100,100);
else if(iphone4)
view.frame = CGRectMake(0,0,100,100);
else if(iphone5)
view.frame = CGRectMake(0,0,100,100);
else if(iphone6)
view.frame = CGRectMake(0,0,100,100);
else if(iphone7)
view.frame = CGRectMake(0,0,100,100);
There should be only 2 layout ideally, but I don't know how to implement this way. Those fixed coordinates would not stretch on different screen sizes
if(ipad or ipad2 or ipad-mini)
view.frame = CGRectMake(0,0,100,100);
else if(iphone4 or iphone5 or iphone6 or iphone7)
view.frame = CGRectMake(0,0,100,100);
How do I do a universal app in the best way?
when you started building this app you should have done soemthing like this:
view.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleWidth;
and you change above options according to your needs.
and yes you would need different for ipad, iphone
First of all, your layout for iPhone will almost certainly be drastically different from iPad. For the iPads, all the different types have the same aspect ratio, so all you need to worry about is having the #2x images for the iPad with retina.
For the iPhone, however, you have the iPhone 4/4s VS the iPhone 5. Also, you have a lot less screen space, so you will need to find ways to present the same information in a smaller space. This can be done using scrollviews, tableViews, and having one part of the information in one viewController that you can switch to from another viewController.
Finally, I would highly recommend interface builder for most cases. It takes care of iPhone vs iPhone 5, and portrait vs landscape for you. It will even automatically animate the transition when rotating the phone. Sometimes, however, when you need to do custom drawing or our layout is really hard to get with interface builder, it is better to do it programmatically. In that case, a good way to check which device would be by checking the size of [[UIScreen mainScreen] applicationFrame]. Check that with the values of 1024x768 for an iPad, 320x480 for iPhone, or 320x568 for iPhone 5.
However, you really should use interface builder (for most cases). Why exactly do you want to avoid it?
I'm super confused about how the iPhone 4 and below apps are optimised for the iPhone 5. I'm a designer. How is optimisation done? Basically I have an app with loads of knobs and buttons and other interactive components. The way I see it, there are 3 options but what is the best way (or least, standard practice)?
1) Keep the layout the same for iPhone 5 but just add extra length on the background.
2) Scale the images/layout of components from iPhone 4 to iPhone 5 so everything is proportional.
3) Have completely separate images and different layouts for both. i.e for iPhone 5, I can move components to utilise the space more. The problem with this (and I'm not a developer) is that the interaction position of the components have moved so in effect, the iPhone 4 and 5 are separate apps?
To identify if it is a iphone 5 iphone, use this code in the file nameYourApp-prefix.pch:
//Macro iPhone5
#define IS_IPHONE_5 ( fabs( ( double )[ [ UIScreen mainScreen ] bounds ].size.height - ( double )568 ) < DBL_EPSILON )
find the nameYourApp-prefix.pch file in the supporting files, the code must be written between:
# ifdef __ OBJC__
//Code Macro iPhone5
# endif
and then just use the "if" to check that device, like this:
if (IS_IPHONE_5) {
//Code for 4 inch screen
}else{
//Code for 3.5 inch screen
}
putting the macro in the nameYourApp-prefix.pch, all classes see it.
With a UIKit application, none of your options are ideal. You simply use Springs and Struts or Auto Layout to have your user interface elements snap to where they should be.
The solution is the same when switching between portrait and landscape orientation. You define which user interface elements can grow and which ones can't, which edges to snap to, etc.
Run it on the simulator to test the layout if you don't have an iPhone 5 device.
For example, for a UITableViewController, the UITableView should grow vertically on an iPhone 5 so that you see more rows.
I almost always have at least one control that would be nice to grow given the room. If you don't, then you'll probably just have more empty space at the bottom of the view.
How iPhone 5 Optimization Works
When you tell iOS that your app is optimized for the iPhone 5 (through use of a cleverly named image file), iOS uses your existing Springs and Struts or Auto Layout (whatever you're using) to rearrange the interface.
The first choice is the easiest and works pretty well. You'd only need to worry about having specific assets for full screen images, and make sure that NavigationBar and TabBar (in case your app have one), remains on top and bottom respectively.
Scaling other images/components such as buttons, you'll change the general aspect ratio (which you probably wouldn't want), since iPhone 4&5 display sizes only differ in height.
For developing app option two is better. Although you dont have to change all the images for iPhone 5 some images will me same like TabBarItem. But you have to create background image different for iPhone4 and 5.
Read out this apple document to create user interface.
And you can differentiate iPhone 4 from iPhone 5 using this code
UIBtton * btn = [[UIButton alloc] init];
CGRect screenBounds = [[UIScreen mainScreen] bounds];
if (screenBounds.size.height == 568)
{
btn.frame = CGRectMake(60,60, 205, 175);
//this is for iPhone5
}
else
{
btn.frame = CGRectMake(60,50, 199, 170);
//this is for iPhone4
}
Here my button place and length are different for iPhone 5 and iPhone 4
And set your control's hight and width according to iPhone Screen Size.
If you didn't, adjust your view layouts with proper auto resizing masks or look into Auto Layout if you only want to support iOS 6 going forward. You have to check height of [[UIScreen mainScreen] bounds].
Example:
CGRect screenBounds = [[UIScreen mainScreen] bounds];
if (screenBounds.size.height == 568) {
// code for 4-inch screen (iPhone 5)
} else {
// code for 3.5-inch screen (< iPhone 5)
}
Note that [UIImage imageNamed:#"yourImage.png"] will only load either "background.png" or "yourImage#2x.png", it will not load "yourImage-568h#2x.png" if it exists.
Check Auto-Rotation API as Well.
I have been looking everywhere on here and Google, but I still have this weird issue that I can't figure. I have an app pictures below, with 4 UIButtons that have a background image applied:
When I resize/run on the iPhone 5, the top button resizes in a very strange way:
How do I get all the UIButtons to resize the same way with the iPhone 5? Is it possible? Do I need to use a different method?
I really hope this is not a duplicate, but I am completely stumped. If I change the UIButtons around in other positions along the UIView, a different one will resize, or strange gap spacing will show up.... I don't understand. Thanks for any help!
EDIT: I am using iOS 6 on Xcode 4.5. I am testing on an iPhone 4S and an iPhone 5. I have AutoLayout checked. If I use Pin (just found it) I can get the UIButton to keep its height.
To clarify my question. I want the UIButtons to resize so they occupy the same percentage of the screen.... I want the proportions to be the same, instead of simply adding a bunch of empty space. I hope that make it more clear
One of the features you can use is called AutoLayout. Its provided with Xcode to make it easier adjusting things for the 4 inch screen. You can find a good example here: http://www.raywenderlich.com/20881/beginning-auto-layout-part-1-of-2
But as far as I know AutoLayout works only with iOS 6 which makes it "not so useful yet". I have been using a class called UIDevice, source of which can be found here: https://github.com/erica/uidevice-extension and check if the platform type is iPhone 5. I have it set up in a method which setups GUI when the view loads. Example of my implementation:
UIImage *backgroundImage;
if ([[UIDevice currentDevice] platformType] == UIDevice5iPhone)
{
//I have a 4 inch screen present
myButton.frame = CGRectMake(x, y, w, h); //Set the frame as you would like it to look on the iPhone 5
backgroundImage = [[UIImage alloc] initWithCGImage:[UIImage imageNamed:#"main_background-568h#2x"].CGImage scale:2.0 orientation:UIImageOrientationUp];
}
else
{
//I have a 3.5 inch screen present
myButton.frame = CGRectMake(x, y, w, h); //Set the frame as you would like it to look on the iPhone 3, 3gs, 4, 4s...
backgroundImage = [[UIImage imageNamed:#"main_background"] retain];
}
self.view.backgroundColor = [UIColor colorWithPatternImage:backgroundImage];
[backgroundImage release];
Hope it clears a bit.
you should firstly disable the use AutoLayout this option is under the "Show the file inspector"
Ok So I have this code, which allows me to put a background image in:
I would love to know how to size this, so on the iPhone 4 I can get a 320x480 size but make it nice with an image of 570.855.
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"background_stream-570x855.jpg"]];
I have tried this:
UIImageView *image = [[UIImageView alloc]
initWithImage:[UIImage imageNamed:#"background_stream-570x855.jpg"]];
[self.view sendSubviewToBack:streamBG];
image.frame = CGRectMake(0, 0, 320, 480);
Which works, however the problem is it's behind the view, so I can't see it. I could make the view clear, but it has objects on it that need to be displayed.
Any help would be most apretiated
There are multiple options to put Views at desired location.
[self.view sendSubviewToBack:streamBG]; //Sends subview to last position i.e. at the last
[self.view bringSubviewToFront:streamBG] //Brings subview to first position i.e. at the first.
[self.view insertSubview:streamBG atIndex:yourDesiredIndex];//Put at desired index.
This is not answer to your question, though it may help you to set your imageview to desired location.
Hope it helps.
To answer part of your question about sizing. You need to use 2 different images for your app if you want the full resolution of the retina display (iPhone4) You should provide a 320x480 image (i.e. myImage.png) for older iPhones and one at twice the resolution, 640x960, for the iPhone 4. Use the exact same name for the high res version but add an "#2x" to the end (i.e. myImage#2x.png). In your code all you ever have to call is the base name (i.e. myImage.png) the app will choose the correct image based on the hardware its running on. That will get you the best experience on your app.
On the other part about the background view visibility, you could make the background color clear ([UIColor clearColor]) on the view that is blocking it. That would leave the content visible in that view but the view its self would be clear. Alternatively you could just insert the background at a specific index as #Jennis has suggested instead of forcing it to the back.
How can I programatically obtain the default height of an UIPickerView instance, in accordance to the resolution and orientation of the device that the app is currently running on?
I would like not to use a hardcoded value for this parameter, in the event that new devices will support different screen resolutions and thus will determine this component to have a different default size.
The warning that André saw doesn't seem to happen anymore (Xcode 4.2; iOS SDK 5.0). If you create it with initWithFrame and give it a height of zero, you can then read back it's height from the frame.height property:
uiPickerView = [[UIPickerView alloc] initWithFrame:CGRectMake(0, 77, 320, 0)];
DLog(#"uiPickerView=%#",uiPickerView);
gives:
uiPickerView=<UIPickerView: 0x9a28c40; frame = (0 77; 320 216); layer = <CALayer: 0x9a28d00>>
So 216 is the default height.
I couldn't find a definition for this in the headers, so reading it back seems to be the safest way.
It is possible to set a frame with a non-zero height, but Apple say don't do that, and it seems to cause rendering problems.
With auto layout I was wondering the same due to the fact that you can't pin to the bottom of it.
The default height with no changes to an UIPickerView is 216px
If you create an instance with a height of 0, it will be overridden with the appropriate default height, and you can just get its frame.size.height.
However, on iPad this will issue a warning (tested a few days ago). I eventually had to use hardcoded values for iPad...
P.S. This was for a UIDatePicker; not sure if it's the exact same thing for UIPickerView.
In 2022 it is 162. Pic is not touching the height just pulling into IB
You can use the frame property of the uipickerview.