Як розробити або перемістити програми для роздільної здатності екрана iPhone 5?

Новий дисплей iPhone 5 має нове співвідношення сторін і нову роздільну здатність (640 x 1136 пікселів).

Що потрібно для розробки нових або переходу вже існуючих додатків на новий розмір екрана?

Що слід пам’ятати, щоб зробити програми «універсальними» як для старих дисплеїв, так і для нового широкоекранного співвідношення сторін?

1. Завантажте та встановіть останню версію Xcode .
2. Встановіть файл запуску екрана для вашої програми (на загальній вкладці цільових налаштувань). Ось так ви можете використовувати повний розмір будь-якого екрана, включаючи розміри розділеного перегляду iPad в iOS 9.
3. Перевірте свою програму і, сподіваємось, не робити нічого іншого, оскільки все повинно працювати магічно, якщо ви правильно встановили маски автоматичного зміни розміру або використовували автоматичний макет.
4. Якщо ви цього не зробили, відрегулюйте макети подання, бажано за допомогою автоматичного макета.
5. Якщо вам потрібно зробити щось конкретно для великих екранів, то, схоже, вам потрібно перевірити висоту, [[UIScreen mainScreen] bounds]оскільки для цього, здається, немає конкретного API. Як і в iOS 8, існують також класи розмірів, які абстрагують розміри екрана на регулярні або компактні вертикально і горизонтально і рекомендуються способом адаптації вашого інтерфейсу користувача.

Якщо у вас створено додаток для iPhone 4S або новішої версії, він буде запущений на iPhone 5 з поштовим шрифтом.

Щоб адаптувати додаток до нового високого екрана, перше, що потрібно зробити - це змінити запуск зображення на: Default-568h@2x.png. Її розмір повинен бути 1136x640 (HxW). Так, зображення за замовчуванням у новому розмірі екрана - це ключ, який дозволяє вашій програмі зайняти весь екран нового iPhone 5 .

(Зверніть увагу, що режим іменування працює лише для зображення за замовчуванням. Іменування іншого зображення "Image-568h@2x.png" не призведе до завантаження його замість "Image@2x.png". Якщо вам потрібно завантажити різні зображення для різних розмірів екрана вам доведеться це робити програмно.)

Якщо вам дуже пощастило, то це може бути все-таки ... але, швидше за все, вам доведеться зробити ще кілька кроків.

• Переконайтесь, що ваші Xibs / Views використовують автоматичну компоновку, щоб змінити розміри.
• Використовуйте пружини та підкоси, щоб змінити розміри зображень.
• Якщо це недостатньо добре для вашої програми, спроектуйте xib / раскадровку для одного конкретного розміру екрана та переставте програмно для іншого.

У крайньому випадку (коли нічого з вищевказаного не вистачає), спроектуйте два Xibs та завантажте відповідний в контролер подання.

Щоб визначити розмір екрана:

if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
{
    CGSize result = [[UIScreen mainScreen] bounds].size;
    if(result.height == 480)
    {
        // iPhone Classic
    }
    if(result.height == 568)
    {
        // iPhone 5
    }
}

Єдине, що дійсно потрібно зробити, - це додати в ресурси додатку зображення запуску під назвою "Default-568h@2x.png", і загалом (якщо вам пощастить) додаток буде працювати правильно.

Якщо додаток не обробляє сенсорні події, переконайтесь, що ключове вікно має відповідний розмір. Вирішення завдання полягає у встановленні належного кадру:

[window setFrame:[[UIScreen mainScreen] bounds]]

Існують й інші проблеми, не пов’язані з розміром екрана під час переходу на iOS 6. Докладно прочитайте Примітки до випуску iOS 6.0 .

Іноді (для додатків перед дошками), якщо макет буде досить іншим, варто вказати інший xib відповідно до пристрою (див. Це питання - вам потрібно буде змінити код для роботи з iPhone 5) у viewController init, оскільки жодна кількість подвійних масок з автоматичними розмірами не спрацює, якщо вам потрібна інша графіка.

