Flutterでテキストを垂直方向と水平方向の中央に配置するにはどうすればよいですか？

テキストウィジェットのコンテンツをFlutterで垂直方向と水平方向の中央に配置する方法を知りたいのですが。Center(child: Text("test"))コンテンツ自体ではなく、ウィジェット自体を使用して中央揃えにする方法しか知りません。デフォルトでは、左揃えになっています。Androidでは、これを実現するTextViewのプロパティはと呼ばれていると思いgravityます。

私が欲しいものの例：

水平方向の配置のみを設定するテキスト配置中央プロパティ。

以下のコードを使用して、テキストを垂直方向と水平方向の中央に設定しました。

コード：

      child: Center(
        child: Text(
          "Hello World",
          textAlign: TextAlign.center,
        ),
      ),

コンストラクターのTextAlignプロパティを使用できますText。

Text("text", textAlign: TextAlign.center,)

私は、より柔軟なオプションがラップすることだと思うText()とAlign()そうのように：

Align(
  alignment: Alignment.center, // Align however you like (i.e .centerRight, centerLeft)
  child: Text("My Text"),
),

テキストウィジェットでの使用Center()はTextAlign完全に無視されているようです。整列しTextAlign.leftないTextAlign.rightか、試行しても中央に残ります。

                       child: Align(
                          alignment: Alignment.center,
                          child: Text(
                            'Text here',
                            textAlign: TextAlign.center,                          
                          ),
                        ),

これは私にとって最高の結果を生み出しました。

Center of SizedBox内のテキスト要素は、サンプルコードの下ではるかにうまく機能します

Widget build(BuildContext context) {
    return RawMaterialButton(
      fillColor: Colors.green,
      splashColor: Colors.greenAccent,
      shape: new CircleBorder(),
      child: Padding(
        padding: EdgeInsets.all(10.0),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            SizedBox(
              width: 100.0,
              height: 100.0,
              child: Center(
                child: Text(
                widget.buttonText,
                maxLines: 1,
                style: TextStyle(color: Colors.white)
              ),
              )
          )]
        ),
    ),
  onPressed: widget.onPressed
);
}

コーディングをお楽しみください👨‍💻

テキストを中央に配置します。

Container(
      height: 45,
      color: Colors.black,
      child: Center(
        child: Text(
            'test',
            style: TextStyle(color: Colors.white),
        ),
      ),
    );

Intellij IDEユーザーの場合は、ショートカットキーAlt+Enterを使用して、選択Wrap with Centerしてから追加できます。textAlign: TextAlign.center

概要：Flexウィジェットを使用して、横軸に沿ってMainAxisAlignment.centerを使用してページのテキストを中央揃えにしました。コンテナのパディングを使用して、テキストの周囲に余白スペースを作成します。

  Flex(
            direction: Axis.horizontal,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
                Container(
                    padding: EdgeInsets.all(20),
                    child:
                        Text("No Records found", style: NoRecordFoundStyle))
  ])

多分あなたは2つのコンテナに同じ幅と高さを提供したいです

Container(
            width: size.width * 0.30, height: size.height * 0.4,
            alignment: Alignment.center,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(6)
            ),
            child: Center(
              child: Text(categoryName, textAlign: TextAlign.center, style: TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 17,
                color: Colors.white,
              ),),
            ),