質問するログイン新規登録

質問編集履歴

3

内容の追記

2018/09/21 16:22

投稿

RyomaD
RyomaD

スコア34

title CHANGED
File without changes
body CHANGED
@@ -10,4 +10,88 @@
10
10
  以下のように出力されます。
11
11
  ![イメージ説明](78b2a599c14cf73eacf3a4928d936f45.png)
12
12
 
13
+ コードは以下になります。
14
+ ```swift
15
+ @IBOutlet weak var mainStackView: UIStackView!
16
+ @IBOutlet weak var navigationLabel: UILabel!
17
+ @IBOutlet weak var finishEditingButton: UIButton! //編集の終了
18
+ @IBOutlet weak var editPhotoView: UIView! //トリミングで残す範囲を可視化するためのUIView
19
+ @IBOutlet weak var headerView: UIView!
20
+ @IBAction func cancelButton(_ sender: Any) {
21
+ dismiss(animated: true, completion: nil)
22
+ }
23
+
24
+ var image : UIImage!
25
+ var imageView : UIImageView! //トリミング対象画像を表示するためのUIImageView
26
+ var previousImages = [UIImage]()
27
+ var nextImages = [UIImage]()
28
+ var scaleZoomedInOut : CGFloat = 1.0 //拡大・縮小した時にはUIImageViewのサイズのみが変わるので、実際のUIImageのサイズとUIImageViewとの倍率の差を記録する
29
+ var previousScaleZoomedInOut = [CGFloat]()
30
+ var nextScaleZoomedInOut = [CGFloat]()
31
+
32
+
33
+ override func viewDidLoad() {
34
+ super.viewDidLoad()
35
+ }
36
+
37
+ override func viewDidAppear(_ animated: Bool) {
38
+ super.viewWillAppear(true)
39
+ finishEditingButton.addTarget(self, action: #selector(finishEdittingAlert), for: .touchUpInside)
40
+
41
+ editPhotoView.layer.borderColor = UIColor.black.cgColor
42
+ editPhotoView.layer.borderWidth = 1
43
+ setUpPinchInOutAndDoubleTap()
44
+
45
+ //load image and show UIImageView
46
+ let appDelegate = UIApplication.shared.delegate as! AppDelegate
47
+ image = appDelegate.photoLibraryImage
48
+ previousScaleZoomedInOut.append(scaleZoomedInOut)
49
+ createImageView(sourceImage: image, on: editPhotoView)
50
+ mainStackView.bringSubview(toFront: headerView)
51
+ }
52
+
53
+ //ピンチイン/アウト・ダブルタップの検出
54
+ func setUpPinchInOutAndDoubleTap(){
55
+ // ピンチイン・アウトの準備
56
+ let pinchGetsture = UIPinchGestureRecognizer(target: self, action: #selector(pinchAction(gesture:)))
57
+ pinchGetsture.delegate = self as? UIGestureRecognizerDelegate
58
+
59
+ self.editPhotoView.isUserInteractionEnabled = true
60
+ self.editPhotoView.isMultipleTouchEnabled = true
61
+
62
+ self.editPhotoView.addGestureRecognizer(pinchGetsture)
63
+ // ダブルタップの準備
64
+ let doubleTapGesture = UITapGestureRecognizer(target: self, action:#selector(doubleTapAction(gesture:)))
65
+ doubleTapGesture.numberOfTapsRequired = 2
66
+ self.editPhotoView.addGestureRecognizer(doubleTapGesture)
67
+ }
68
+
69
+ //画像の全体が把握できるように、画像本体(UIImage)の幅がスクリーンの幅よりも大きい時は、画像を画面の幅に合わせたUIImageViewとして表示するという処理を施す関数
70
+ func createImageView(sourceImage: UIImage, on parentView: UIView){
71
+ imageView = UIImageView(image: sourceImage)
72
+ // 画像の幅・高さの取得
73
+ let imageWidth = sourceImage.size.width
74
+ let imageHeight = sourceImage.size.height
75
+ let screenWidth = editPhotoView.frame.width
76
+ let screenHeight = editPhotoView.frame.height
77
+
78
+ if scaleZoomedInOut == 1.0{
79
+ if imageWidth > screenWidth{
80
+ scaleZoomedInOut = screenWidth/imageWidth
81
+ }
82
+ }
83
+
84
+ let rect:CGRect = CGRect(x:0, y:0, width:scaleZoomedInOut*imageWidth, height:scaleZoomedInOut*imageHeight)
85
+ imageView.frame = rect// ImageView frame をCGRectで作った矩形に合わせる
86
+ imageView.contentMode = .scaleAspectFill // Aspect Fill = 縦横の比率はそのままで短い辺を基準に全体を表示する
87
+ imageView.center = CGPoint(x:screenWidth/2, y:screenHeight/2) // 画像の中心をスクリーンの中心位置に設定
88
+
89
+ parentView.addSubview(imageView)
90
+ parentView.sendSubview(toBack: imageView)
91
+ }
92
+ ```
93
+ ご親切にコードでもアドバイスをいただいておりますがどうしても、
94
+ 横長の画像を出力する際にUIViewの縦の比率に対して画像の縦の長さに収まらずにいます。(ぴったりしない)
95
+
96
+
13
97
  よろしくお願いします。

2

内容の追記

2018/09/21 16:22

投稿

RyomaD
RyomaD

スコア34

title CHANGED
File without changes
body CHANGED
@@ -6,5 +6,8 @@
6
6
  以下のような形で表示させたいのですが、(UIViewの縦の比率に画像の縦を合わせる)やり方が解らずに困っています。どなたかご存知の方がいらっしゃればご教授いただけないでしょうか。
7
7
  コードでもstorybord上からでも構いません。
8
8
  ![イメージ説明](84c7e7c11e5bdaf4781f4fead12100c4.jpeg)
9
+ ちなみに Content Mode を Aspect Fillに設定した場合は、
10
+ 以下のように出力されます。
11
+ ![イメージ説明](78b2a599c14cf73eacf3a4928d936f45.png)
9
12
 
10
13
  よろしくお願いします。

1

内容の修正

2018/09/20 16:08

投稿

RyomaD
RyomaD

スコア34

title CHANGED
@@ -1,1 +1,1 @@
1
- swift4 UIImage上で画像を縦比率だけ保持して表示させたい。
1
+ swift4 UIViewの比率に画像の縦を合わせたい。
body CHANGED
@@ -3,7 +3,7 @@
3
3
  ![イメージ説明](256db39f3feb45d441df66679b68f095.jpeg)
4
4
  以下のようなUIImage内で,
5
5
  ![イメージ説明](a4ac498c7704b7908f50530a804c033b.png)
6
- 以下のような形で表示させたいのですが、(縦の比率は保持したまま)やり方が解らずに困っています。どなたかご存知の方がいらっしゃればご教授いただけないでしょうか。
6
+ 以下のような形で表示させたいのですが、(UIViewの縦の比率に画像の縦を合わせる)やり方が解らずに困っています。どなたかご存知の方がいらっしゃればご教授いただけないでしょうか。
7
7
  コードでもstorybord上からでも構いません。
8
8
  ![イメージ説明](84c7e7c11e5bdaf4781f4fead12100c4.jpeg)
9
9