web-dev-qa-db-ja.com

TabBarItemsとその画像サイズの設定？

現在、タブバー項目のそれぞれに画像を追加しています。私が気に入っている画像の1つは、バー項目の領域よりもはるかに大きいサイズです。ストーリーボードでバー項目の画像を設定してエミュレーターを実行すると、その画像のバーボタンが画面全体に表示されます。

ここで、各バーボタンの画像のサイズを自動的に変更する方法があると考えました。悲しいことにそうではありません。タブバーがロードされるときに、各タブバー内の画像のサイズを変更できる方法はありますか？

iosuitabbar
50
MooCow

各タブバー項目に3つの画像アイコンを用意する必要があります （1x、2x、3x） 。

最初に75x 75hピクセルで3x（最大：144 x 96）を作成し、iconTab0 @ 3x.pngとして保存します。

次に、サイズを50w 50hピクセル（最大：96 x 64）に変更し、iconTab0 @ 2x.pngとして保存します。

最後に25w 25hピクセル（最大：48 x 32）にサイズを変更し、iconTab0.pngとして保存します。

必要なのは、Finderでこれらの3つの画像を選択し、画像アセットにドラッグすることだけです。

ヒューマンインターフェイスガイドライン

enter image description here

enter image description here

91
Leo Dabus

別のオプションは、ベクター画像PDFを作成することです。行うことは、ベクトル画像のサイズを最小サイズ（22x22）に変更し、PDFファイルにエクスポートすることです。 Adobe Illustrator、Sketch、および他の多くのベクター画像編集ツールを使用してこれを行うことができます。

次に、PDFファイルをアセットフォルダーに追加し、プロパティインスペクターで[スケール係数]を[単一ベクトル]に設定します。これでうまくいくはずです！

47
Mark Moeykens

ios8でこれを行うのはとても簡単です。ストーリーボードで、各タブ項目（画像を変更するタブの個々のコントローラー）をクリックします。

insetsを適宜設定してください...

enter image description here

この問題 があります。 this で修正されました。

24
Ryan Walton

@LeoDabusは良い答えを提供しました。

画像のサイズを変更するためのこれを行うための良い簡単な方法は次のとおりです。

  1. Assets.xcassetsフォルダーの1x、2x、3xボックスに画像を追加します。
  2. 次に、各ボックスの画像をクリックし、トラックパッドをダブルフィンガーでタップ/右クリックして、ここでオプションを表示します。

Open with External Editor

  1. [外部エディターで開く]をクリックすると、プレビューが表示されます。
  2. [ツール]、[サイズの調整]の順にクリックします。

Adjust Size

  1. 要件に基づいて画像のサイズを調整します。次に、「保存」をクリックしてウィンドウを閉じます。 Xcodeの画像は自動更新されるはずです。
14
Colin Hong