-(id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil

    NSString *myNibName;
    if ([MyDeviceInfoUtility isiPhone5]) myNibName = @"MyNibIP5";
    else myNibName = @"MyNib";

    if ((self = [super initWithNibName:myNibName bundle:nibBundleOrNil])) {


...

Це корисно для додатків, націлених на старіші версії iOS.

Тут ви можете знайти хороший підручник (для MonoTouch, але ви можете також використовувати інформацію для не-MonoTouch-проектів):
http://redth.info/get-your-monotouch-apps-ready-for-iphone-5 -ios-6-сьогодні /

1. Створіть нове зображення для екрана заставки / за замовчуванням ( 640 x 1136 пікселів ) з назвою " Default-568h@2x.png "

2. У iOS Simulator перейдіть до меню "Обладнання -> Пристрій" та виберіть " iPhone (4-дюймовий ретина) "

3. Створіть інші зображення, наприклад фонові зображення

4. Виявіть iPhone 5 для завантаження нових зображень:

public static bool IsTall
{
    get {
        return UIDevice.currentDevice.userInterfaceIdiom
                    == UIUserInterfaceIdiomPhone
                && UIScreen.mainScreen.bounds.size.height
                    * UIScreen.mainScreen.scale >= 1136;
    }
}

private static string tallMagic = "-568h@2x";
public static UIImage FromBundle16x9(string path)
{
    //adopt the -568h@2x naming convention
    if(IsTall())
    {
        var imagePath = Path.GetDirectoryName(path.ToString());
        var imageFile = Path.GetFileNameWithoutExtension(path.ToString());
        var imageExt = Path.GetExtension(path.ToString());
        imageFile = imageFile + tallMagic + imageExt;
        return UIImage.FromFile(Path.Combine(imagePath,imageFile));
    }
    else
    {
        return UIImage.FromBundle(path.ToString());
    }
}

Легко мігрувати iPhone5 та iPhone4 через XIB .........

UIViewController *viewController3;
if ([[UIScreen mainScreen] bounds].size.height == 568)
{
    UIViewController *viewController3 = [[[mainscreenview alloc] initWithNibName:@"iphone5screen" bundle:nil] autorelease];               
}    
else
{
     UIViewController *viewController3 = [[[mainscreenview alloc] initWithNibName:@"iphone4screen" bundle:nil] autorelease];
}

Я вирішую цю проблему тут . Просто додайте до зображень ~ 568h @ 2x суфікс та ~ 568h до xib. Не потрібно більше перевірок виконання або змін коду.

Я додав нове зображення запуску за замовчуванням і (перевіряючи кілька інших відповідей SE ...) переконався, що мої розкадровки мають всі розміри з автоматичним розміром і підпогляди, але сітківка 4 дюйми все ще буквена.

Тоді я помітив, що в моєму інформаційному списку для рядка-позиції для " Запуск зображення " встановлено значення " Default.png ", яке я таким чином видалив, і чарівно вивіска з літерами більше не з'являлася. Сподіваюсь, що це рятує когось іншого тієї самої божевілля, яку я витримав.

Я думаю, що це не буде працювати у всіх випадках, але в моєму конкретному проекті це дозволило уникати дублювання файлів NIB:

Десь у common.hвас можна зробити ці визначення на основі від висоти екрана:

#define HEIGHT_IPHONE_5 568
#define IS_IPHONE   ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone)
#define IS_IPHONE_5 ([[UIScreen mainScreen] bounds ].size.height == HEIGHT_IPHONE_5)

У базовому контролері:

- (void)viewDidLoad
{
    [super viewDidLoad];
    if (IS_IPHONE_5) {
        CGRect r = self.view.frame;
        r.size.height = HEIGHT_IPHONE_5 - 20;
        self.view.frame = r;
    }
    // now the view is stretched properly and not pushed to the bottom
    // it is pushed to the top instead...

    // other code goes here...
}

У constants.hфайл ви можете додати наступні оператори визначення:

 #define IS_IPAD UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad 
 #define IS_IPHONE UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone
 #define IS_WIDESCREEN (fabs((double)[[UIScreen mainScreen] bounds].size.height - (double)568) < DBL_EPSILON) 
 #define IS_IPHONE_5 (!IS_IPAD && IS_WIDESCREEN)

Щоб визначити, чи може ваш додаток підтримувати iPhone 5 Retina, використовуйте це: (Це може бути більш надійним для повернення типу дисплея, 4S Retina тощо), але, як написано нижче, він просто повертається, якщо iPhone підтримує iOS5 Retina як Так або ні)

У загальний файл ".h" додайте:

BOOL IS_IPHONE5_RETINA(void);

У загальний файл ".m" додайте:

BOOL IS_IPHONE5_RETINA(void) {
    BOOL isiPhone5Retina = NO;
    if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone) {
        if ([UIScreen mainScreen].scale == 2.0f) {
            CGSize result = [[UIScreen mainScreen] bounds].size;
            CGFloat scale = [UIScreen mainScreen].scale;
            result = CGSizeMake(result.width * scale, result.height * scale);

            if(result.height == 960){
                //NSLog(@"iPhone 4, 4s Retina Resolution");
            }
            if(result.height == 1136){
                //NSLog(@"iPhone 5 Resolution");
                isiPhone5Retina = YES;
            }
        } else {
            //NSLog(@"iPhone Standard Resolution");
        }
    }
    return isiPhone5Retina;
}

