玩了之后编辑

Question

玩弄扑朔迷离，尽管这对我的项目的MVP来说并不十分关键，但这就像我的荆棘。如何将所选值向右对齐，使其与DropdownButton中的图标相对应。这就是我到目前为止所拥有的。

      DropdownButton<String>(
        value: globals.things,
        style: TextStyle(
          fontFamily: 'Raleway',
          fontSize: 16,
          fontWeight: FontWeight.bold,
          color: Color.fromRGBO(36, 96, 208, 1),
          height: 2),
        icon: const Icon(
          Icons.arrow_drop_down,
          color: Colors.white,
          ),
        iconSize: 40,
        underline: Container(
          height: 2,
        ),
        onChanged: (String newValue) {
          setState(() {
            globals.things = newValue;
            _response = _getStuff(mapToApiKey(globals.things));
          });
        },
        items: <String>['One', 'Two', 'Three', 'Four', 'Five', 'Six']
          .map<DropdownMenuItem<String>>((String value) {
            return DropdownMenuItem<String>(
              value: value,
              child: Text(
                value,
                textAlign: TextAlign.left,
                style: TextStyle(color: Color.fromRGBO(54, 38, 83, 1)),
                ),
            );
          }).toList(),
      ),

玩了之后编辑

似乎没有任何对齐抖动，确实希望将所选值对齐到下拉按钮图标附近。我之所以有这样的差距，是因为我的某些菜单项比“一”菜单项长得多，它们就像是“一二三”。它看起来像是颤振希望有足够的空间来容纳与图标右侧对齐的最长菜单项。通过缩短下拉菜单项，我可以得到更愉悦的外观。

Answer 1

您只需要将Text小部件与DropdownMenuItem一起包装在container的孩子中，并给它alignment: Alignment.centerRight。像这样：

items: <String>['One', 'Two', 'Three', 'Four', 'Five', 'Six']
                .map<DropdownMenuItem<String>>((String value) {
              return DropdownMenuItem<String>(
                value: value,
                child: Container(
                  alignment: Alignment.centerRight,
                  child: Text(
                    value,
                    style: TextStyle(color: Color.fromRGBO(54, 38, 83, 1)),
                  ),
                ),
              );
            }).toList(),

书呆子

“文本”窗口小部件的大小默认值是包装其内容。因此添加对齐方式并不会真正改变任何内容。默认情况下，Container的大小也是换行内容，但是添加对齐方式后，大小会更改为填充其父项（在本例中为DropDownMenu）。因此，借助alignment: Alignment.Somewhere，您可以自由移动孩子。

修改

如果只想将所选值向右对齐，请将对齐方式更改为此： alignment:value == globals.things ? Alignment.centerRight :Alignment.centerLeft,

如何将选定的下拉值向右对齐

玩了之后编辑

1 个答案: