Flutter: วิธีสร้าง TextField ด้วย HintText แต่ไม่มีขีดเส้นใต้?

นี่คือสิ่งที่ฉันพยายามทำ:

ในเอกสาร Flutter สำหรับช่องข้อความ ( https://flutter.io/text-input/ ) ระบุว่าคุณสามารถลบขีดเส้นใต้ได้โดยส่งผ่านnullไปยังส่วนตกแต่ง อย่างไรก็ตามนั่นยังกำจัดข้อความคำใบ้

ฉันไม่ต้องการขีดเส้นใต้ว่าช่องข้อความถูกโฟกัสหรือไม่

อัปเดต:อัปเดตคำตอบที่ยอมรับเพื่อสะท้อนการเปลี่ยนแปลงใน Flutter SDK ณ เดือนเมษายน 2020

คำตอบที่ไม่ใช่คำตอบข้างต้นจะใช้ได้กับ flutter sdk ใหม่เนื่องจากหลังจากรวมการสนับสนุนเว็บและเดสก์ท็อปแล้วคุณต้องระบุทีละรายการเช่นนี้

TextFormField(
    cursorColor: Colors.black,
    keyboardType: inputType,
    decoration: new InputDecoration(
        border: InputBorder.none,
        focusedBorder: InputBorder.none,
        enabledBorder: InputBorder.none,
        errorBorder: InputBorder.none,
        disabledBorder: InputBorder.none,
        contentPadding:
            EdgeInsets.only(left: 15, bottom: 11, top: 11, right: 15),
        hintText: sLabel),
  )

ทำเช่นนี้:

TextField(
  decoration: new InputDecoration.collapsed(
    hintText: 'Username'
  ),
),

หรือหากคุณต้องการสิ่งอื่น ๆ เช่นไอคอนให้ตั้งค่าเส้นขอบด้วย InputBorder.none

InputDecoration(
    border: InputBorder.none,
    hintText: 'Username',
  ),
),

เปลี่ยนเส้นขอบที่โฟกัสเป็นไม่มี

TextField(
      decoration: new InputDecoration(
          border: InputBorder.none,
          focusedBorder: InputBorder.none,
          contentPadding: EdgeInsets.only(left: 15, bottom: 11, top: 11, right: 15),
          hintText: 'Subject'
      ),
    ),

นี่คือคำตอบเพิ่มเติมที่แสดงรหัสที่สมบูรณ์กว่า:

  Container(
    decoration: BoxDecoration(
      color: Colors.tealAccent,
      borderRadius:  BorderRadius.circular(32),
    ),
    child: TextField(
      decoration: InputDecoration(
        hintStyle: TextStyle(fontSize: 17),
        hintText: 'Search your trips',
        suffixIcon: Icon(Icons.search),
        border: InputBorder.none,
        contentPadding: EdgeInsets.all(20),
      ),
    ),
  ),

หมายเหตุ:

• พื้นหลังสีดำ (รหัสไม่แสดง) Colors.tealคือ
• InputDecorationมีคุณสมบัติa filledและfillColorด้วย แต่ฉันไม่สามารถทำให้มันมีรัศมีมุมได้ฉันจึงใช้คอนเทนเนอร์แทน

ฉันไม่พบคำตอบอื่นใดที่ให้รัศมีขอบคุณสามารถทำได้แบบนี้ไม่มีการซ้อนกัน Container

  TextField(
    decoration: InputDecoration(
      border: OutlineInputBorder(
        borderSide: BorderSide.none,
        borderRadius: BorderRadius.circular(20),
      ),
    ),
  );

ฉันใช้การTextFieldควบคุมการกระพือฉันได้รับผู้ใช้พิมพ์อินพุตโดยใช้วิธีการด้านล่าง

onChanged:(value){
}

decoration: InputDecoration(
 border:OutLineInputBorder(
 borderSide:BorderSide.none
 bordeRadius: BordeRadius.circular(20.0)
 )
)