Перш за все, створіть два xibs та приєднайте всіх делегатів, основний клас до, xibа потім ви можете поставити цю умову, згадану нижче, у вашому appdelegate.mфайлі в

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 

    if ([[UIScreen mainScreen] bounds].size.height == 568)
        {

        self.ViewController = [[ViewController alloc] initWithNibName:@"ViewControlleriphone5" bundle:nil];
        }

        else
        {
             self.ViewController = [[ViewController alloc] initWithNibName:@"ViewControlleriphone4" bundle:nil];

        }

Ви можете використовувати його будь-де в програмі залежно від ваших вимог навіть у своїх ViewControllerкласах. Найголовніше - ви створили два xibфайли дляiphone 4(320*480) and iphone 5(320*568)

Спробуйте наведений нижче метод в одиночному класі:

-(NSString *)typeOfDevice
    {
        if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone)
        {
            CGSize result = [[UIScreen mainScreen] bounds].size;
            if(result.height == 480)
            {
                return @"Iphone";
            }
            if(result.height == 568)
            {
                return @"Iphone 5";
            }
        }
        else{
            return @"Ipad";;
        }


        return @"Iphone";
    }

Ви можете використовувати цю Auto Layoutфункцію та створити дизайн за допомогою роздільної здатності екрана iPhone 5, і він працюватиме як для 4-х, так і для 3,5-дюймових пристроїв, але в цьому випадку ви повинні мати достатньо знань менеджера компонування.

Перевірка boundsс568 потерпить невдачу в ландшафтному режимі. iPhone 5 запускається лише в портретному режимі, але якщо ви хочете підтримувати повороти, то для цього сценарію потрібно буде також "перевірити" iPhone 5.

Ось макрос, який обробляє стан орієнтації:

#define IS_IPHONE_5 (CGSizeEqualToSize([[UIScreen mainScreen] preferredMode].size, CGSizeMake(640, 1136)))

Використання дзвінка "preferenceMode" - це інша публікація, яку я прочитав кілька годин тому, тому я не придумав цієї ідеї.

Спочатку покажіть це зображення. На цьому зображенні ви показуєте попередження про підтримку Retina 4, тому натисніть на це попередження та натисніть кнопку "Додати", щоб ваш екран Retina 4 автоматично додав у ваш проект.

і після використання цього коду:

if([[UIScreen mainScreen] bounds].size.height == 568)
    {
        // For iphone 5
    }
    else
    {
        // For iphone 4 or less
    }

Я ніколи не стикався з такою проблемою на будь-якому пристрої, оскільки у мене була одна база коду для всіх, без жодних твердо кодованих значень. Що я роблю, - це зображення максимального розміру як ресурсу замість одного для кожного пристрою. Наприклад, я мав би один для відображення сітківки і показував би його як відповідний аспект, так що він буде переглядом, як є на кожному пристрої. Наприклад, вирішити кадр кнопки, наприклад, під час виконання. Для цього я використовую значення% патентного виду, наприклад, якщо я хочу, щоб ширина була половиною батьківського виду, брати 50% від батьківського виду і те саме стосується висоти та центру.

З цим мені навіть не потрібні xibs.

Ви можете використовувати це визначення для розрахунку, якщо ви використовуєте iPhone 5 на основі розміру екрана:

#define IS_IPHONE_5 ( fabs( ( double )[ [ UIScreen mainScreen ] bounds ].size.height - ( double )568 ) < DBL_EPSILON )

тоді використовуйте просте ifтвердження:

    if (IS_IPHONE_5) {

    // What ever changes
    }

Пітер, ти справді повинен поглянути на Канаппі, він все для тебе робить, все, що ти повинен зробити, це вказати макет як такий:

