Flutterを使用していて、ウィジェット（この場合はテキストウィジェット）に境界線を追加したいと思います。

TextStyleとTextを試しましたが、境界線を追加する方法がわかりませんでした。

with プロパティを持つにをTextFieldとして追加できます。childContainerBoxDecorationborder

new Container(
  margin: const EdgeInsets.all(15.0),
  padding: const EdgeInsets.all(3.0),
  decoration: BoxDecoration(
    border: Border.all(color: Colors.blueAccent)
  ),
  child: Text("My Awesome Border"),
)

ここに拡張された答えがあります。A DecoratedBoxはボーダーを追加するために必要なものですが、私はContainerマージンとパディングを追加するためにa を使用しています。

一般的な設定は次のとおりです。

Widget myWidget() {
  return Container(
    margin: const EdgeInsets.all(30.0),
    padding: const EdgeInsets.all(10.0),
    decoration: myBoxDecoration(), //             <--- BoxDecoration here
    child: Text(
      "text",
      style: TextStyle(fontSize: 30.0),
    ),
  );
}

どこBoxDecorationで

BoxDecoration myBoxDecoration() {
  return BoxDecoration(
    border: Border.all(),
  );
}

ボーダー幅

これらは、境界線の幅を持っている1、3と10それぞれ。

BoxDecoration myBoxDecoration() {
  return BoxDecoration(
    border: Border.all(
      width: 1, //                   <--- border width here
    ),
  );
}

ボーダの色

これらのボーダー色があります

• Colors.red
• Colors.blue
• Colors.green

コード

BoxDecoration myBoxDecoration() {
  return BoxDecoration(
    border: Border.all(
      color: Colors.red, //                   <--- border color
      width: 5.0,
    ),
  );
}

ボーダーサイド

これらの境界面があります

• 左（3.0）、上（3.0）
• ボトム（13.0）
• 左（青[100]、15.0）、上（青[300]、10.0）、右（青[500]、5.0）、下（青[800]、3.0）

コード

BoxDecoration myBoxDecoration() {
  return BoxDecoration(
    border: Border(
      left: BorderSide( //                   <--- left side
        color: Colors.black,
        width: 3.0,
      ),
      top: BorderSide( //                    <--- top side
        color: Colors.black,
        width: 3.0,
      ),
    ),
  );
}

ボーダー半径

これらは、国境半径を有し5、10および30それぞれ。

BoxDecoration myBoxDecoration() {
  return BoxDecoration(
    border: Border.all(
      width: 3.0
    ),
    borderRadius: BorderRadius.all(
        Radius.circular(5.0) //                 <--- border radius here
    ),
  );
}

続けて

DecoratedBox/ BoxDecorationは非常に柔軟です。さらに多くのアイデアについては、Flutter — BoxDecorationチートシートをお読みください。

ドキュメントに記載されているように、フラッターはパラメーターよりもコンポジションを優先します。ほとんどの場合、あなたが探しているのはプロパティではなく、ラッパー（そして時にはいくつかのヘルパー/「ビルダー」）です。

必要なのは境界線です。境界線を定義DecoratedBoxするdecorationプロパティがあります。背景画像や影も含まれます。

または、@ Azizaが言ったように、を使用できますContainer。これはDecoratedBox、SizedBoxと他のいくつかの便利なウィジェットの組み合わせです。

最良の方法はBoxDecoration（）を使用することです

利点

• ウィジェットのボーダーを設定できます
• ボーダーの色または幅を設定できます
• ボーダーの角を丸く設定できます
• ウィジェットのシャドウを追加できます

不利益

• BoxDecorationContainerウィジェットでのみ使用するため、ウィジェットをラップしたいContainer()
  
  

例

    Container(
      margin: EdgeInsets.all(10),
      padding: EdgeInsets.all(10),
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: Colors.orange,
        border: Border.all(
            color: Colors.pink[800],// set border color
            width: 3.0),   // set border width
        borderRadius: BorderRadius.all(
            Radius.circular(10.0)), // set rounded corner radius
        boxShadow: [BoxShadow(blurRadius: 10,color: Colors.black,offset: Offset(1,3))]// make rounded corner of border
      ),
      child: Text("My demo styling"),
    )

境界線を表示するには、BoxDecoration（）を使用するのが最良の方法です。

Container(
  decoration: BoxDecoration(
    border: Border.all(
    color: Color(0xff000000),
    width: 4,
  )),
  child: //Your child widget
),

ここで完全なフォーマットを表示することもできます

Containerを使用してウィジェットを含めることができます。

Container(
  decoration: BoxDecoration(
    border: Border.all(
    color: Color(0xff000000),
    width: 1,
  )),
  child: Text()
),

Boxdercorationでコンテナーを使用します。

 BoxDecoration(
    border: Border.all(
      width: 3.0
    ),
    borderRadius: BorderRadius.circular(10.0)
  );