Iniisking
Iniisking

Reputation: 57

Row alignment in flutter

I want to align my some widgets in a row in a particular way. I want the Icon to be at the beginning of the row and the text to be at the center, I tried wrapping the text widget in a center widget but that didn't work. Please how can I carry out something like that with a row that only has two children?

Upvotes: 0

Views: 111

Answers (2)

Taher Patrawala
Taher Patrawala

Reputation: 1

You could use a Stack for the same

Sample code

Container(
      padding: const EdgeInsets.symmetric(vertical: 18),
      color: Colors.black,
      child: Stack(
        children: const [
          Center(
            child: Text(
              "Login",
              style: TextStyle(fontSize: 18, color: Colors.white,fontWeight: FontWeight.w600),
            ),
          ),
          Positioned(
            left: 12,
            child: Icon(
              Icons.close,
              color: Colors.white,
            ),
          ),
        ],
      ),
    );

Upvotes: 0

Ivo
Ivo

Reputation: 23134

Wrap the Center in an Expanded. So something like this:

Widget build(BuildContext context) {
  return Row(children: const [
    Icon(Icons.abc),
    Expanded(child: Center(child: Text('abc')))
  ]);
}

Upvotes: 1

Related Questions