How to make text be on top in use (Flutter) in Android Studio

Question

so I want to make a simple text in a flutter framework, but I don't know to make the text for going on the top of the text, this is the example of the image I want to be on top:

this is my DetailPage.dart:

 @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          backgroundColor: Colors.redAccent,
          title: Text(
            'Detail ' + itemJudul,
            style: TextStyle(color: Colors.white),
          )),
      body: Column(

        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[
          Center(child: Image.asset(itemImage)),
          Text(
            itemJudul,
            style: TextStyle(color: Colors.redAccent, fontSize: 30.0),
          ),
          Text(itemSub),
          Text('Sisa Item =' + qty),
          Container(
            width: 200,
            child: Text("Bahan Bahan",
                textAlign: TextAlign.left,
                style: new TextStyle(fontWeight: FontWeight.bold) // has impact
                ),
            alignment: Alignment.centerLeft,
          ),
          Container(
            child: Text(
              listbahanan,
              textAlign: TextAlign.left,
            ),
            alignment: Alignment.centerLeft,
          ),
          Container(
            child: Text(
              listbahan2,
              textAlign: TextAlign.right,
            ),
            alignment: Alignment.center,
            padding: EdgeInsets.all(5),
          )
        ],
      ),
    );
  }

Answer 1

U can use two columns wrapped in a row.

Row(
  children: [
    Expanded(
      child: Container(
          child: Text(
            listbahanan,
            textAlign: TextAlign.left,
          ),
          alignment: Alignment.centerLeft,
       ),
    ),
    Expanded(
      child: Container(
        child: Text(
           listbahan2,
           textAlign: TextAlign.right,
        ),
        alignment: Alignment.center,
        padding: EdgeInsets.all(5),
     )
  ],
),

Answer 2

You need to use Row to align two lists side by side. Also, I don't think it's a good idea to store a list as string, better use List for storing and ListView for displaying the list items.

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          backgroundColor: Colors.redAccent,
          title: Text(
            'Detail ' + itemJudul,
            style: TextStyle(color: Colors.white),
          )),
      body: Column(

        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[
          Center(child: Image.asset(itemImage)),
          Text(
            itemJudul,
            style: TextStyle(color: Colors.redAccent, fontSize: 30.0),
          ),
          Text(itemSub),
          Text('Sisa Item =' + qty),
          Container(
            width: 200,
            child: Text("Bahan Bahan",
                textAlign: TextAlign.left,
                style: new TextStyle(fontWeight: FontWeight.bold) // has impact
            ),
            alignment: Alignment.centerLeft,
          ),
          Row( // this is new
            children: <Widget>[
              Flexible( // this is new
                child: Text(
                  listbahanan,
                  textAlign: TextAlign.left,
                ),
              ),
              Flexible( // this is new
                child: Text(
                  listbahan2,
                  textAlign: TextAlign.right,
                ),
              )
            ],
          ),
        ],
      ),
    );
  }