button mySubmitButton 'Sumbit' (100,100,100,30 + 0,88,0,0) { ... }

Звідти Canappi генерує правильний код target-c, який визначає пристрій, на якому працює програма, і використовуватиме:

(100,100,100,30) for iPhone4
(100,**188**,100,30) for iPhone 5

Канаппі працює на зразок Interface Builder та Story Board разом, за винятком того, що це текстова форма. Якщо у вас вже є файли XIB, ви можете їх конвертувати, щоб не довелося відтворювати весь інтерфейс з нуля.

Ви можете вручну перевірити розмір екрана, щоб визначити, на якому пристрої ви працюєте:

#define DEVICE_IS_IPHONE5 ([[UIScreen mainScreen] bounds].size.height == 568)

float height = DEVICE_IS_IPHONE5?568:480;
if (height == 568) {
    // 4"

} else {

    // 3"

}

Ви можете додати цей код:

if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone){
        if ([[UIScreen mainScreen] respondsToSelector: @selector(scale)]) {
            CGSize result = [[UIScreen mainScreen] bounds].size;
            CGFloat scale = [UIScreen mainScreen].scale;
            result = CGSizeMake(result.width * scale, result.height * scale);

            if(result.height == 960) {
                NSLog(@"iPhone 4 Resolution");
            }
            if(result.height == 1136) {
              NSLog(@"iPhone 5 Resolution");
            }
        }
        else{
            NSLog(@"Standard Resolution");
        }
    }

Це справжній універсальний код, ви можете створити 3 різних дошки історії:

Встановіть свій універсальний режим проекту та встановіть основну історію iPhone за допомогою розгортки iPhone5 та основну панель ipad за допомогою цільової розгортки iPad. Тепер додайте нову ціль розкадрування для iphone та змініть роздільну здатність для iphone 4s або менше, тепер реалізуйте свій AppDelegate.m

iPhone4 / 4s (те ж саме для 3 / 3G) для iPhone5 і зробить проект універсальним , з новою ціллю Storyboard для iPad, тепер у AppDelegate.m під didFinishLaunchingдодаванням цього коду:

    if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPhone){
        UIStoryboard *storyBoard;

        CGSize result = [[UIScreen mainScreen] bounds].size;
        CGFloat scale = [UIScreen mainScreen].scale;
        result = CGSizeMake(result.width *scale, result.height *scale);

//----------------HERE WE SETUP FOR IPHONE4/4s/iPod----------------------

        if(result.height == 960){
            storyBoard = [UIStoryboard storyboardWithName:@"iPhone4_Storyboard" bundle:nil];
            UIViewController *initViewController = [storyBoard instantiateInitialViewController];
            [self.window setRootViewController:initViewController];
        }

//----------------HERE WE SETUP FOR IPHONE3/3s/iPod----------------------

        if(result.height == 480){
            storyBoard = [UIStoryboard storyboardWithName:@"iPhone4_Storyboard" bundle:nil];
            UIViewController *initViewController = [storyBoard instantiateInitialViewController];
            [self.window setRootViewController:initViewController];
        }
    }

        return YES;
 }

Отже, ви створили універсальний додаток для iPhone 3 / 3Gs / 4 / 4s / 5 для всіх iPod та всіх типів iPad

Не забудьте інтегрувати всі IMG з myImage.pngтаmyImage@2x.png

На мою думку, найкращим способом вирішення подібних проблем та уникнення пари умов, необхідних для перевірки висоти пристрою, є використання відносного кадру для переглядів або будь-якого елемента інтерфейсу, який ви додаєте, наприклад, якщо ви додаєте якийсь елемент користувальницького інтерфейсу, який ви хочете, повинен знаходитися внизу перегляду або трохи вище панелі вкладок, тоді ви повинні взяти походження y по відношенню до висоти перегляду або щодо панелі вкладок (якщо є), і ми також маємо автоматичну зміну властивості. Я сподіваюся, що це спрацює для вас

Замість того, щоб використовувати набір умовних умов, ви можете автоматично змінити розмір перегляду, використовуючи розмір екрана.

int h = [[UIScreen mainScreen] bounds].size.height;
int w = [[UIScreen mainScreen] bounds].size.width;
self.imageView.frame = CGRectMake(20, 80, (h-200), (w-100));

