

Swiftで一枚の画像に対して指定した位置に文字を入力する方法が知りたいです。

作りたいもののイメージとしてはオシャレな履歴書（可愛い画像に自分の名前や年齢、画像などの情報を入れる）になります。

現在の状況として、そもそもこういった場合

●1枚の画像を用意してそこに上からZStackなどを使って文字を載せる  
●背景色やサイズなどを指定して画像そのものをプログラミングするところから始める

のどちらが良いかわかっていない初心者です。

現状としては、1番目の『1枚の画像を用意してそこに上からZStackなどを使って文字を載せる』という方法で試行錯誤しています。

今書いているコードの肝は

[code]

    Zstack{
        Image("画像ファイル")
            .resizable()
            .aspectRation(contentMode: .fit)
    
        Text("文字入力１")
            .offset(x: -160, y: -80)
        Text("文字入力２")
            .offset(x: -160, y: -35)
    }
    
    
[/code]

という感じなのですが、この場合、画面上では自分の記入したい位置に文字が入力で来ている状態ですが、画面を横向きにしたり、使うiPhoneのサイズを変えると、画面座標での指定のため位置がズレてしまいます。

なので、画像そのものの座標を指定する必要があるのかな、と思っているのですが検索しても上手く情報に辿り着けません。

また、取り込んでいる画像のサイズそのものは変更したくない（作り終わった後に元の画像のサイズを維持して保存したい）のですが、どういったフレームワークやコードを試す、あるいは検索すると良いでしょうか？

教えていただけると嬉しいです。

よろしくお願いします。


CC BY-SA 4.0
2022-09-12T07:52:26.183
91054
2022-10-07T07:20:13.323
54356
question
swift
Swiftで画像の指定した位置に文字を入力する方法について


座標指定は難しいのでDragGestureでTextの位置を変更できるようにしてView自体を画像にしてみました。

[code]

    import SwiftUI
    
    struct ContentView: View {
      @State var dragAmount: CGPoint?
      
      var editorImage: some View {
        Image(systemName: "heart")
          .resizable()
          .frame(width: 100, height: 100, alignment: .center)
          .overlay {
            Text("hello")
              .position(self.dragAmount ?? .zero)
              .gesture( DragGesture().onChanged { self.dragAmount = $0.location } )
          }
      }
      
      var saveImage: some View {
        VStack {
          editorImage
        }
        .frame(width: 300, height: 300)
      }
      
      var body: some View {
        VStack {
          editorImage
          
          Button("SAVE") {
            Task {
              let renderer = ImageRenderer(content: saveImage)
              
              if let image = renderer.cgImage {
                UIImageWriteToSavedPhotosAlbum(.init(cgImage: image), nil, nil, nil)
              }
            }
          }
        }
      }
    }
    
[/code]


CC BY-SA 4.0
2022-09-13T13:06:20.663
91084
2022-10-07T07:20:13.323
2022-10-07T07:20:13.323
40856
40856
91054
answer