Skip to content

Commit

Permalink
feat: change settings page layout
Browse files Browse the repository at this point in the history
  • Loading branch information
asartalo committed Jul 12, 2022
1 parent 403c833 commit 3692daa
Show file tree
Hide file tree
Showing 15 changed files with 368 additions and 54 deletions.
82 changes: 53 additions & 29 deletions lib/elements/choose_and_order_activities.dart
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import 'package:flutter/material.dart';

import '../models/activity.dart';
import 'activity_list_tile.dart';
import 'h3.dart';
import 'h2.dart';
import 'list_container.dart';

typedef OnChooseActivities = Function(List<Activity> activity);
Expand Down Expand Up @@ -49,7 +49,7 @@ class _ChooseAndOrderActivitiesState extends State<ChooseAndOrderActivities> {

@override
Widget build(BuildContext context) {
var theme = Theme.of(context);
final theme = Theme.of(context);
final builder = StatefulBuilder(builder: (context, setDialogState) {
final toggles = widget.available.map((activity) {
return ToggleActivity(
Expand Down Expand Up @@ -86,37 +86,61 @@ class _ChooseAndOrderActivitiesState extends State<ChooseAndOrderActivities> {
],
);
});
final body = ListContainer<Activity>(
list: widget.list,
onReorder: (a, b) {
setState(() {
final tempList = _selectedActivities.toList();
_selectedActivities = Set.from(reorder(tempList, a, b));
widget.onChoose(_chosenActivities());
});
},
builder: (activity, _) {
return ActivityListTile(
key: Key(activity.id),
activity: activity,
);
},
final body = _body();
final action = _action(theme, builder);
final title = widget.title;
const spacer = SizedBox(height: 6.0);

final cells = title != null
? [
H2(title),
const SizedBox(height: 20.0),
body,
spacer,
action,
]
: [body, spacer, action];

return Padding(
padding: const EdgeInsets.all(20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: cells,
),
);
}

Widget _body() {
return Card(
child: ListContainer<Activity>(
list: widget.list,
onReorder: (a, b) {
setState(() {
final tempList = _selectedActivities.toList();
_selectedActivities = Set.from(reorder(tempList, a, b));
widget.onChoose(_chosenActivities());
});
},
builder: (activity, _, index) {
return ActivityListTile(
key: Key(activity.id),
activity: activity,
);
},
),
);
final action = IconButton(
}

Widget _action(ThemeData theme, StatefulBuilder builder) {
return FloatingActionButton(
onPressed: () {
showDialog(context: context, builder: (context) => builder);
},
color: theme.colorScheme.primary,
icon: const Icon(Icons.add),
);

final cells = widget.title != null
? [H3(widget.title!), body, action]
: [body, action];

return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: cells,
// color: theme.colorScheme.primary,
backgroundColor: theme.colorScheme.primary,
child: const Icon(Icons.add),
heroTag: widget.title,
);
}
}
21 changes: 21 additions & 0 deletions lib/elements/colored_scrollable_child.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import 'package:flutter/material.dart';

class ColoredScrollableChild extends StatelessWidget {
final Color color;
final Widget child;
const ColoredScrollableChild({
Key? key,
required this.color,
required this.child,
}) : super(key: key);

@override
Widget build(BuildContext context) {
return Container(
color: color,
child: SingleChildScrollView(
child: child,
),
);
}
}
5 changes: 4 additions & 1 deletion lib/elements/h2.dart
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@ class H2 extends StatelessWidget {
final theme = Theme.of(context);
return Text(
text,
style: theme.textTheme.headline4,
textAlign: TextAlign.center,
style: theme.textTheme.headline4?.copyWith(
color: Colors.white,
),
);
}
}
6 changes: 3 additions & 3 deletions lib/elements/list_container.dart
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import 'package:flutter/material.dart';
import '../models/activity.dart';

typedef ActivityItemBuilder<T extends ActivityLike> = Widget Function(
T activity, BuildContext context);
T activity, BuildContext context, int index);

typedef OnReorder = void Function(int oldIndex, int newIndex);

Expand Down Expand Up @@ -33,7 +33,7 @@ class ListContainer<T extends ActivityLike> extends StatelessWidget {
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemBuilder: (BuildContext context, int index) {
return builder(list[index], context);
return builder(list[index], context, index);
},
onReorder: (before, after) {
if (onReorder != null) {
Expand All @@ -48,7 +48,7 @@ class ListContainer<T extends ActivityLike> extends StatelessWidget {
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemBuilder: (BuildContext context, int index) {
return builder(list[index], context);
return builder(list[index], context, index);
},
);
}
Expand Down
22 changes: 14 additions & 8 deletions lib/elements/navigation_button.dart
Original file line number Diff line number Diff line change
Expand Up @@ -3,24 +3,30 @@ import 'package:flutter/material.dart';
class NavigationButton extends StatelessWidget {
final IconData icon;
final VoidCallback onPressed;
final bool positioned;

const NavigationButton({
Key? key,
required this.icon,
required this.onPressed,
this.positioned = true,
}) : super(key: key);

@override
Widget build(BuildContext context) {
var theme = Theme.of(context);
return Positioned(
top: 20,
left: 20,
child: IconButton(
color: theme.colorScheme.onBackground,
icon: Icon(icon),
onPressed: onPressed,
),
final button = IconButton(
color: theme.colorScheme.onBackground,
icon: Icon(icon),
onPressed: onPressed,
);
if (positioned) {
return Positioned(
top: 20,
left: 20,
child: button,
);
}
return button;
}
}
2 changes: 1 addition & 1 deletion lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
import 'package:shared_preferences/shared_preferences.dart';

import 'home_page.dart';
import 'pages/home_page.dart';

void main() async {
WidgetsFlutterBinding.ensureInitialized();
Expand Down
2 changes: 2 additions & 0 deletions lib/models/activity.dart
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,9 @@ abstract class ActivityLike {
}

class Activity extends ActivityLike {
@override
final String name;
@override
final String id;

Activity({required this.name, String? id}) : id = id ?? uuid.v4();
Expand Down
1 change: 0 additions & 1 deletion lib/models/activity_repository.dart
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ final List<Activity> _defaultActivities = [
Activity(name: 'Worksheets'),
Activity(name: 'Khan Academy Kids'),
Activity(name: 'Reading'),
// Activity(name: 'Physical Education (P.E.)'),
Activity(name: 'Computer Work'),
];

Expand Down
7 changes: 3 additions & 4 deletions lib/home_page.dart → lib/pages/home_page.dart
Original file line number Diff line number Diff line change
@@ -1,14 +1,13 @@
import 'package:aralan/elements/list_container.dart';
import 'package:aralan/elements/navigation_button.dart';
import 'package:aralan/elements/toggle_activity.dart';
import 'package:aralan/models/activity.dart';
import 'package:aralan/models/activity_repository.dart';
import 'package:aralan/settings_page.dart';
import 'package:aralan/pages/settings_page.dart';
import 'package:date_format/date_format.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import 'elements/navigation_button.dart';

class HomePage extends StatefulWidget {
const HomePage({Key? key, required this.title, required this.loadedAt})
: super(key: key);
Expand Down Expand Up @@ -71,7 +70,7 @@ class _HomePageState extends State<HomePage> {
width: 560,
child: ListContainer<CheckableActivity>(
list: repo.activitiesToday(now).activities,
builder: (activity, context) {
builder: (activity, context, _) {
return ToggleActivity(
activity: activity,
onToggle: (foo) {
Expand Down
96 changes: 96 additions & 0 deletions lib/pages/settings_page.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
import 'package:aralan/elements/colored_scrollable_child.dart';
import 'package:aralan/elements/navigation_button.dart';
import 'package:aralan/pages/settings_pages/available_activities.dart';
import 'package:aralan/pages/settings_pages/daily_activities.dart';
import 'package:aralan/pages/settings_pages/todays_activities.dart';
import 'package:aralan/pages/test_page.dart';
import 'package:flutter/material.dart';

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

@override
State<SettingsPage> createState() => _SettingsPageState();
}

class _SettingsPageState extends State<SettingsPage> {
int _selectedIndex = 0;
PageController pageController = PageController();

@override
Widget build(BuildContext context) {
// var theme = Theme.of(context);

return Scaffold(
body: Row(
children: [
NavigationRail(
selectedIndex: _selectedIndex,
leading: NavigationButton(
positioned: false,
icon: Icons.arrow_back,
onPressed: () => {Navigator.pop(context)},
),
extended: true,
onDestinationSelected: (index) {
if (index == 3) {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const TestPage()),
);
return;
}
setState(() {
_selectedIndex = index;
pageController.animateToPage(
index,
duration: const Duration(milliseconds: 200),
curve: Curves.easeIn,
);
});
},
// labelType: NavigationRailLabelType.all,
destinations: const [
NavigationRailDestination(
icon: Icon(Icons.today),
label: Text('Today'),
),
NavigationRailDestination(
icon: Icon(Icons.view_list_outlined),
label: Text('Daily'),
),
NavigationRailDestination(
icon: Icon(Icons.list),
label: Text('Available'),
),
NavigationRailDestination(
icon: Icon(Icons.church),
label: Text('Testing'),
),
],
),
Expanded(
child: PageView(
controller: pageController,
scrollDirection: Axis.horizontal,
children: const [
ColoredScrollableChild(
color: Colors.blue,
child: TodaysActivities(),
),
ColoredScrollableChild(
color: Colors.green,
child: DailyActivities(),
),
ColoredScrollableChild(
color: Colors.indigo,
child: AvailableActivities(),
),
],
),
),
],
),
);
}
}
14 changes: 7 additions & 7 deletions lib/settings_page.dart → lib/pages/settings_page_old.dart
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import 'package:aralan/elements/activity_dialog.dart';
import 'package:aralan/elements/choose_and_order_activities.dart';
import 'package:aralan/elements/editable_activity_tile.dart';
import 'package:aralan/elements/list_container.dart';
import 'package:aralan/elements/navigation_button.dart';
import 'package:aralan/models/activities_today.dart';
import 'package:aralan/models/activity_repository.dart';
import 'package:aralan/models/weekdays.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import 'elements/h2.dart';
import 'elements/list_container.dart';
import 'models/activities_today.dart';
import 'models/activity.dart';
import 'models/activity_repository.dart';
import 'models/weekdays.dart';
import '../elements/h2.dart';
import '../models/activity.dart';

class SettingsPage extends StatelessWidget {
const SettingsPage({Key? key}) : super(key: key);
Expand Down Expand Up @@ -67,7 +67,7 @@ class SettingsPage extends StatelessWidget {
const H2('All Activities'),
ListContainer<Activity>(
list: allActivities,
builder: (activity, context) {
builder: (activity, context, _) {
return EditableActivityTile(
activity: activity,
onChange: (activity) {
Expand Down
Loading

0 comments on commit 3692daa

Please sign in to comment.