Home > Software design >  Sort tasks in the list in the flutter
Sort tasks in the list in the flutter

Time:05-04

I am developing a task book, most of the tasks I have implemented but there is one that I can't solve, when I add a task it is added to the end of the list, and I want it to be at the top of the list. And also there is a problem when the theme changes, I want that if the theme is black, the text "Tasks " were white and vice versa. Here is my code:

import 'package:flutter/material.dart';


void main(){
  runApp(MaterialApp(
    home: App(),
  ));
}

class ListItem{
  String todoText;
  bool todoCheck;
  ListItem(this.todoText, this.todoCheck);
}

class _strikeThrough extends StatelessWidget{

  final String todoText;
  final bool todoCheck;
  _strikeThrough(this.todoText, this.todoCheck) : super();

  Widget _widget(){
    if(todoCheck){
      return Text(
        todoText,
        style: TextStyle(
          fontSize: 22.0,

        ),
      );
    }
    else{
      return Text(
        todoText,
        style: TextStyle(
            fontSize: 22.0
        ),
      );
    }
  }

  @override
  Widget build(BuildContext context){
    return _widget();
  }
}

const Color ColorTextW =  Colors.black;
class App extends StatefulWidget{

  @override
  AppState createState(){
    return AppState();
  }
}
final ValueNotifier<ThemeMode> _notifier = ValueNotifier(ThemeMode.light);

late Color ColorType =  Colors.black;

class AppState extends State<App> {
  bool valText = true;
  var counter = 0;
  var IconsType =  Icons.wb_sunny  ;

  late Color ColorType =  Colors.black;

  var textController = TextEditingController();
  var popUpTextController = TextEditingController();

  List<ListItem> WidgetList = [];

  @override
  void dispose() {
    textController.dispose();
    popUpTextController.dispose();
    super.dispose();
  }



  @override
  Widget build(BuildContext context) {
    return ValueListenableBuilder<ThemeMode>(
        valueListenable: _notifier,
        builder: (_, mode, __) {
          return MaterialApp(
              theme: ThemeData.light(),
              darkTheme: ThemeData.dark(),
              themeMode: mode, // Decides which theme to show, light or dark.
              home: Scaffold(
                appBar: AppBar(
                  title: Text("Список задач"),
                  actions: <Widget>[
                    IconButton(
                      icon: Icon(IconsType,color : ColorType
                      ),
                      onPressed:() =>
                      {
                        if (_notifier.value == ThemeMode.light) {
                          _notifier.value =  ThemeMode.dark,
                          IconsType = Icons.dark_mode,
                          ColorType = Colors.white,

                        } else
                          {
                            _notifier.value =  ThemeMode.light,
                            IconsType = Icons.wb_sunny,
                            ColorType = Colors.black,
                          }
                      }
                    )
                  ],
                  //backgroundColor: Colors.orange[500],
                  iconTheme: IconThemeData(
                      color: Colors.white
                  ),
                ),
                body: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[

                    Container(
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,

                        children: <Widget>[
                          const Text(
                            "Tasks",
                            style: TextStyle(
                              fontSize: 70.0,
                              fontWeight: FontWeight.bold,
                              color:  ColorTextW,
                            ),
                          ),
                          IconButton(
                                color: Colors.black,
                                iconSize: 70,
                                constraints: const BoxConstraints(),
                                padding: EdgeInsets.fromLTRB(30.0, 10.0, 30, 10.0),
                                icon: const Icon(Icons.add_outlined),
                                onPressed: ()  {
                                  if (textController.text.replaceAll(" ", "").isNotEmpty) {
                                    WidgetList.add(
                                        new ListItem(textController.text.replaceAll(" ", ""), false));
                                    setState(() {
                                      valText = true;
                                      textController.clear();

                                    });
                                  }
                                  else
                                  {
                                    setState(() {
                                      valText = false;
                                    });
                                  }
                                },


                              )




                        ],
                      ),

                    ),
                    Container(
                      width: MediaQuery
                          .of(context)
                          .size
                          .height * 0.45,
                      child: TextField(

                        style: TextStyle(
                          fontSize: 22.0,
                          //color: Theme.of(context).accentColor,
                        ),
                        controller: textController,
                        cursorWidth: 5.0,
                        autocorrect: true,
                        autofocus: true,
                        //onSubmitted: ,
                      ),
                    ),
                    Align(
                        child:
                        (valText == false) ?
                        Align(child: Text(("Задача пустая"),
                            style: TextStyle(
                                fontSize: 25.0, color: Colors.red)),
                            alignment: Alignment.center) :
                        Align(child: Text((""),),
                            alignment: Alignment.center)),
                    Expanded(
                      child: ReorderableListView(
                        children: <Widget>[
                          for(final widget in WidgetList)
                            GestureDetector(
                              key: Key(widget.todoText),
                              child: Dismissible(
                                key: Key(widget.todoText),
                                child: CheckboxListTile(
                                  controlAffinity: ListTileControlAffinity.leading,
                                  //key: ValueKey("Checkboxtile $widget"),
                                  value: widget.todoCheck,
                                  title: _strikeThrough(
                                      widget.todoText, widget.todoCheck),
                                  onChanged: (checkValue) {
                                    //_strikethrough toggle
                                    setState(() {
                                      if (!checkValue!) {
                                        widget.todoCheck = false;
                                      }
                                      else {
                                        widget.todoCheck = true;
                                      }
                                    });
                                  },
                                ),
                                background: Container(
                                  child: Icon(Icons.delete),
                                  alignment: Alignment.centerRight,
                                  color: Colors.redAccent,
                                ),

                                direction: DismissDirection.endToStart,
                                movementDuration: const Duration(
                                    milliseconds: 200),
                                onDismissed: (dismissDirection) { //Delete Todo
                                  WidgetList.remove(widget);

                                },
                              ),
                            )
                        ],
                        onReorder: (oldIndex, newIndex) {
                          setState(() {
                            if (newIndex > oldIndex) {
                              newIndex -= 1;
                            }
                            var replaceWiget = WidgetList.removeAt(oldIndex);
                            WidgetList.insert(newIndex, replaceWiget);
                          });
                        },
                      ),
                    )
                  ],
                ),
              )
          );
        }
    );
  }
}

CodePudding user response:

In the onPressed method of your Add-IconButton do the following:

WidgetList.insert(0, new ListItem(textController.text.replaceAll(" ", ""), false));

This will insert the new item at the top of the existing list ^^

  • Related