前回の指定方法だと、Imageに指定したファイルに含まれるイメージのサイズによってレイアウトが変わってしまう。
前回の実装の表示
いろいろと、修正すべき点が。
- 指定したイメージデータが小さいため、Imageが小さい → 広告ビューにかぶらないくらい大きくしたい
Googleの広告ビューが左寄せになっている → 中央に配置したい-> やり直してみたら、中央寄せになってました
UIImageViewと同様の使い方希望
もちろん、自動でサイズが調整されると嬉しい時もありますが、今回は、写真のスライドショーを表示させたいので、写真ごとにビューのサイズが変わるよりは、ビューのサイズは固定で、写真データをスケールする使い方をしたいです。
UIImageViewだとスケールのさせ方まで選ぶことができましたが、Imageではどうなんでしょうか。
Imageを大きく配置
AppleのドキュメントでStructure-Imageを確認するといろいろなプロパティが確認できるんですが、その中に、frameもありました。
もちろん、frameのサイズを指定するケースもあると思うんですが、今回は、いろいろなサイズのあるiPhone/iPadでできるだけ大きく表示させたいのです。
ここのframeは、UIView等のframeとは、意味合いが違うそうです。
Googleしたり、ドキュメントをみたりしていると怪しい(?)メソッドが。その名もresizable。
できちゃいました。resizableの引数の中にresizingModeというのがあるので、スケールするときの方法も指定できるっぽい。→ と思ったのですが、違いました。orz .tileって指定したら、タイル状に敷き詰めてくれるかと期待したけどそうもならず、このオプションなに?
あきらめずに、Imageのドキュメントを読み続けてみつけました。scaleToFit()。他に、scaleToFill()もあるので、UIImageViewと同様に設定ができるっぽい。表示したいものが写真なので、Aspect比を変更したくないので、scaleToFit指定。
やっと、やりたいことができた!
最終的に以下のようなコードになりました。
VStack(){ Image(systemName: "pencil").resizable().scaledToFit() AdBanner(adUnitId: "ca-app-pub-XXXXXXXXXXXX").expectedFrame() // test id }
- Appleのドキュメントは、あまりきちんと記述されてない。ちょくちょく”No overview available”とか書いてあって、名前から推測するしかないケースが多い
- Landscapeモードでプレビューする方法はないらしい。でも、Simulatorで動かせば確認できるので、そこまでクリティカルな問題ではない
- InterfaceBuilderで設定すると、InterfaceBuilderのタブを色々と切り替えてそれぞれを確認しなければいけなかったけど、SwiftUIはそこにコードで設定が記載されているので、わかりやすい
Sponsor Link