Flutter : How to make a row fixed while scrolling horizondally?-CodePudding

I am trying to create a Draft Page Screen for a blog app ,which has a Textfield and a close icon for closing it and a Publish Text for publishing it .I have given the Publish a Close icon in a row so even if scroll down after typing the row should remain fixed at the top .But how can I make the row widget fixed at the top of the body ?

This is my code:

ListView(
            children: <Widget>[
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  InkWell(
                    child: Icon(Icons.close_sharp),
                    onTap: () {
                      Navigator.pop(context);
                    },
                   
                  ),
                  Text("Publish"),
                ],
              ),
              
              TextField(
                autofocus: true,
                decoration: new InputDecoration(
                  border: InputBorder.none),
                keyboardType: TextInputType.multiline,
                maxLines: null,
                cursorColor: Color(0xff057009),
                cursorHeight: 30,
              ),
            ],
          ),

CodePudding user response：

Try this code this will do the trick.

Scaffold(
      appBar: AppBar(
        title: const Text('Blog View'),
      ),
      body: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              InkWell(
                child: const Icon(Icons.close_sharp),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              const Text("Publish"),
            ],
          ),
          const Expanded(
            child: TextField(
              autofocus: true,
              decoration: InputDecoration(border: InputBorder.none),
              keyboardType: TextInputType.multiline,
              maxLines: null,
              cursorColor: Color(0xff057009),
              cursorHeight: 30,
            ),
          ),
        ],
      ),
    );

CodePudding user response：

Your Row must be outside the List. You can make the list scrollable as well, but just make it outside the main list. Here is an example:

Column with a preferred height, for example media querry . size . height - > [
   SizedBox height: the hight you want to show of the row
       -> SingleChildScrollView -> your Row with the possibly overflowing text
   ...Your other children in a scrollable view
]