在文本表单字段后显示图标

Question

Expanded(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          SizedBox(height: 40),
          Row(
            children: [
              SizedBox(width: 8),

              //MENU
              Icon(
                Icons.menu,
                size: 34,
                color: AppColors.black,
              ),

              Spacer(),

              //LOGO
              SizedBox(
                  height: 60,
                  width: 100,
                  child: Image.asset(
                    'assets/icons/logo_transparent_main.png',
                  )),

              SizedBox(width: 8)
            ],
          ),
          //SEARCHBAR
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: TextFormField(
              // controller: textIDController,
              style: const TextStyle(
                  color: Colors.black, fontWeight: FontWeight.w700),
              decoration: InputDecoration(
                suffixIcon: FaIcon(
                  Icons.filter_list_sharp,
                  size: 30,
                  color: AppColors.black,
                ),
                labelText: "Search",
                labelStyle: const TextStyle(
                    color: Colors.black, fontWeight: FontWeight.w700),
                // fillColor: Colors.white,
                focusedBorder: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(20),
                  borderSide:
                      const BorderSide(color: Colors.black, width: 2.0),
                ),
                enabledBorder: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(20),
                  borderSide:
                      const BorderSide(color: Colors.black, width: 2.0),
                ),
              ),
              maxLines: 1,
              keyboardType: TextInputType.text,
              textInputAction: TextInputAction.next,
            ),
          ),
          SizedBox(height: 10),
        ],
      ),
    ),

我希望图标（在后缀图标的搜索栏中）显示在搜索栏之后

这是我尝试过但不起作用的方法：

• 两者排成一排时，不显示
• 当我将行置于“扩展”状态时，同样的问题
• Suffixicon 将图标放在边框内，我希望它在边框外
• 我也尝试过使用 Suffix 代替后缀图标，但没有成功

Answer 1

尝试用下面的内容替换你的 Padding 小部件

      Padding(
            padding: const EdgeInsets.all(8.0),
            child: Row(
              children: [
                Expanded(
                  child: TextFormField(
                    // controller: textIDController,
                    style: const TextStyle(
                        color: Colors.black, fontWeight: FontWeight.w700),
                    decoration: InputDecoration(
                      suffixIcon: Icon(
                        Icons.filter_list_sharp,
                        size: 30,
                        color: Colors.black,
                      ),
                      labelText: "Search",
                      labelStyle: const TextStyle(
                          color: Colors.black, fontWeight: FontWeight.w700),
                      // fillColor: Colors.white,
                      focusedBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(20),
                        borderSide:
                            const BorderSide(color: Colors.black, width: 2.0),
                      ),
                      enabledBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(20),
                        borderSide:
                            const BorderSide(color: Colors.black, width: 2.0),
                      ),
                    ),
                    maxLines: 1,
                    keyboardType: TextInputType.text,
                    textInputAction: TextInputAction.next,
                  ),
                ),
                Icon(
                  Icons.abc,
                  size: 50,
                )
              ],
            ),
          ),