ストーリーボードをiPhoneからiPadに変換する


218

iPhoneストーリーボードのあるアプリケーションがあります。次に、iPadアプリケーションも提供したいと思います。それで、iPhoneストーリーボードをストーリーボードに変換するのに役立つ機能があるかどうか尋ねましたiPad

具体的には:

同様の機能はありますか、手動の方法しかありませんか?


5
ああ、私はそれらをマークする必要があることを知りませんでした。私は今、正しい答えとして1つの答えをマークしました。私も古いスレッドでこれを行いました、ありがとう。
dehlen

1
手順と画像の詳細情報は、datacalculation.blogspot.in / 2014/09 /…
iOSテスト

回答:


535

私は一種の解決策を見つけました:

  1. iPhoneストーリーボードを複製して名前を変更する MainStoryboard_iPad.storyboard

  2. Xcodeを閉じてから、このファイルをテキストエディタで開きます。

  3. 検索しtargetRuntime="iOS.CocoaTouch"て次のように変更しますtargetRuntime="iOS.CocoaTouch.iPad"

  4. MainStoryboard_iPad.storyboardのコードを次のように変更します。

    <simulatedScreenMetrics key="destination" type="retina4"/>

    <simulatedScreenMetrics key="destination"/>

  5. すべてを保存して、Xcodeを再度開きます。iPad-StoryboardのコンテンツはiPhone-fileと同じですが、すべてが乱れる可能性があります。

これは私に時間を節約しました-うまくいけばこれはあなたを助けるでしょう


20
+1できれば、私の評判から+100を差し上げます。素晴らしいアドバイス!できなかったのは、Dashcodeでストーリーボードを開くことだけだったので、TextWranglerを使用しました(ただし、テキストエディターなら何でもできると思います)。ありがとう!
Piotr Justyna 2012年

45
良いアドバイス、ありがとう。ここから、すべてのwidth = "320"をwidth = "768"に、height = "480"をheight = "1024"などに、ここから直接変更することもできます。IBで要素ごとに行うよりもはるかに簡単なので。
ベンG

63
xCode内でDashcodeもtextWranglerも使用しないでください。ストーリーボードを右クリックして、[Open as]-> [Source Code]をクリックします。「Interface Builder-IOS StoryBoard」を使用する以外は同じことを行います
hokkuk

16
@PiotrJustynaあなたはそれを行うことができます。start a bounty質問の下を押して、必要な量を選択し、Reward existing answer...
Filip Radelic

33
:iPadのフォーマットもからMainStoryboard_iPad.storyboard内のコードを変更取得するため<simulatedScreenMetrics key="destination" type="retina4"/><simulatedScreenMetrics key="destination"/>
マーカス・シュワブ

61

ユニバーサルプロジェクトを作成した場合、デフォルトで空のiPadストーリーボードが作成されます。iPhoneストーリーボードを選択してすべてを選択し(Command + A)、コピーして(Command + C)、iPadストーリーボードに貼り付けます。コンパイルする前に、エントリポイントを空のストーリーボードから新しくコピーしたストーリーボードに移動してください。


9
ベストアンサー、簡単なソリューション、トップアンサーとは異なり、後でインターフェースを簡単に変更できます。:)
マットリード

レイアウトはどうですか?
tryKuldeepTanwar

10

それは私にはうまくいきませんでした。私は少し違うことをしました。

  1. iPad版の新しいストーリーボードファイルを作成する
  2. 新しいファイルとコピーしたいファイルの両方をtextwrangler(テキストエディター)で開きます。
  3. これらのxmlタグの間にあるxmlテキストを古いファイルから新しいファイルにコピーしました
  4. 最初のタグ <scenes> <!--Contents View Controller-->
  5. ここに貼り付け
  6. 終了タグ </class> </classes>

それでうまくいきました。すべてのコンセントが接続された新しいレイアウトアウトを取得しましたが、それだけで数時間を節約できました。


1
+1他の人は私のために働かなかった、そしてこれはすべてが期待通りに働くようにする
Shereef Marzouk

4
これはXcode内から実行できます。.storyboardファイルを右/コントロールでクリックし、クリックOpen As > Source Codeして生のXMLを表示します。
Matt Kantor 2013年

8

Stackoverflowで多くのスレッドを読んだところ、解決策は次のとおりです。

1.iPhoneストーリーボードを複製して、名前をMainStoryboard_iPad.storyboardに変更します。