У моєму випадку я хочу переглянути подання, яке заповнює простір між деякими полями введення у верхній частині та деякими кнопками внизу, тому фіксовано верхній лівий кут та змінну правого нижнього кута залежно від розміру екрана. Мій додаток заповнює зображення зображення фотографією, зробленою камерою, тому я хочу, щоб я міг отримати весь простір.

Якщо вам потрібно конвертувати вже наявний додаток у універсальний, вам потрібно вибрати відповідний файл xib-> показати Утиліти-> Показати інспектор розміру.

У інспекторі розмірів ви можете побачити Автоматизацію, за допомогою цього інструменту ви можете конвертувати в існуючий додаток iOS.

Використовуючи xCode 5, виберіть "Перемістити в каталог активів" на Project> General.

Потім використовуйте "Показати у пошуку", щоб знайти ваше стартове зображення, ви можете його відредагувати до 640x1136, а потім перетягніть його в каталог активів, як показано на зображенні нижче.

Переконайтесь, що в розділі iOS7 та iOS6 R4 є зображення розміром 640x1136. Наступного разу, коли ви запустите програму, чорні смуги зникнуть, і ваш додаток використовуватиме 4-дюймовий екран

Варто зазначити, що в новому Xcode ви повинні додати цей файл зображень за замовчуванням-568h@2x.png до активів

Використовуйте цю Auto Layoutфункцію для перегляду. Він автоматично підлаштовується під усі роздільні можливості.

Створіть два xibs для контролера з ім'ям контролера із суфіксом ~ iphone або ~ ipad. Під час компіляції Xcode прийме правильний xib на основі пристрою.

Використовуйте класи розмірів, якщо ви хочете створити єдиний xib як для iPhone, так і для iPad, якщо перегляд досить простий для порту на iPhone та iPad.

Існує невелика проблема при тестуванні як на пристрої iOS, так і на iOS Simulator. Здається, що тренажер (XCode 6.0.1) дає комутовані значення ширини та висоти [[UIScreen mainScreen] bounds].sizeзалежно від орієнтації пристрою.

Тож це може бути проблемою при визначенні потрібного фізичного розміру екрана. Цей код також допомагає розрізнити всі покоління моделей iPhone:

• iPhone4s
• iPhone5 (і iPhone5s)
• iPhone6 ​​(і iPhone6 ​​+)

Його також можна легко змінити, щоб зробити відмінність, наприклад, iPhone6 ​​від iPhone6 ​​+.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

    CGSize iOSDeviceScreenSize = [[UIScreen mainScreen] bounds].size;

    if ([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPhone)
    {
        if (iOSDeviceScreenSize.width > 568 || // for iOS devices
            iOSDeviceScreenSize.height > 568) // for iOS simulator
        {   // iPhone 6 and iPhone 6+

            // Instantiate a new storyboard object using the storyboard file named Storyboard_iPhone6
            storyboard = [UIStoryboard storyboardWithName:@"MainStoryboard_iPhone6" bundle:nil];

            NSLog(@"loaded iPhone6 Storyboard");
        }
        else if (iOSDeviceScreenSize.width == 568 || // for iOS devices
                 iOSDeviceScreenSize.height == 568) // for iOS simulator
        {   // iPhone 5 and iPod Touch 5th generation: 4 inch screen (diagonally measured)

            // Instantiate a new storyboard object using the storyboard file named Storyboard_iPhone5
            storyboard = [UIStoryboard storyboardWithName:@"MainStoryboard_iPhone5" bundle:nil];

            NSLog(@"loaded iPhone5 Storyboard");
        }
        else
        {   // iPhone 3GS, 4, and 4S and iPod Touch 3rd and 4th generation: 3.5 inch screen (diagonally measured)

                // Instantiate a new storyboard object using the storyboard file named Storyboard_iPhone4
            storyboard = [UIStoryboard story    boardWithName:@"MainStoryboard_iPhone" bundle:nil];

                NSLog(@"loaded iPhone4 Storyboard");
        }
    }
    else if ([UIDevice currentDevice].userInterfaceIdiom == UIUserInterfaceIdiomPad)
    {   // The iOS device = iPad

        storyboard = [UIStoryboard storyboardWithName:@"MainStoryboard_iPadnew" bundle:nil];

        NSLog(@"loaded iPad Storyboard");
    }

    // rest my code
}

Я б запропонував використовувати Автоматизацію маски у ваших програмах відповідно до інтерфейсу інтерфейсу, це економить багато проблем і краще, ніж створювати різні інтерфейси для екранів iPhone 4 та 5.