API からテキストを取得します。それに一定量のスペースを割り当てます (幅: 300.0、高さ: 100.0 の最大コンテナーとします)。場合によっては、テキストがフォント サイズ 30.0 のコンテナーに収まることがあります。また、テキスト サイズを 24.0 に設定しないと収まらないこともあります。
親コンテナのスペースに基づいてテキストのサイズを動的に変更する方法はありますか?
私は、ConstrainedBox を使って Container を構築しました。これにより、テキスト スペースの最大サイズを定義できます。また、Text を LayoutBuilder でラップしました。テキスト スペースの高さをチェックし、それに基づいてテキストのサイズを決定できればと思いました。次のようになります。
Container(
child: ConstrainedBox(
constraints: BoxConstraints(
minWidth: 300.0,
maxWidth: 300.0,
minHeight: 30.0,
maxHeight: 100.0,
),
child: LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
if (/* height is larger than 100.0? height is over the constraints? */) { return textWithSize24(); }
return textWithSize30();
}),
),
),
「サイズが 30.0 の場合にテキストが占める高さ」をどのように判断すればよいでしょうか。おそらく、私は間違った方法でこれにアプローチしていて、maxLines代わりに を使用してこれを判断する必要があるのでしょうか。しかし、 を超えたことをどのように知るのでしょうかmaxLines。
もう 1 つの方法は、文字列内の文字数を使用して、フォント サイズを変更するタイミングを決定することです。これは手動のようです。
ベストアンサー1
使用できますFittedBox高さまたは幅に基づいてテキストを管理します。
例えば
TextウィジェットをウィジェットにラップするだけですFittedBox。ここでは、幅に基づいて AppBar テキストのサイズを変更します。
AppBar(
centerTitle: true,
title: FittedBox(
fit: BoxFit.fitWidth,
child: Text('Hey this is my long text appbar title')
),
),
テキストは AppBar の幅に基づいてサイズ変更されます。