「Flutter/UI/Text」の版間の差分

2020年1月6日 (月) 02:03時点における最新版

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,
),