ビルドすると投稿の文字の最後が・・・になって切れている、切れずに全ての文章を表示させて、カードの高さを変えるようにするには

実現したいこと

このコードでビルドすると投稿の文字の最後が・・・になって切れている、切れずに全ての文章を表示させて、カードの高さを変えるようにするには

発生している問題・分からないこと

投稿の文字が切れている問題を解決できない

該当のソースコード

swift
1struct QuestionDetailView: View {
2    @Binding var question: Question
3    @State private var newAnswer = ""
4    @State private var isLiked = false
5    @State private var showingReportSheet = false
6    @State private var showingAnswerForm = false
7    @State private var showingDeleteQuestionAlert = false // 追加
8    @State private var showingBlockUserAlert = false // 追加
9    @EnvironmentObject var viewModel: AppViewModel
10    var body: some View {
11       ScrollView {
12           VStack(spacing: 20) {
13               // Question card
14               VStack(alignment: .leading, spacing: 20) {
15                   // Status
16                   HStack {
17                       HStack(spacing: 8) {
18                           Circle()
19                               .fill(question.statusColor)
20                               .frame(width: 12, height: 12)
21                           Text(question.statusText)
22                               .font(.system(size: 12, weight: .medium))
23                               .foregroundColor(question.statusColor)
24                       }
25                       .padding(.horizontal, 12)
26                       .padding(.vertical, 6)
27                       .background(question.statusColor.opacity(0.1))
28                       .cornerRadius(12)
29                       
30                       Spacer()
31                       
32                       HStack(spacing: 8) {
33                           Image(systemName: question.category.icon)
34                               .font(.system(size: 14))
35                           Text(question.category.rawValue)
36                               .font(.system(size: 12, weight: .medium))
37                       }
38                       .foregroundColor(question.category.color)
39                       .padding(.horizontal, 12)
40                       .padding(.vertical, 6)
41                       .background(question.category.color.opacity(0.1))
42                       .cornerRadius(12)
43                   }
44                   // Author info
45                   HStack(spacing: 12) {
46                       ZStack {
47                           Circle()
48                               .fill(Color.primaryNavy)
49                               .frame(width: 44, height: 44)
50                           
51                           Image(systemName: getQuestionAuthorIcon(for: question.authorName))
52                               .font(.system(size: 20))
53                               .foregroundColor(.white)
54                       }
55                       
56                       VStack(alignment: .leading, spacing: 4) {
57                           Text(getQuestionAuthorDisplayName(for: question.authorName))
58                               .font(.system(size: 14, weight: .semibold))
59                               .foregroundColor(.black)
60                           Text(question.timeAgo)
61                               .font(.system(size: 10))
62                               .foregroundColor(.textGray)
63                       }
64                       
65                       Spacer()
66                   }
67                   Text(question.title)
68                       .font(.system(size: 16, weight: .bold))
69                       .foregroundColor(.black)
70                       .fixedSize(horizontal: false, vertical: true) // この行を追加
71                   // 画像表示
72                   if !question.images.isEmpty {
73                       ScrollView(.horizontal, showsIndicators: false) {
74                           HStack(spacing: 12) {
75                               ForEach(0..<question.images.count, id: \.self) { index in
76                                   Image(uiImage: question.images[index])
77                                       .resizable()
78                                       .aspectRatio(contentMode: .fill)
79                                       .frame(width: 120, height: 120)
80                                       .cornerRadius(12)
81                                       .clipped()
82                                       .onTapGesture {
83                                           // 画像拡大表示の処理
84                                       }
85                               }
86                           }
87                           .padding(.horizontal, 4)
88                       }
89                   }
90                      
91                   // Tags
92                   if !question.tags.isEmpty {
93                       ScrollView(.horizontal, showsIndicators: false) {
94                           HStack(spacing: 8) {
95                               ForEach(question.tags, id: \.self) { tag in
96                                   Text("#\(tag)")
97                                       .font(.system(size: 12, weight: .medium))
98                                       .foregroundColor(.primaryNavy)
99                                       .padding(.horizontal, 10)
100                                       .padding(.vertical, 4)
101                                       .background(Color.primaryNavy.opacity(0.1))
102                                       .cornerRadius(10)
103                               }
104                           }
105                       }
106                   }
107                   
108                   // Actions
109                   HStack(spacing: 24) {
110                       // いいねボタン
111                       Button {
112                           toggleLike()
113                       } label: {
114                           HStack(spacing: 6) {
115                               Image(systemName: isLiked ? "heart.fill" : "heart")
116                                   .foregroundColor(.accentOrange)
117                               Text("\(question.likes)") // UIでは実際のlikesの値のみ表示
118                                   .font(.system(size: 14, weight: .medium))
119                                   .foregroundColor(.textGray)
120                           }
121                       }
122                       
123                       Button {
124                           // Share
125                       } label: {
126                           HStack(spacing: 6) {
127                               Image(systemName: "square.and.arrow.up")
128                                   .foregroundColor(.secondaryTeal)
129                               Text("シェア")
130                                   .font(.system(size: 14, weight: .medium))
131                                   .foregroundColor(.secondaryTeal)
132                           }
133                       }
134                       
135                       Button {
136                           viewModel.toggleSavedStatus(for: question)
137                       } label: {
138                           HStack(spacing: 6) {
139                               Image(systemName: question.isSaved ? "star.fill" : "star")
140                                   .foregroundColor(question.isSaved ? .yellow : .textGray)
141                               Text("保存")
142                                   .font(.system(size: 14, weight: .medium))
143                                   .foregroundColor(.textGray)
144                           }
145                       }
146                       
147                       Spacer()
148                       
149                       // 自分の質問の場合は削除ボタン、他人の質問の場合は報告・ブロックボタン
150                       if isQuestionAuthor() {
151                           Button {
152                               showingDeleteQuestionAlert = true
153                           } label: {
154                               Image(systemName: "trash")
155                                   .foregroundColor(.errorRed)
156                           }
157                       } else {

試したこと・調べたこと

teratailやGoogle等で検索した
ソースコードを自分なりに変更した
知人に聞いた
その他

上記の詳細・結果

修正後のコード:
swiftText(question.title)
.font(.system(size: 14, weight: .semibold))
.foregroundColor(.black)
.lineLimit(nil) // または .lineLimit(5) など適切な行数を指定
.multilineTextAlignment(.leading)
.fixedSize(horizontal: false, vertical: true) // 縦方向に必要な分だけ拡張
他の選択肢

完全に制限なし:

swiftText(question.title)
.font(.system(size: 14, weight: .semibold))
.foregroundColor(.black)
// .lineLimit(2) を削除
.multilineTextAlignment(.leading)

最大行数を増やす:

swiftText(question.title)
.font(.system(size: 14, weight: .semibold))
.foregroundColor(.black)
.lineLimit(4) // 2から4行に変更
.multilineTextAlignment(.leading)

動的に調整:

swiftText(question.title)
.font(.system(size: 14, weight: .semibold))
.foregroundColor(.black)
.lineLimit(question.title.count > 50 ? 4 : 2) // 文字数に応じて調整
.multilineTextAlignment(.leading)

補足

特になし

isBoal

2025/08/19 03:10

スクリーンショットの情報が不足しているため回答が難しいです。本文を編集して追記いただけますか？

行動規範の内容に同意します

回答1件

ベストアンサー

...になる理由はframeに収まらないからだけど解決法がいくつかあるよ

frameを大きくする
文字を小さくする
スクロールできるようにする
文章を分ける（次へボタン）
ビューを分ける（詳細ボタン）

1や2でもとりあえず対応できるかもだけど
ユーザー入力次第で破綻しちゃうよね
例えばlineLimit(5)にしたとしよう
改行が5個以上あったらそれはもう表示できないんだわ
やるなら入力時点で文字数と改行制限するか？

無制限なら基本的に3～5がオススメ
スクロールならScrollViewで出来る
ページを分けるなら詳細viewに遷移できる

ちなみに枠のサイズだけど
GeometryReaderで取れるよ
上で書いた通り枠サイズでは対応しきれないと思ふ

投稿2025/08/20 11:14

編集2025/08/20 11:15

Ham-tail

総合スコア14

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

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

ただいまの回答率
85.30%

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

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

質問する