Home > Software engineering >  insert multiple text in every container on flutter
insert multiple text in every container on flutter

Time:06-28

I have 2 container and I wanna insert some text in every container (text1 and text2 in my code), can someone help me to solve this case?

body: Column(
              children: <Widget>[
                Container(
                  color: Colors.red,
                  width: double.infinity,
                  height: 30,
                  text1
                  text2
                ),
                Container(
                  color: Colors.yellow,
                  width: double.infinity,
                  height: 30,
                  text1
                  text2
                )
              ],
            )

CodePudding user response:

Have you tried using Column as the container's child :

body: Column(
              children: <Widget>[
                Container(
                  color: Colors.red,
                  width: double.infinity,
                  height: 30,
                  child: Column(
                   children:[
                    text1
                    text2
                  ]
                ),
                Container(
                  color: Colors.yellow,
                  width: double.infinity,
                  height: 30,
                  child: Column(
                   children:[
                    text1
                    text2
                  ]
                )
              ],
            )

CodePudding user response:

To present string on UI you can use Text widget. If the is all about merging text you can do "$text1 $text2 or text1 text2

body: Column(
children: <Widget>[
  Container(
      color: Colors.red,
      width: double.infinity,
      height: 30,
      child: Text("$text1 $text2")),
  Container(
      color: Colors.yellow,
      width: double.infinity,
      height: 30,
      child: Text(text1   text2))
],
)

And if it is about column wise, insert another column for simplicity

body: Column(
  children: <Widget>[
    Container(
        color: Colors.red,
        width: double.infinity,
        height: 30,
        child: Column(
          children: [
            Text(text1),
            Text(text2),
          ],
        )),
    Container(
        color: Colors.yellow,
        width: double.infinity,
        height: 30,
        child: Column(
          children: [
            Text(text1),
            Text(text2),
          ],
        ))
  ],
)

There are others way to represent and style text like using RichText.

More about Text and layout

  • Related