flutter - 将标题和副标题添加到 Listview

Question

非常新的颤振。我知道如何在列表中添加一个标题。我想在列表中添加 2 个或更多标题。我将 2 个列表定义为列表和副标题。我想我在给出索引号时犯了一个错误。

我无法解决如何在 ListView.builder 中使用列表。我该怎么办？

主要.dart

import 'package:flutter/cupertino.dart';
    import 'package:flutter/material.dart';
    import 'package:flutter/rendering.dart';
    import 'package:flutter/services.dart';
    import 'harf_buyuklugu.dart';
    
    void main() => runApp(defectList());
    
    class todolist extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: "PROGRAM",
          home: Iskele(),
        );
      }
    }
    
    class Iskele extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text('Program'),
          ),
          body: AnaEkran(),
        );
      }
    }
    
    class AnaEkran extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Icerik();
      }
    }
    
    class Icerik extends StatefulWidget {
      @override
      _IcerikState createState() => _IcerikState();
    }
    
    class _IcerikState extends State<Icerik> {
      TextEditingController _title_Textfield = TextEditingController();
      TextEditingController _subtitleTextfield = TextEditingController();
    
      List<String> title = [];
      List<String> subtitle = [];
    
      elemanEkle() {
        setState(() {
          title.add(_title_Textfield.text);
          _title_Textfield.clear();
        });
      }
    
      elemanCikar() {
        title.clear();
        _subtitleTextfield.clear();
        setState(() {});
      }
    
      @override
      Widget build(BuildContext context) {
        return Container(
          child: Column(
            children: [
              Padding(
                padding: const EdgeInsets.only(left: 25, right: 25, top: 25),
                child: TextField(
                  maxLength: 100,
                  controller: _title_Textfield,
                  inputFormatters: [BuyukHarfTxt()],
                  minLines: 1,
                  maxLines: 3,
                  decoration: InputDecoration(
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(
                        Radius.circular(60),
                      ),
                    ),
                    hintText: "Add somethings...",
                    labelText: "Title",
                    suffixIcon: IconButton(
                      onPressed: () => _title_Textfield.clear(),
                      icon: Icon(Icons.clear),
                    ),
                  ),
                ),
              ),
              Padding(
                padding: const EdgeInsets.only(left: 25, right: 25, top: 25),
                child: TextField(
                  controller: _subtitleTextfield,
                  inputFormatters: [BuyukHarfTxt()],
                  minLines: 1,
                  maxLines: 3,
                  decoration: InputDecoration(
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(
                        Radius.circular(60),
                      ),
                    ),
                    hintText: "Add somethings...",
                    labelText: "Subtitle",
                    suffixIcon: IconButton(
                      onPressed: () => _subtitleTextfield.clear(),
                      icon: Icon(Icons.clear),
                    ),
                  ),
                ),
              ),
              Row(
                children: [
                  IconButton(
                    onPressed: elemanEkle,
                    icon: Icon(Icons.save),
                    color: Colors.amber,
                    iconSize: 50,
                  ),
                  IconButton(
                    onPressed: elemanCikar,
                    icon: Icon(Icons.delete_forever_rounded),
                    color: Colors.amber,
                    iconSize: 50,
                  ),
                ],
              ),
              Flexible(
                child: ListView.builder(
                  itemCount: title.length,
                  itemBuilder: (context, indeksNumarasi) => ListTile(
                    title: Text(
                      '${title[indeksNumarasi]} (${subtitle[indeksNumarasi]})',
                    ),
                  ),
                ),
              )
            ], //children
          ),
        );
      }
    }

harf_buyuklugu.dart

 import 'package:flutter/services.dart';
    
    class BuyukHarfTxt extends TextInputFormatter {
      @override
      TextEditingValue formatEditUpdate(
          TextEditingValue txtEski, TextEditingValue txtYeni) {
        return txtYeni.copyWith(
          text: txtYeni.text.toUpperCase(),
        );
      }
    }

结果图片

我要这个

标签： flutter

Answer 1

我已经对您进行了一些更改code并评论了这些更改，现在它可以工作了

复制粘贴此代码

import 'package:flutter/cupertino.dart';
    import 'package:flutter/material.dart';
    import 'package:flutter/rendering.dart';
    import 'package:flutter/services.dart';
    import 'harf_buyuklugu.dart';

void main() => runApp(defectList());

class todolist extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "PROGRAM",
      home: Iskele(),
    );
  }
}

class Iskele extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Program'),
      ),
      body: AnaEkran(),
    );
  }
}


class AnaEkran extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Icerik();
  }
}

class Icerik extends StatefulWidget {
  @override
  _IcerikState createState() => _IcerikState();
}

class _IcerikState extends State<Icerik> {
  TextEditingController _title_Textfield = TextEditingController();
  TextEditingController _subtitleTextfield = TextEditingController();

  List<String> title = [];
  List<String> subtitle = [];

  elemanEkle() {
    setState(() {
      title.add(_title_Textfield.text);
      subtitle.add(_subtitleTextfield.text);  //added this line other wise index error will come
      _title_Textfield.clear();              
      _subtitleTextfield.clear();
    });
  }

  elemanCikar() {
    title.clear();
    _subtitleTextfield.clear();
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.only(left: 25, right: 25, top: 25),
              child: TextField(
                maxLength: 100,
                controller: _title_Textfield,
                // inputFormatters: [BuyukHarfTxt()],
                minLines: 1,
                maxLines: 3,
                decoration: InputDecoration(
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.all(
                      Radius.circular(60),
                    ),
                  ),
                  hintText: "Add somethings...",
                  labelText: "Title",
                  suffixIcon: IconButton(
                    onPressed: () => _title_Textfield.clear(),
                    icon: Icon(Icons.clear),
                  ),
                ),
              ),
            ),
            Padding(
              padding: const EdgeInsets.only(left: 25, right: 25, top: 25),
              child: TextField(
                controller: _subtitleTextfield,
                // inputFormatters: [BuyukHarfTxt()],
                minLines: 1,
                maxLines: 3,
                decoration: InputDecoration(
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.all(
                      Radius.circular(60),
                    ),
                  ),
                  hintText: "Add somethings...",
                  labelText: "Subtitle",
                  suffixIcon: IconButton(
                    onPressed: () => _subtitleTextfield.clear(),
                    icon: Icon(Icons.clear),
                  ),
                ),
              ),
            ),
            Row(
              children: [
                IconButton(
                  onPressed: elemanEkle,
                  icon: Icon(Icons.save),
                  color: Colors.amber,
                  iconSize: 50,
                ),
                IconButton(
                  onPressed: () {
                    elemanCikar();
                  },
                  icon: Icon(Icons.delete_forever_rounded),
                  color: Colors.amber,
                  iconSize: 50,
                ),
              ],
            ),
            Flexible(
              child: ListView.builder(
                itemCount: title?.length ?? 0,  //when list is null nothing will shows up (some null opeartions)
                itemBuilder: (context, indeksNumarasi) => ListTile(
                  title: new Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [

Text(
                    '${title[indeksNumarasi]})',
                  ),

                  Text("${subtitle[indeksNumarasi]}"),

                    ],
                  ),
                  subtitle: Container(height: 5, color: Colors.green),
                ),
              ),
            )
          ], //children
        ),
      ),
    );
  }
}