在列表之间切换时,动态多级CupertinoPicker会使第一个Text项目的对齐方式倾斜

时间:2019-10-22 20:35:12

标签: flutter flutter-cupertino cupertinopicker

我正在尝试创建动态多级CupertinoPicker。当您从第一个列表中选择位置类型时,它将显示与该类型匹配的位置列表。这部分工作正常,问题在于,如果我交换到其他位置列表,则第二个位置列表的第一个Text小部件会根据第一个位置列表的第一个Text小部件缩进。

我尝试使用“ alignment:TextAlignment.center”指定“文本”小部件应与中心对齐。在位置列表之间交换时,我还尝试将位置设置为null。这些都不能解决问题或没有任何明显效果。

return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        Container(
          padding: EdgeInsets.only(bottom: 5.0),
          height: pickerHeight,
          width: logicalSize.width,
          child: CupertinoPicker(
            backgroundColor: Colors.white,
            itemExtent: 32.0,
            onSelectedItemChanged: (selectedIndex) {
              setState(() {
                location = null;
                locationType = locationTypeList[selectedIndex];
              });
            },
            children: pickerLocationType,
          ),
        ),
        Container(
          height: pickerHeight,
          width: logicalSize.width,
          child: CupertinoPicker(
            backgroundColor: Colors.white,
            itemExtent: 30.0,
            onSelectedItemChanged: (selectedIndex) {
              setState(() {
                location = null;
                if (locationType == 'Campus') {
                  location = campusList[selectedIndex];
                }
                if (locationType == 'City') {
                  location = cityList[selectedIndex];
                }
              });
            },
            children: pickerMap[locationType],
          ),
        ), 

结果应该是第一行是(将其设置为CupertinoPicker):

----------------------------------城市1 ----------- ---------------------------

----------------------------------城市2 ----------- ---------------------------

但它看起来更像:

-------------------------------城市1 -------------- ---------------------------

----------------------------------城市2 ----------- ---------------------------

如果需要图像,我将通过这篇文章的链接对其进行编辑。

1 个答案:

答案 0 :(得分:0)

我已经找到了解决方案。参见下文:

Container(
          key: ValueKey(this._locationType),
          height: pickerHeight,
          width: logicalSize.width,
          child: CupertinoPicker(
            backgroundColor: Colors.white,
            itemExtent: 30.0,
            onSelectedItemChanged: (selectedIndex) {
              setState(() {
                location = null;
                if (locationType == 'Campus') {
                  location = campusList[selectedIndex];
                }
                if (locationType == 'City') {
                  location = cityList[selectedIndex];
                }
              });
            },
            children: pickerMap[locationType],
          ),
        ),