2.ストーリーボードを右クリック->「名前を付けて開く」->「ソースコード」。

3. targetRuntime = "iOS.CocoaTouch"を検索して、targetRuntime = "iOS.CocoaTouch.iPad"に変更します。

5.を検索し<simulatedScreenMetrics key="destination" type="retina4"/>てに変更します<simulatedScreenMetrics key="destination"/>

4.次に、すべてを保存して、MainStoryboard_iPad.storyboardを右クリックし、「名前を付けて開く」->「IOS StoryBoard」5.制約を変更する必要がある場合もあります。あなたがしたことはそれだけです。


8
1. Create New Storyboard file with MainStoryboard_iPad.storyboard
2. Copy All the views from MainStoryboard and paste to MainStoryboard_iPad.storyboard

8

1-を作成する "MainStoryboard_iPad.storyboard";

2-あなたを右クリックして"MainStoryboard_iPhone.storyboard"、「Open as-> Source Code」を開きます。すべてをコピーします。

3-あなた"MainStoryboard_iPad.storyboard"を右クリックして、「Open as-> Source Code」としてください。すべてを貼り付けます。今すぐ検索して変更:

  • targetRuntime="iOS.CocoaTouch" to targetRuntime="iOS.CocoaTouch.iPad"
  • type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" to type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.iPad.XIB"

4-保存。再度開きますが、インターフェースビルダーを使用します。あなただけの再配置する必要があります。

この方法は.xibファイルにも使用できます


1
これが最良の方法です。すべてのビューとコンポーネントがipad形式にサイズ変更されるためです。
ベン

1
最新バージョンのios7では、type = "com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB"を変更する必要はありません。
super9 2014年

5

これは逆のことですが、iPadストーリーボード(〜35シーン)ですべてを選択してコピーし、それをiPhoneストーリーボードに貼り付けることができました。シーンサイズは自動的に調整されました。私は2つの問題のみを確認しました。UISplitViewControllerを置き換える必要があり(iPadのみであるため)、デフォルトの背景が灰色ではなく透明になりました(すべての背景を手動で設定せずに、引き続き適切に修正しています)。

編集:属性インスペクターのUITableViewのデフォルトの背景はかなり奇妙に思われます。グループ化されたテーブルビューの場合は背景を「グループテーブルビューの背景色」に、グループ化されていないテーブルビューの場合は「白色」に手動で背景を設定する必要がありました。その後、「デフォルト」として表示されました(ハードコードされた値と一致したためです)。-実際には、さらに簡単に、「グループ化」から「静的」に変更すると、デフォルトの色がリセットされるように見えます。


4

これは私を数時間節約し、Pythonのスキルを持つあなたを助けるかもしれないものです。

私は過去2か月間、iPadだけでチームとUXを繰り返すことに重点を置いてアプリを作成してきました。

今日はiPhoneバージョンの構築に焦点を当て、上記の手順に従いました(ありがとう!)ビジュアルストーリーボードエディターでiPadディメンションからすべてのui要素のサイズを変更する必要はありませんでした。

そこで、この小さなpythonジグスクリプトを作成して、ストーリーボードファイルをスキャンしてx、y、幅、高さを求め、すべてを320/768の比率で縮小しました。その後、微調整に集中することができました。

  1. iPadストーリーボードを新しいファイルにコピーします。(例:iPhoneStoryboard.storyboard)

  2. コピーしたストーリーボードのファイル名を最初のパラメーターとして以下のスクリプトを実行します。

  3. _adjusted.storyboardというサフィックスが付いた出力ファイルを生成します(例:iPhoneStoryboard.storyboard_adjusted.storyboard)

それが役に立てば幸い...

import re
import sys
import math

afile = sys.argv[1]

scale = 320./768.

number_pattern = '[-0-9]+(.[0-9]+)?'
#width_pattern = 'width="[-0-9]+( ?px)?"'
width_pattern = 'width="[-0-9]+(.[0-9]+)?( ?px)?"'
height_pattern = 'height="[-0-9]+(.[0-9]+)?( ?px)?"'
x_pattern = 'x="[-0-9]+(.[0-9]+)?( ?px)?"'
y_pattern = 'y="[-0-9]+(.[0-9]+)?( ?px)?"'


