diff --git a/weekly_assignment_1/lib/main.dart b/weekly_assignment_1/lib/main.dart index e016029..11550de 100644 --- a/weekly_assignment_1/lib/main.dart +++ b/weekly_assignment_1/lib/main.dart @@ -11,7 +11,7 @@ class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( - title: 'Flutter Demo', + title: 'FizzBuzz App', theme: ThemeData( // This is the theme of your application. // @@ -22,9 +22,9 @@ class MyApp extends StatelessWidget { // or simply save your changes to "hot reload" in a Flutter IDE). // Notice that the counter didn't reset back to zero; the application // is not restarted. - primarySwatch: Colors.blue, + primarySwatch: Colors.deepPurple, ), - home: const MyHomePage(title: 'Flutter Demo Home Page'), + home: const MyHomePage(title: 'FizzBuzz Home Page'), ); } } @@ -49,6 +49,7 @@ class MyHomePage extends StatefulWidget { class _MyHomePageState extends State { int _counter = 0; + String _label = "Fizz"; void _incrementCounter() { setState(() { @@ -58,6 +59,35 @@ class _MyHomePageState extends State { // _counter without calling setState(), then the build method would not be // called again, and so nothing would appear to happen. _counter++; + _updateLabel(); + }); + } + + void _decrementCounter() { + setState(() { + _counter--; + _updateLabel(); + }); + } + + void _resetCounter() { + setState(() { + _counter = 0; + _updateLabel(); + }); + } + + void _updateLabel() { + setState(() { + if (_counter % 3 == 0 && _counter % 5 == 0) { + _label = "fizzbuzz"; + } else if (_counter % 3 == 0) { + _label = "fizz"; + } else if (_counter % 5 == 0) { + _label = "buzz"; + } else { + _label = ""; + } }); } @@ -95,20 +125,41 @@ class _MyHomePageState extends State { // horizontal). mainAxisAlignment: MainAxisAlignment.center, children: [ - const Text( - 'You have pushed the button this many times:', + Text( + _label, + style: TextStyle( + color: Colors.deepPurple, + fontSize: 30, + ), ), + Padding(padding: EdgeInsets.all(8.0)), Text( '$_counter', style: Theme.of(context).textTheme.headline4, ), + Padding(padding: EdgeInsets.all(8.0)), + Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: [ + FloatingActionButton( + onPressed: _decrementCounter, + tooltip: 'Decrement', + child: const Icon(Icons.remove), + ), + FloatingActionButton( + onPressed: _resetCounter, + tooltip: 'Reset', + child: const Icon(Icons.exposure_zero), + ), + FloatingActionButton( + onPressed: _incrementCounter, + tooltip: 'Increment', + child: const Icon(Icons.add), + ), + ], + ), ], ), - ), - floatingActionButton: FloatingActionButton( - onPressed: _incrementCounter, - tooltip: 'Increment', - child: const Icon(Icons.add), ), // This trailing comma makes auto-formatting nicer for build methods. ); } diff --git a/weekly_assignment_2/lib/main.dart b/weekly_assignment_2/lib/main.dart index e016029..4b1c203 100644 --- a/weekly_assignment_2/lib/main.dart +++ b/weekly_assignment_2/lib/main.dart @@ -11,105 +11,73 @@ class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( - title: 'Flutter Demo', - theme: ThemeData( - // This is the theme of your application. - // - // Try running your application with "flutter run". You'll see the - // application has a blue toolbar. Then, without quitting the app, try - // changing the primarySwatch below to Colors.green and then invoke - // "hot reload" (press "r" in the console where you ran "flutter run", - // or simply save your changes to "hot reload" in a Flutter IDE). - // Notice that the counter didn't reset back to zero; the application - // is not restarted. - primarySwatch: Colors.blue, - ), - home: const MyHomePage(title: 'Flutter Demo Home Page'), + title: 'Assignment #2', + theme: ThemeData(primarySwatch: Colors.deepPurple), + home: const MyHomePage(title: 'Assignment #2'), ); } } class MyHomePage extends StatefulWidget { const MyHomePage({super.key, required this.title}); - - // This widget is the home page of your application. It is stateful, meaning - // that it has a State object (defined below) that contains fields that affect - // how it looks. - - // This class is the configuration for the state. It holds the values (in this - // case the title) provided by the parent (in this case the App widget) and - // used by the build method of the State. Fields in a Widget subclass are - // always marked "final". - final String title; - @override State createState() => _MyHomePageState(); } class _MyHomePageState extends State { - int _counter = 0; + String _first = ""; + String _second = ""; + String _fullname = ""; + + void _updateFirst(String first) { + setState(() { + _first = first; + }); + } - void _incrementCounter() { + void _updateSecond(String second) { setState(() { - // This call to setState tells the Flutter framework that something has - // changed in this State, which causes it to rerun the build method below - // so that the display can reflect the updated values. If we changed - // _counter without calling setState(), then the build method would not be - // called again, and so nothing would appear to happen. - _counter++; + _second = second; }); } @override Widget build(BuildContext context) { - // This method is rerun every time setState is called, for instance as done - // by the _incrementCounter method above. - // - // The Flutter framework has been optimized to make rerunning build methods - // fast, so that you can just rebuild anything that needs updating rather - // than having to individually change instances of widgets. return Scaffold( appBar: AppBar( - // Here we take the value from the MyHomePage object that was created by - // the App.build method, and use it to set our appbar title. title: Text(widget.title), ), body: Center( - // Center is a layout widget. It takes a single child and positions it - // in the middle of the parent. child: Column( - // Column is also a layout widget. It takes a list of children and - // arranges them vertically. By default, it sizes itself to fit its - // children horizontally, and tries to be as tall as its parent. - // - // Invoke "debug painting" (press "p" in the console, choose the - // "Toggle Debug Paint" action from the Flutter Inspector in Android - // Studio, or the "Toggle Debug Paint" command in Visual Studio Code) - // to see the wireframe for each widget. - // - // Column has various properties to control how it sizes itself and - // how it positions its children. Here we use mainAxisAlignment to - // center the children vertically; the main axis here is the vertical - // axis because Columns are vertical (the cross axis would be - // horizontal). mainAxisAlignment: MainAxisAlignment.center, children: [ - const Text( - 'You have pushed the button this many times:', - ), - Text( - '$_counter', - style: Theme.of(context).textTheme.headline4, - ), + Padding( + padding: EdgeInsets.all(8.0), + child: TextFormField( + decoration: const InputDecoration( + border: UnderlineInputBorder(), labelText: 'First Name'), + onChanged: _updateFirst, + )), + Padding( + padding: EdgeInsets.all(8.0), + child: TextFormField( + decoration: const InputDecoration( + border: UnderlineInputBorder(), labelText: 'Last Name'), + onChanged: _updateSecond, + )), + Text(_fullname.isNotEmpty ? 'Hello $_fullname' : '', + style: const TextStyle(fontSize: 20.0)), ], ), ), floatingActionButton: FloatingActionButton( - onPressed: _incrementCounter, - tooltip: 'Increment', - child: const Icon(Icons.add), - ), // This trailing comma makes auto-formatting nicer for build methods. + onPressed: () { + setState(() { + _fullname = '$_first $_second'; + }); + }, + child: const Icon(Icons.update)), ); } } diff --git a/weekly_assignment_3/lib/main.dart b/weekly_assignment_3/lib/main.dart index e016029..c58b416 100644 --- a/weekly_assignment_3/lib/main.dart +++ b/weekly_assignment_3/lib/main.dart @@ -11,20 +11,11 @@ class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( - title: 'Flutter Demo', + title: 'Assignment 3', theme: ThemeData( - // This is the theme of your application. - // - // Try running your application with "flutter run". You'll see the - // application has a blue toolbar. Then, without quitting the app, try - // changing the primarySwatch below to Colors.green and then invoke - // "hot reload" (press "r" in the console where you ran "flutter run", - // or simply save your changes to "hot reload" in a Flutter IDE). - // Notice that the counter didn't reset back to zero; the application - // is not restarted. - primarySwatch: Colors.blue, + primarySwatch: Colors.deepPurple, ), - home: const MyHomePage(title: 'Flutter Demo Home Page'), + home: const MyHomePage(title: 'Assignment 3'), ); } } @@ -32,15 +23,6 @@ class MyApp extends StatelessWidget { class MyHomePage extends StatefulWidget { const MyHomePage({super.key, required this.title}); - // This widget is the home page of your application. It is stateful, meaning - // that it has a State object (defined below) that contains fields that affect - // how it looks. - - // This class is the configuration for the state. It holds the values (in this - // case the title) provided by the parent (in this case the App widget) and - // used by the build method of the State. Fields in a Widget subclass are - // always marked "final". - final String title; @override @@ -48,68 +30,50 @@ class MyHomePage extends StatefulWidget { } class _MyHomePageState extends State { - int _counter = 0; + List indices = List.generate(12, (index) => index); - void _incrementCounter() { + void _delete(int index) { setState(() { - // This call to setState tells the Flutter framework that something has - // changed in this State, which causes it to rerun the build method below - // so that the display can reflect the updated values. If we changed - // _counter without calling setState(), then the build method would not be - // called again, and so nothing would appear to happen. - _counter++; + indices.removeAt(index); }); } @override Widget build(BuildContext context) { - // This method is rerun every time setState is called, for instance as done - // by the _incrementCounter method above. - // - // The Flutter framework has been optimized to make rerunning build methods - // fast, so that you can just rebuild anything that needs updating rather - // than having to individually change instances of widgets. return Scaffold( appBar: AppBar( - // Here we take the value from the MyHomePage object that was created by - // the App.build method, and use it to set our appbar title. title: Text(widget.title), ), body: Center( - // Center is a layout widget. It takes a single child and positions it - // in the middle of the parent. child: Column( - // Column is also a layout widget. It takes a list of children and - // arranges them vertically. By default, it sizes itself to fit its - // children horizontally, and tries to be as tall as its parent. - // - // Invoke "debug painting" (press "p" in the console, choose the - // "Toggle Debug Paint" action from the Flutter Inspector in Android - // Studio, or the "Toggle Debug Paint" command in Visual Studio Code) - // to see the wireframe for each widget. - // - // Column has various properties to control how it sizes itself and - // how it positions its children. Here we use mainAxisAlignment to - // center the children vertically; the main axis here is the vertical - // axis because Columns are vertical (the cross axis would be - // horizontal). mainAxisAlignment: MainAxisAlignment.center, children: [ - const Text( - 'You have pushed the button this many times:', - ), - Text( - '$_counter', - style: Theme.of(context).textTheme.headline4, - ), + Expanded( + child: ListView.builder( + itemCount: indices.length, + itemBuilder: ((context, index) { + return ListTile( + leading: CircleAvatar( + backgroundColor: Colors.deepPurple[index * 50]), + title: const Text("I am a ListTile"), + subtitle: Text('Index: ${indices[index]}'), + trailing: IconButton( + icon: const Icon(Icons.delete), + onPressed: () { + _delete(index); + }, + ), + ); + })), + ) ], ), ), - floatingActionButton: FloatingActionButton( - onPressed: _incrementCounter, - tooltip: 'Increment', - child: const Icon(Icons.add), - ), // This trailing comma makes auto-formatting nicer for build methods. + // floatingActionButton: FloatingActionButton( + // onPressed: _incrementCounter, + // tooltip: 'Increment', + // child: const Icon(Icons.add), + // ), ); } } diff --git a/weekly_assignment_4/lib/main.dart b/weekly_assignment_4/lib/main.dart index e016029..903a04b 100644 --- a/weekly_assignment_4/lib/main.dart +++ b/weekly_assignment_4/lib/main.dart @@ -7,40 +7,24 @@ void main() { class MyApp extends StatelessWidget { const MyApp({super.key}); - // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( - // This is the theme of your application. - // - // Try running your application with "flutter run". You'll see the - // application has a blue toolbar. Then, without quitting the app, try - // changing the primarySwatch below to Colors.green and then invoke - // "hot reload" (press "r" in the console where you ran "flutter run", - // or simply save your changes to "hot reload" in a Flutter IDE). - // Notice that the counter didn't reset back to zero; the application - // is not restarted. - primarySwatch: Colors.blue, + primarySwatch: Colors.deepPurple, ), - home: const MyHomePage(title: 'Flutter Demo Home Page'), + home: const MyHomePage(title: 'Exercise 4 HomePage'), + routes: { + '/botNavBar': (context) => const BottomNavBarPage(), + '/navRail': (context) => const NavRailPage() + }, ); } } class MyHomePage extends StatefulWidget { const MyHomePage({super.key, required this.title}); - - // This widget is the home page of your application. It is stateful, meaning - // that it has a State object (defined below) that contains fields that affect - // how it looks. - - // This class is the configuration for the state. It holds the values (in this - // case the title) provided by the parent (in this case the App widget) and - // used by the build method of the State. Fields in a Widget subclass are - // always marked "final". - final String title; @override @@ -48,68 +32,164 @@ class MyHomePage extends StatefulWidget { } class _MyHomePageState extends State { - int _counter = 0; - - void _incrementCounter() { - setState(() { - // This call to setState tells the Flutter framework that something has - // changed in this State, which causes it to rerun the build method below - // so that the display can reflect the updated values. If we changed - // _counter without calling setState(), then the build method would not be - // called again, and so nothing would appear to happen. - _counter++; - }); - } - @override Widget build(BuildContext context) { - // This method is rerun every time setState is called, for instance as done - // by the _incrementCounter method above. - // - // The Flutter framework has been optimized to make rerunning build methods - // fast, so that you can just rebuild anything that needs updating rather - // than having to individually change instances of widgets. return Scaffold( appBar: AppBar( - // Here we take the value from the MyHomePage object that was created by - // the App.build method, and use it to set our appbar title. title: Text(widget.title), ), - body: Center( - // Center is a layout widget. It takes a single child and positions it - // in the middle of the parent. - child: Column( - // Column is also a layout widget. It takes a list of children and - // arranges them vertically. By default, it sizes itself to fit its - // children horizontally, and tries to be as tall as its parent. - // - // Invoke "debug painting" (press "p" in the console, choose the - // "Toggle Debug Paint" action from the Flutter Inspector in Android - // Studio, or the "Toggle Debug Paint" command in Visual Studio Code) - // to see the wireframe for each widget. - // - // Column has various properties to control how it sizes itself and - // how it positions its children. Here we use mainAxisAlignment to - // center the children vertically; the main axis here is the vertical - // axis because Columns are vertical (the cross axis would be - // horizontal). - mainAxisAlignment: MainAxisAlignment.center, - children: [ - const Text( - 'You have pushed the button this many times:', - ), - Text( - '$_counter', - style: Theme.of(context).textTheme.headline4, + body: const MainPage(), + ); + } +} + +class MainPage extends StatelessWidget { + const MainPage({super.key}); + + @override + Widget build(BuildContext context) { + return Scaffold( + body: Center( + child: Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ + TextButton( + style: TextButton.styleFrom( + backgroundColor: Colors.deepPurple, + foregroundColor: Colors.white), + onPressed: () { + Navigator.pushNamed(context, '/botNavBar'); + }, + child: const Text("Go to bottom navigation bar")), + TextButton( + style: TextButton.styleFrom( + backgroundColor: Colors.deepPurple, + foregroundColor: Colors.white), + onPressed: () { + Navigator.pushNamed(context, '/navRail'); + }, + child: const Text("Go to navigation rail")), + ]), + )); + } +} + +class BottomNavBarPage extends StatefulWidget { + const BottomNavBarPage({super.key}); + + @override + State createState() => _BottomNavBarPageState(); +} + +class _BottomNavBarPageState extends State { + int _selectedIndex = 0; + @override + Widget build(BuildContext context) { + return Scaffold( + appBar: AppBar(title: const Text("Bottom Nav Bar")), + body: IndexedStack( + index: _selectedIndex, + children: [ + Container( + alignment: Alignment.center, + child: const Text( + "Home", + style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold), + )), + Container( + alignment: Alignment.center, + child: const Text( + "Profile", + style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold), + ), ), + Container( + alignment: Alignment.center, + child: const Text( + "Settings", + style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold), + )), ], ), - ), - floatingActionButton: FloatingActionButton( - onPressed: _incrementCounter, - tooltip: 'Increment', - child: const Icon(Icons.add), - ), // This trailing comma makes auto-formatting nicer for build methods. - ); + bottomNavigationBar: BottomNavigationBar( + currentIndex: _selectedIndex, + items: const [ + BottomNavigationBarItem(icon: Icon(Icons.home), label: "Home"), + BottomNavigationBarItem(icon: Icon(Icons.person), label: "Profile"), + BottomNavigationBarItem( + icon: Icon(Icons.settings), label: "Settings"), + ], + onTap: (value) => setState(() { + _selectedIndex = value; + }), + )); + } +} + +class NavRailPage extends StatefulWidget { + const NavRailPage({super.key}); + + @override + State createState() => _NavRailPageState(); +} + +class _NavRailPageState extends State { + int _selectedIndex = 0; + + @override + Widget build(BuildContext context) { + return Scaffold( + appBar: AppBar( + title: const Text("Navigation Rail Page"), + ), + body: Row( + children: [ + NavigationRail( + groupAlignment: 0.0, + labelType: NavigationRailLabelType.all, + onDestinationSelected: (value) => setState(() { + _selectedIndex = value; + }), + destinations: const [ + NavigationRailDestination( + icon: Icon(Icons.favorite), label: Text("Favorite")), + NavigationRailDestination( + icon: Icon(Icons.bookmark_border), + label: Text("Bookmark")), + NavigationRailDestination( + icon: Icon(Icons.star_border), label: Text("Star")), + ], + selectedIndex: _selectedIndex), + const VerticalDivider( + thickness: 1, + width: 1, + ), + Expanded( + child: IndexedStack( + index: _selectedIndex, + children: [ + Container( + alignment: Alignment.center, + child: const Text( + "Favorite", + style: + TextStyle(fontSize: 40, fontWeight: FontWeight.bold), + )), + Container( + alignment: Alignment.center, + child: const Text( + "Bookmark", + style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold), + ), + ), + Container( + alignment: Alignment.center, + child: const Text( + "Star", + style: + TextStyle(fontSize: 40, fontWeight: FontWeight.bold), + )), + ], + )) + ], + )); } }