Flutter/UI/Text
提供: 初心者エンジニアの簡易メモ
body内に複数行textを表示
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'hello',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.display1,
),
RaisedButton(
child: Text('Back to MyPage 1'),
onPressed: () {
Navigator.pop(context);
},
),
],
),
),
色追加
Text(
'警告!',
style: TextStyle(
color: Colors.red,
),
)
右側にアイコン追加
trailingの部分
ListTile(
leading: ExcludeSemantics(child: CircleAvatar(child: Text(item))),
title: Text('This item represents $item.'),
subtitle: secondary,
trailing: Icon(Icons.info, color: Theme.of(context).disabledColor),
),
テキストを丸で囲む
new Container(
padding: const EdgeInsets.symmetric(horizontal: 5.0, vertical: 1.0),
decoration: BoxDecoration(
border: Border.all(color: Colors.blue),
borderRadius: BorderRadius.circular(10),
),
child: Text("hoge")
),
スクロール付きテキスト
ListView(
children: [
Container(
padding: const EdgeInsets.symmetric(vertical: 0.0, horizontal: 10.0)
+ MediaQuery.of(context).padding,
child: Center(
child: Text("1234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890")
)
)
],
);
一行表示
Text( '文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章文章', overflow: TextOverflow.ellipsis, ),
