質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
TableView

TableView(UITableView)とは、リスト形式で表示するコントロールで、ほとんどのアプリに使用されています。画面を「行」に分けて管理し、一般的には各行をタップした際に詳細画面に移動します。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Q&A

解決済

2回答

628閲覧

tableViewのimageViewの表示幅をそろえたい

SakuTaka

総合スコア12

TableView

TableView(UITableView)とは、リスト形式で表示するコントロールで、ほとんどのアプリに使用されています。画面を「行」に分けて管理し、一般的には各行をタップした際に詳細画面に移動します。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

0グッド

0クリップ

投稿2019/04/19 01:36

編集2019/04/19 06:51

swift,xcode,iOS開発の超超初心者です。
tableViewのimageViewの表示幅をそろえたいのですが、うまくいきません。

完全にどんぴしゃの記事がこちらのサイト
https://teratail.com/questions/31558
にあったのでそのとおりやりましたが、まったく何も変わりません。

以下コードです。

swift

1final class DocumentListViewController: BusinessViewController, UITableViewDataSource, UITableViewDelegate { 2 func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 3 let cell = UITableViewCell(style:UITableViewCell.CellStyle.default,reuseIdentifier:"aaa") 4 5 /// 画像サムネイル設定 6 if let image = UIImage(contentsOfFile: pth) { 7 cell.imageView?.image = image.resize(size: CGSize(width:200,height:100)) //←画像のサイズを変更してみたり 8 } 9 10 cell.imageView?.layer.borderColor = UIColor.red.cgColor //←imageViewをわかりやすくしてみたり 11 cell.imageView?.layer.borderWidth = 1 12 cell.imageView?.translatesAutoresizingMaskIntoConstraints = true 13 cell.imageView?.frame = CGRect(x:0,y:0,width:1000,height:200) //←imageViewのサイズを設定してみたり 14 if let textLabel = cell.textLabel { 15 textLabel.text = fnm 16 textLabel.frame = CGRect(x:200,y:0,width:1000,height:200) //←左に位置するtextLabelのxを設定してみたり 17 } 18 return cell 19 } 20}

どうすればよいのでしょうか。

初期状態
スクリーンショット

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

resize(size:)の修正

指定サイズの描画領域を用意し、その中央にリサイズ後の画像を描画するようにします。
参考記事の該当部分を置き換えて下さい。

swift

1UIGraphicsBeginImageContextWithOptions(size, false, 0.0) 2draw(in: CGRect(x: (size.width - resizedSize.width) / 2, y: (size.height - resizedSize.height) / 2, width: resizedSize.width, height: resizedSize.height))

画像の設定

サイズは200x100を想定しています。
frameやcontentModeなどの設定は不要で、imageの設定のみで大丈夫です。

swift

1if let image = UIImage(contentsOfFile: pth) { 2 cell.imageView?.image = image.resize(size: CGSize(width: 200, height: 100)) 3 4 cell.imageView?.layer.borderColor = UIColor.red.cgColor 5 cell.imageView?.layer.borderWidth = 1 6}

投稿2019/04/19 02:03

編集2019/04/19 05:11
fuzzball

総合スコア16731

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

SakuTaka

2019/04/19 02:21

ありがとうございます。 スクリーンショットを追加しました。
fuzzball

2019/04/19 02:23

これ例えば、PDFとか望遠鏡(?)はどのように表示されればいいんでしょうか?
SakuTaka

2019/04/19 02:27

すみません。スクリーンショットを置き換えました。 右側の文字の先頭を揃えたい ということです。
fuzzball

2019/04/19 02:36 編集

画像が右端揃えになってもいいってことですか? 画像が一部しか表示されなくなってもいいですか?
fuzzball

2019/04/19 02:41

ちょっとコード書き換えました。(リサイズ処理) これでどうなりますか?(frame設定は「あり」「なし」両方試して下さい)
SakuTaka

2019/04/19 02:46

右揃えでも一部でも構いません。テキストの先頭が揃えられればOKです。 どちら決めるとすると、一部にします。
SakuTaka

2019/04/19 02:52

コードをresizeに書き換えましたが、全く結果は変わりません。
fuzzball

2019/04/19 02:57

あー、resizeが思ってるのと違うのかな。ちょっとresize見てみます。
SakuTaka

2019/04/19 03:04 編集

やりとりしてて気がついたのですが トリミングして画像の縦横比率を揃えれば良いのかと。 その線で調べ始めています。 ありがとうございます。
SakuTaka

2019/04/19 04:42

トリミングでなんとかなりそうなのですが トリミングの前にリサイズして切り取り場所を調整しようと思ったのですが リサイズが思うようにできておらず調査中です。
fuzzball

2019/04/19 05:04

回答に追記しましたが、こういうことでしょうか?
fuzzball

2019/04/19 05:12

回答整理しました。 ImageViewのサイズが勝手に変わっちゃうので、Image自体のサイズを変えないとダメみたいですね。 こういうのはカスタムセル作っちゃうのでいい勉強になりました。
SakuTaka

2019/04/19 05:14

まずresizeのメソッド名を(resize2に)変更したら呼ばれるようになったようです。 ただ縦横の比率が同じだとそもそもの問題は以前解決しないようです。 また縦横比率を変えて指定サイズに変更するようにしたら、一応問題自体は解決しました。
SakuTaka

2019/04/19 05:17

imageViewのサイズを指定して、その中に画像をレイアウトできるようなイメージでいましたが、 そうではなさそうですね。 逆にカスタムセルにしないと希望のようなことはできない と理解すべきだということですね。 ありがとうございました。
fuzzball

2019/04/19 05:17

追記見てませんでした。 呼ばれないのは、シグネチャがおかしいからですね。 func resize(_size: CGSize) ではなくて func resize(size: CGSize) です。
fuzzball

2019/04/19 05:18

>>逆にカスタムセルにしないと希望のようなことはできない >>と理解すべきだということですね。 現在の回答で出来ると思いますよ。
SakuTaka

2019/04/19 05:56

恐れ入ります。回答コードに変更したらこうなっちゃいました というスクショを貼りました。
fuzzball

2019/04/19 05:57

resize側も含めて、現在のコードを書いてもらえますか。
SakuTaka

2019/04/19 06:14

追記しました。 どうも何か基本的に変なことをやってるのでしょうか。
fuzzball

2019/04/19 06:20 編集

resizeのコード、 あなたのコードの _size を size に変更するか、 私のコードの size を _size に変更して下さい。 14:17のコメントは見落としてますか?
SakuTaka

2019/04/19 06:51

大変失礼しました。できました。 ありがとうございました。
guest

0

自己解決

結果的に3つの方法、画像をトリミング、縦横比率を保持してリサイズ、比率を無視してリサイズする方法がわかりました。

swift

1extension UIImage { 2 //比率を保持してリサイズ 3 func resize2(_size: CGSize) -> UIImage { 4 print(_size.width.description+"x"+_size.height.description) 5 let widthRatio = _size.width / self.size.width 6 let heightRatio = _size.height / self.size.height 7 let ratio = (widthRatio < heightRatio) ? widthRatio : heightRatio 8 let resizedSize = CGSize(width: (self.size.width * ratio), height: (self.size.height * ratio)) 9 UIGraphicsBeginImageContextWithOptions(_size, false, 0.0) 10 draw(in: CGRect(x: (_size.width - resizedSize.width) / 2, y: (_size.height - resizedSize.height) / 2, width: resizedSize.width, height: resizedSize.height)) 11 let resizedImage = UIGraphicsGetImageFromCurrentImageContext() 12 UIGraphicsEndImageContext() 13 return resizedImage ?? self; 14 } 15 //比率を無視してリサイズ 16 func reSizeImage(reSize:CGSize)->UIImage { 17 UIGraphicsBeginImageContextWithOptions(reSize,false,UIScreen.main.scale); 18 self.draw(in: CGRect(x: 0, y: 0, width: reSize.width, height: reSize.height)); 19 let reSizeImage:UIImage! = UIGraphicsGetImageFromCurrentImageContext(); 20 UIGraphicsEndImageContext(); 21 return reSizeImage; 22 } 23 //トリミング 24 func trim(trimmingArea: CGRect) -> UIImage { 25 let imgRef = self.cgImage?.cropping(to: trimmingArea) 26 let trimImage = UIImage(cgImage: imgRef!, scale: self.scale, orientation: self.imageOrientation) 27 return trimImage 28 } 29}

■(比率を保持した)リサイズの場合

swift

1cell.imageView?.image = image.resize2(_size: CGSize(width:500,height:500))

比率を保持したリサイズの場合

■(比率を無視した)リサイズの場合

swift

1cell.imageView?.image = image.reSizeImage(reSize: CGSize(width:500,height:500))

リサイズの場合

■トリミングの場合

swift

1cell.imageView?.image = image.trim( trimmingArea: CGRect(x: 0, y: 0, width: 300, height: 300))

トリミングの場合
※課題は
トリミング指定領域より小さい画像の場合と、大きすぎて端っこの部分だけになってしまう場合です。
縦横比率を指定して中央部分をトリミングするようにしないとと思っています。

投稿2019/04/19 06:57

編集2019/04/19 07:04
SakuTaka

総合スコア12

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

SakuTaka

2019/04/19 07:01 編集

すみません。アドバイスをいただいた方がいたのですが その方の回答をベストアンサーにする方法がわかりませんでした。 申し訳ありません。こちらは初めてなもので。m(_ _)m
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問