สร้างสัญลักษณ์แสดงหัวข้อย่อยในการกระพือ
ฉันพยายามป้อนข้อมูลของผู้ใช้โดยใช้ textField ในการกระพือปีก แต่ฉันต้องการใช้เป็นรายการหัวข้อย่อย ฉันคิดว่าฉันอาจต้องใช้แพ็คเกจที่เรียกว่า flutter_markdown แต่ฉันยังไม่รู้ว่าจะทำได้อย่างไร เช่นเดียวกับทุกบรรทัดสุดท้ายควรเริ่มต้นด้วยสัญลักษณ์แสดงหัวข้อย่อยโดยอัตโนมัติ
คำตอบ
วิธีหนึ่งที่คุณสามารถทำได้ก็คือสิ่งนี้
class MyWidget extends StatefulWidget {
@override
_MyWidgetState createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget> {
TextEditingController tc = TextEditingController();
int currentTextLength = 0;
@override
Widget build(BuildContext context) {
return TextField(
maxLines: 4,
controller: tc,
onChanged: (String newText){
if(newText[0] != '•'){
newText = '• ' + newText;
tc.text = newText;
tc.selection = TextSelection.fromPosition(TextPosition(offset: tc.text.length));
}
if(newText[newText.length - 1] == '\n' && newText.length > currentTextLength){
tc.text = newText + '• ';
tc.selection = TextSelection.fromPosition(TextPosition(offset: tc.text.length));
}
currentTextLength = tc.text.length;
}
);
}
}
หมายเหตุ:นี่ไม่ใช่วิธีแก้ปัญหาที่สมบูรณ์แบบ เนื่องจากจะไม่ใส่สัญลักษณ์แสดงหัวข้อย่อยหากคุณเริ่มแก้ไขข้อความตรงกลางข้อความที่มีอยู่ แต่บางทีนี่อาจทำให้คุณเริ่มต้นอย่างมีทิศทาง
หากคุณต้องการมีรายการหัวข้อย่อยของฟิลด์ข้อความ flutter_markdown อาจไม่เหมาะสำหรับคุณ เนื่องจากมันแสดงข้อความ markdown
TextFormField(
decoration: InputDecoration(
border: InputBorder.none, prefix: Text("."), // Or a Dot image
),
),
หากคุณต้องการมีฟิลด์ข้อความที่มีฟังก์ชันสัญลักษณ์แสดงหัวข้อย่อยแพ็คเกจนี้อาจเหมาะสำหรับคุณ:
https://pub.dev/packages/zefyr
มันซับซ้อนถ้าคุณเขียนด้วยตัวคุณเอง
ดูโค้ดตัวอย่างเพื่อเรียนรู้วิธีใช้:
https://github.com/memspace/zefyr/tree/master/packages/zefyr/example/lib