浮动文本第二行未显示在中心

我需要将我的TEXT及其中心居中,但问题是当文本较长并使用第二行时,则文本未居中

这是我的代码

                       GestureDetector(
                        onTap: () {
                          percengtageTrigger();
                          API.voteplusQuestion(snapshot.data[index], 0);
                        },
                        child: Container(
                          height: stackHeight * 0.5,
                          width: stackWidth,
                          color: Color(0xffF9D342),
                          child: Column(
                            children: <Widget>[
                              shouldShow
                                  ? Container(
                                      padding: const EdgeInsets.only(
                                          top: 10, right: 10),
                                      height: stackHeight * 0.1,
                                      color: Color(0xffF9D342),
                                      width: double.infinity,
                                      child: Column(
                                        mainAxisSize: MainAxisSize.max,
                                        crossAxisAlignment:
                                            CrossAxisAlignment.end,
                                        children: <Widget>[
                                          Text(
                                            '${percentage1.toStringAsFixed(0)}%',
                                            style: TextStyle(
                                              color: Colors.white,
                                              fontSize: 23,
                                              fontFamily: 'NewsCycle',
                                            ),
                                          ),
                                        ],
                                      ))
                                  : Container(
                                      height: stackHeight * 0.1,
                                color: Color(0xffF9D342),
                                      width: double.infinity,
                                    ),
                              Container(
                                  color: Color(0xffF9D342),
                                  height: stackHeight * 0.4,
                                  width: double.infinity,
                                  child: Column(
                                    children: <Widget>[
                                      Padding(
                                        padding: const EdgeInsets.only(top: 20, right: 10, left: 10),
                                        child: Text(
                                          snapshot.data[index].would,
                                          style: TextStyle(
                                            color: Color(0xff292826),
                                            fontSize: 23,
                                            fontWeight: FontWeight.bold,
                                            fontFamily: 'NewsCycle',
                                          ),
                                        ),
                                      ),
                                    ],
                                  )),
                            ],
                          ),
                        ),
                      ),

enter image description here

Here you can see in image second line text isn't in the center. I need to show the whole text in center if text have in 2 or 3 line it will show in center not from left . Already try with textAlign: TextAlign.center, but not working

评论
浅浅夏
浅浅夏

您可以使用“文本”小部件的textAlign属性将其对齐到中心。

Text(
  'Your text',
  textAlign : TextAlign.center,
)
点赞
评论
头文字D
头文字D

You can fix this by setting thr crossAxisAlignment of your Column widget to MainAxisAlignment.center and also set textAlign to TextAlign.center

试试这个,效果很好

                GestureDetector(
                        onTap: () {
                          percengtageTrigger();
                          API.voteplusQuestion(snapshot.data[index], 0);
                        },
                        child: Container(
                          height: stackHeight * 0.5,
                          width: stackWidth,
                          color: Color(0xffF9D342),
                          child: Column(
                            children: <Widget>[
                              shouldShow
                                  ? Container(
                                      padding: const EdgeInsets.only(
                                          top: 10, right: 10),
                                      height: stackHeight * 0.1,
                                      color: Color(0xffF9D342),
                                      width: double.infinity,
                                      child: Column(
                                        mainAxisSize: MainAxisSize.max,
                                        //set cross axis alignment to center
                                        crossAxisAlignment:
                                            CrossAxisAlignment.center,
                                        children: <Widget>[
                                          Text(
                                            '${percentage1.toStringAsFixed(0)}%',
                                            textAlign: TextAlign.center,
                                            style: TextStyle(
                                              color: Colors.white,
                                              fontSize: 23,
                                              fontFamily: 'NewsCycle',
                                            ),
                                          ),
                                        ],
                                      ))
                                  : Container(
                                      height: stackHeight * 0.1,
                                color: Color(0xffF9D342),
                                      width: double.infinity,
                                    ),
                              Container(
                                  color: Color(0xffF9D342),
                                  height: stackHeight * 0.4,
                                  width: double.infinity,
                                  child: Column(
                                    children: <Widget>[
                                      Padding(
                                        padding: const EdgeInsets.only(top: 20, right: 10, left: 10),
                                        child: Text(
                                          snapshot.data[index].would,
                                          style: TextStyle(
                                            color: Color(0xff292826),
                                            fontSize: 23,
                                            fontWeight: FontWeight.bold,
                                            fontFamily: 'NewsCycle',
                                          ),
                                        ),
                                      ),
                                    ],
                                  )),
                            ],
                          ),
                        ),
                      ),

我希望这有帮助。

点赞
评论