skip to Main Content

i have a little problem with UI component.

I have created my own widget that contains elevatedButton – it is supposed to be used for login instances.

The problem is that i can not center properly my text widget.

Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              SizedBox(
                height: 25,
                child: Image.asset(
                  imagepath,
                ),
              ),
              Expanded(
                child: Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 8.0),
                  child: Text(
                    text,
                    textAlign: TextAlign.center,
                  ),
                ),
              ),
            ],
          ),
        ],
      )

https://imgur.com/a/NF82cW9 – here is example of my problem.

The beggining of Text widget is not on the same width – and it should be.

How can i solve that?

2

Answers


  1. have you tried centering the text widget?
    or you should try to wrap text widget only with expanded widget instead of pading widget that will solve your problem probably.

               Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 8.0),
                  child: Expanded(
                  child:  Text(
                    text,
                    textAlign: TextAlign.center,
                  ),
                ),
              ),
    
    Login or Signup to reply.
  2. Replace Expanded with Flexible

    If doesn’t work wrap text widget with Center

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search