TO DO App design in flutter | Basic App Design

Thanks for Visiting here

Print Friendly and PDF
Flutter app Design  - TO DO 


Code :-  
import 'package:flutter/material.dart';
import 'package:matcher/matcher.dart';

class practic_1 extends StatefulWidget {
  const practic_1({Key? key}) : super(key: key);

  @override
  _practic_1State createState() => _practic_1State();
}

class _practic_1State extends State<practic_1> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("TO DO"),
          centerTitle: true,
          backgroundColor: Colors.orange,
          actions: [IconButton(onPressed: () {}, icon: Icon(Icons.search))],
          leading: IconButton(onPressed: () {}, icon: Icon(Icons.menu)),
        ),
        body: SingleChildScrollView(
          child: Padding(
            padding: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
            child: Column(
              children: [
                Container(
                  decoration: BoxDecoration(
                      borderRadius: BorderRadius.only(
                          topRight: Radius.circular(30),
                          bottomLeft: Radius.circular(30)),
                      color: Colors.black12),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: [
                      InkWell(
                        onTap: () {},
                        child: Text(
                          "Today",
                          style: TextStyle(
                              fontSize: 20.0,
                              color: Colors.black,
                              fontWeight: FontWeight.bold),
                        ),
                      ),
                      InkWell(
                        onTap: () {},
                        child: Text(
                          "Tomorrow",
                          style: TextStyle(
                              fontSize: 15,
                              color: Colors.grey[600],
                              fontWeight: FontWeight.normal),
                        ),
                      ),
                      InkWell(
                        onTap: () {},
                        child: Text(
                          "Month",
                          style: TextStyle(
                              fontSize: 15,
                              color: Colors.grey[600],
                              fontWeight: FontWeight.normal),
                        ),
                      ),
                    ],
                  ),
                ),
                SizedBox(
                  height: 10,
                ),
                Worklist('Wakeup    ', '05:30 AM', 'Home'),
                SizedBox(height: 20),
                Worklist('Clean Room ', '07:50 AM', 'Home Work'),
                SizedBox(height: 20),
                Worklist('College Time', '09:45 AM', 'College'),
                SizedBox(height: 20),
                Worklist('College Leave', '04:45 PM', 'College'),
                SizedBox(height: 20),
                Worklist('Dinner Time ', '08:00 PM', 'Home'),
                SizedBox(height: 20),
                Worklist('Cooking Food', 'Mornign Work', 'Home Work'),
                SizedBox(height: 20),
                Worklist('Cooking Food', 'Mornign Work', 'Home Work'),
                SizedBox(height: 20),
                Worklist('Cooking Food', 'Mornign Work', 'Home Work'),
                SizedBox(height: 20),
                Worklist('Cooking Food', 'Mornign Work', 'Home Work'),
                SizedBox(height: 20),
              ],
            ),
          ),
        ));
  }

  Widget Worklist(String Workname, String Worktime, String Workleble) {
    return Container(
      // height: 60,
      padding: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(10),
        color: Colors.pink,
      ),
      child: Row(
        children: [
          Icon(Icons.list, size: 60, color: Colors.white),
          VerticalDivider(color: Colors.white),
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  Icon(
                    Icons.timer,
                    color: Colors.white,
                  ),
                  SizedBox(width: 10),
                  Text("$Worktime",
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 15,
                          fontWeight: FontWeight.bold)),
                ],
              ),
              SizedBox(height: 8.0),
              Text("$Workname",
                  style: TextStyle(
                      color: Colors.white,
                      fontSize: 25,
                      wordSpacing: 10,
                      fontWeight: FontWeight.bold)),
              SizedBox(height: 8.0),
              Row(
                children: [
                  Icon(Icons.home, color: Colors.white),
                  SizedBox(width: 10),
                  Text("$Workleble",
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 15,
                          wordSpacing: 10,
                          fontWeight: FontWeight.normal)),
                ],
              ),
            ],
          ),
          SizedBox(width: 50),
          InkWell(
            onTap: () {},
            child: Container(
              alignment: Alignment.centerLeft,
              width: 50,
              height: 50,
              decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(50),
                  color: Colors.grey[800]),
              child: Center(
                  child: Icon(
                Icons.delete,
                color: Colors.white,
              )),
            ),
          )
        ],
      ),
    );
  }
}



Tags

Post a Comment

0 Comments
* Please Don't Spam Here. All the Comments are Reviewed by Admin.

Top Post Ad

Below Post Ad