テキストに1行目のみ表示する方法

【実装したい機能】
テキストに保存された文書(データ)を表示させたいのですが、文書が長いため、テキスト1行分のみ表示する方法を教えてください。
保存された文書は、改行されている場合もあります。

下記のようにテキストに文書1行のみ表示させ、残りは非表示にさせたい。
改行された文書は、1行目のみ、もしくは改行をなくした状態の1行のみを表示させたい。

【試したこと①】
表示するテキストのレイアウトのmax heightを30pxで制限すると、1行で収まる文書は表示されますが、収まらない長い文書は全て非表示になります。
改行された文書は1行目も含めて非表示になります。
レイアウトをfixed-heightにしても同様に非表示になります。

【試したこと②】
テキストのレイアウトのmax heightをなくしてfit heightにし、テキストの表示をtruncated toで文字数を制限しますと、長い文書は文字制限で表示されますが、改行された文書が文字数制限で改行のまま表示され、1行で表示することができませんでした。

【試したこと③】
表示するテキストのレイアウトのmax heightを30pxで制限し、テキストの表示をtruncated toで文字数を制限しますと、長い文書は文字制限で表示されますが、改行された文書は1行目も含めて非表示になります。

「いいね!」 2

@Hirooo さん

想定されているものと違ったら申し訳ないのですが、
一行目というより何文字目以降を…のように表記させる方法では解決できませんでしょうか?
(1行目○文字と別途定義していただければ想定している仕様になるのかなと思いまして)

もしこの方法で解決するようでしたら、
以下のように設定することで、
解決できますので、
情報としてお納めください。
(こちらは文字数が100文字を超えた場合は…で表示させるように設定しています。)

エディタは以下のように設定すると、
スクリーンショット 2023-03-06 0.07.49

Previewでは以下のように表示されます

スクリーンショット 2023-03-06 0.12.50

「いいね!」 1

@muku さん

ありがとうございます。
1行で表示できるように文字数を制限するということですね。
教えていただいた内容でほとんど解決できますが、文書が改行されている場合に下記のように改行されて2行で表示されてしまいます。

改行された文書の場合は、改行をなくしてから文字数を制限できれば一番良いのですが。
改行をなくしてから文字数を数える方法はご存知でしょうか?

@muku さん

もしご存知でしたらもう1点教えてください。
number of charactersで文字数を数える場合ですが、全角の文字を半角2文字などとして数える方法はありますでしょうか?

例えばですが、下記は50文字を超えた場合に49文字…で表示していますが、文書が半角の場合は1行で余白が多くなります。

50文字

文書は全角がほとんどですのであまり拘らなくても良いと思いますが、文書の中で英単語があると、少し文が短く…となるため、見栄えを良くできればと思ってです。

よろしくお願いいたします。。。

こちらご参照くださいー!

「いいね!」 3

@Aki_Sydney
ご回答ありがとうございます!

Responsiveでは動作するのですが、Previewにすると何故か動作しませんでした。
!importantも付けたのですが、なかなか難しいですね。

調べて頑張ってみます。

「いいね!」 1

正規表現で、(.*)[^\r\n]* のようにしたら1行目だけ取り出せませんか?
1行目が長い場合は末尾を切って「…」にする対応が必要ですが。

「いいね!」 1

@jansnap さん
ありがとうごさいます!
改行された文が1行で表示することができました。

@muku さん
@Aki_Sydney さん
勉強になりました。
教えていただき、ありがとうごました。

「いいね!」 1