flutter center text with suffix icon-CodePudding

SizedBox(
                  width: 150,
                  child: TextField(
                    textAlign: TextAlign.center,
                    decoration: InputDecoration(
                        suffixIcon: Icon(
                          Icons.keyboard_arrow_down_outlined,
                          color: kGreyColor,
                        ),
                        hintStyle: TextStyle(fontSize: 20),
                        hintText: "Bugün"),
                  ),
                ),

how can i make this design I did something but it didn't turn out well eddit:Content padding coming theme but not looking exactly center

CodePudding user response：

You can achieve this by using a Container and a Stack.

Container(
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(5),
                  border: Border.all(color: Colors.grey)),
              child: Stack(
                children: const [
                  Padding(
                    padding: EdgeInsets.symmetric(horizontal: 40, vertical: 5),
                    child: Text("Bugün"),
                  ),
                  Positioned.fill(
                    child: Align(
                      alignment: Alignment.centerRight,
                      child: Icon(
                        Icons.keyboard_arrow_down_outlined,
                      ),
                    ),
                  )
                ],
              ),
            )

You can check the code on this DartPad

CodePudding user response：

/* Don't change your code just add this you will get your exact answer. */

SizedBox(
                                width: 150,
                                child: TextField(
                                  textAlign: TextAlign.end,
                                  decoration: InputDecoration(
                                      suffixIcon: Icon(
                                        Icons.keyboard_arrow_down_outlined,
                                        color: Colors.grey,
                                      ),
                                      hintStyle: TextStyle(fontSize: 20,),
                                      hintText: "Bugün"),
                                ),
                              ),