def replacescaledvalue(scale,pattern,sometext,replacefmt) :
    ip = re.search(pattern, sometext, re.IGNORECASE)
    if(ip) :
        np = re.search(number_pattern,ip.group(0))
        if(np) :
            val = float(np.group(0))
            val = int(math.floor(val*scale))
            sval = replacefmt+str(val)+'"'#+'px"'
            newtext = re.sub(pattern,sval,sometext)
            return newtext
    else :
        return sometext

fin = open(afile)
fout = open(afile+"_adjusted.storyboard", "wt")
for line in fin:
    newline = line
    newline = replacescaledvalue(scale,width_pattern,newline,'width="')
    newline = replacescaledvalue(scale,height_pattern,newline, 'height="')
    newline = replacescaledvalue(scale,x_pattern,newline, 'x="')
    newline = replacescaledvalue(scale,y_pattern,newline, 'y="')
#   print newline
    fout.write( newline )

fin.close()
fout.close()

1
こんにちはChrish、私はphythonの新人です。そのため、iphoneストーリーボードをiPadに変更するコードを理解できません。これについて私を助けてください。私のipadストーリーボードは問題なくiphoneストーリーボードに変換されています。iphoneストーリーボードをiPadに変換する必要があります。したがって、上記のスクリプトで必要な変更が必要な場合、またはiphoneをipadに変換するスクリプトを共有できます。前もって感謝します。
Shubham 2014年

@Chris Robertson Chris、このスクリプトをiPhoneからiPadへの変換に使用したい場合、「scale = 320./768」を変更します。'scale = 768./320'に?
Charles Robertson

3

ターゲットの概要に移動し、デバイスをユニバーサルに変更してから、iPadのバージョンを下に移動して、コピーしたり名前を変更したりするストーリーボードを含めて、好きなストーリーボードに設定します。


3

これに関して私の問題を抱えていた可能性のある人への簡単な注意事項と同じように:

私の問題:

ストーリーボードのコンテンツが、追加した新しいボードファイルにうまくコピーされました。ただし、プロビジョニングされたiPadに変更が加えられることはありません。ビルドターゲットの指定されたストーリーボード(画像を参照)を切り替えなければならないことに気付いた場合、変更が表示されました。

ポイントがあれば画像を投稿しますが、設定は次の場所にあります。

左側のソースメニューのプロジェクトナビゲーター、プロジェクトのルートターゲット(中央のペイン)の[一般]タブ、(2番目の小見出し)展開情報。iPadボタンのタブが選択されています。

そこから、「メインインターフェース」でストーリーボードを選択します。

投稿に感謝します。この言及がどこかで問題を解決することを願っています。


3

面白くするために、XCode 5.1およびiOS 7.1では、「toolVersion」と「systemVersion」の値を次のように変更する必要もあります。

toolsVersion="5023" systemVersion="13A603"

これがないと、新しいストーリーボードファイルはコンパイルされません。


3

XCode6サイズクラスを使用すると、ストーリーボードをiPadに変換する必要がなくなります。同じストーリーボードをiPhoneとiPadの両方で使用できるため、2つのファイルを最新の状態に保つ必要がありません。

結果のストーリーボードは、iOS7 +と互換性があります。

これについて詳しくは、https//developer.apple.com/library/ios/recipes/xcode_help-IB_adaptive_sizes/chapters/AboutAdaptiveSizeDesign.html#//apple_ref/doc/uid/TP40014436-CH6-SW1

サイズクラスを使用して、ストーリーボードまたはxibファイルが使用可能なすべての画面サイズで機能できるようにします。これにより、アプリのユーザーインターフェイスを任意のiOSデバイスで機能させることができます。


3

Xcode10の場合

  1. 複製するだけ Main.storyboard

  2. 次に、ファイル名をMain_iPad.storyboardおよびに変更します Main_iPone.storyboard

  3. に適切な名前を設定します .plist

ここに画像の説明を入力してください

4.設定する適切な.storyboardを選択するだけです ここに画像の説明を入力してください


2

この機能は現在組み込まれています。たとえば、Deployment Info-> Devicesのプロジェクト設定をiPhoneからUniversalに変更すると、次のダイアログが表示されます。

ここに画像の説明を入力してください


3
Xcodeのバグかもしれませんが、私はこの作業をしたことがありません。結果のiPadストーリーボードはプロジェクトに追加されず、作成されたようには見えません。
s73v3r 2014

2

私は昨日同じ問題に見舞われたときにこのスレッドをフォローしました。私が従ったステップ

  1. Xcode 5.1の場合、テーブルセルのreuseIdentifiersがないなどのiPhoneストーリーボードのクリーンアップを行い、すべてのコントローラーにストーリーボードIDを提供し、未使用のシーンを削除する必要がありました。
  2. MainStoryboard_iPhone.storyboardをMainStoryboard_iPad.storyboardにコピーします。
  3. viエディタを使用して-変更targetRuntime="iOS.CocoaTouch"targetRuntime="iOS.CocoaTouch.iPad"
  4. コードを変更しMainStoryboard_iPad.storyboardから:<simulatedScreenMetrics key="destination" type="retina4"/><simulatedScreenMetrics key="destination"/>
  5. Xcodeでプロジェクトを開きます。
  6. 展開デバイスをユニバーサルに変更しました-iPhoneストーリーボードをコピーしないオプションを選択しました。
  7. Xcodeはデフォルトでデプロイメントターゲットを7.1に設定し、非推奨の機能を処理します。
  8. iPadストーリーボードのビューの配置エラーを修正するには-エラーを出すコントローラーのフレームレイアウトを変更しました。

それはそれだった…あなたの助けをありがとう。


1

これを行う最も簡単で信頼できる方法は、iPadのストーリーボードからコピーして貼り付けることです。

  1. 新しいストーリーボードを作成し、MainStoryboard_ipadのような名前を付けます。
  2. プロジェクトの[ターゲット]プロパティの[概要]ページで[デバイス]プロパティを[ユニバーサル]に設定して、アプリをユニバーサルアプリにします。 ここに画像の説明を入力してください
  3. iPhoneストーリーボードを開き、すべてを選択してコピーします
  4. iPadストーリーボードを開いて貼り付けます。

サイズを変更する必要がありますが、ストーリーボード全体を再作成するよりも高速です。


1

サイズクラスをサポートするXcodeバージョンの本当に簡単な解決策があります(執筆時点での現在のバージョンであるXcode 7でテスト済み)。チェック「使用サイズクラス」ストーリーボードファイル上のチェックボックス(ファイルインスペクタを)、確認ダイアログが表示されていること。次に、同じチェックボックスをオフにします。Xcodeは、このストーリーボードをiPhoneまたはiPadで使用するかどうかを尋ね、画面を適切に変換します。ストーリーボードファイルを直接編集する必要はありません。iPadとiPhoneの両方で、同じストーリーボードをコピーし、説明されている方法を使用して、iPad用とiPhone用の両方を構成します。

そして、誰かがサイズクラスの使用を提案する前に-素晴らしいですが、ゲームなどの大幅にカスタマイズされたUIには不便です


1

別のアプローチ

  1. iPad-StoryboardにNavigation-Controllerを含む空のView-Controllerを追加する

  2. クラスを、iPhoneで使用する最初のViewControllerのクラス「fooViewController」に変更します。

  3. 最初のViewControllerのiPhone-Storyboard "fooViewController_storyboard_identifier"にStoryboard-Identifierを追加します

  4. 「fooViewController.m」に移動します

  5. ブール変数ブールを追加 nibWasLoadForIpad=false

  6. - viewDidLoadメソッドに移動

if ( UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad && !nibWasLoadForIpad)
{
    nibWasLoadForIpad=true;
    UIStoryboard* Storyboard_iphone=[UIStoryboard storyboardWithName:@"Main_iPhone" bundle: nil];
    fooViewController *controller = [Storyboard_iphone instantiateViewControllerWithIdentifier:@"fooViewController_storyboard_identifier"];
    [self.navigationController pushViewController:controller animated:YES];
    self.modalPresentationStyle = UIModalPresentationCurrentContext;
}

(ps。既知の問題は、ビューの背景が白に設定されることです)



0

皆さんの答えをありがとう。

上記の手順に従いましたが、シミュレーターまたはiPadでアプリを実行したところ、iPhoneストーリーボードを使用したままでした。

何らかの理由で、ターゲットデバイスをiPhoneではなくUniversalに変更した場合、Xcode(v5.0)はapp-Info.plistファイルを更新してiPadストーリーボードを含めなかったため、次のエントリを手動で追加する必要がありました( Xcodeのplistエディターを使用):

メインストーリーボードファイルのベース名(iPad)==> MainStoryboard_iPad


0

私は単に変更します(さらに@tharkayからの回答に加えて):

 <device id="ipad9_7" orientation="landscape">

そして素晴らしい作品!

これをXCode 8.3.3で使用します

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.