jmug/do_more
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Created the populatedDrawer widget and the Avatar widget

Browse source
This commit is contained in:
Mariano Uvalle 2019-04-15 20:27:42 -05:00
parent 0d47b271fe
commit 3c1c3c68b2
6 changed files with 192 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

2
ios/Runner.xcodeproj/project.pbxproj
View file

@ -304,7 +304,7 @@
);
inputPaths = (
"${SRCROOT}/Pods/Target Support Files/Pods-Runner/Pods-Runner-frameworks.sh",
"${PODS_ROOT}/../.symlinks/flutter/ios-release/Flutter.framework",
"${PODS_ROOT}/../.symlinks/flutter/ios/Flutter.framework",
);
name = "[CP] Embed Pods Frameworks";
outputFileListPaths = (

10
lib/src/screens/home_screen.dart
View file

@ -7,6 +7,7 @@ import '../widgets/home_app_bar.dart';
import '../widgets/new_item_dialog_route.dart';
import '../widgets/task_list_tile.dart';
import '../widgets/loading_indicator.dart';
import '../widgets/populated_drawer.dart';
import '../widgets/search-box.dart';
class HomeScreen extends StatefulWidget {
@ -29,14 +30,21 @@ class _HomeScreenState extends State<HomeScreen> {
return StreamBuilder(
stream: bloc.userStream,
builder: (BuildContext context, AsyncSnapshot<FirebaseUser> userSnap) {
String userAvatarUrl, userDisplayName;
String userAvatarUrl = '', userDisplayName = '', userEmail;
if (userSnap.hasData) {
userAvatarUrl = userSnap.data.photoUrl;
userDisplayName = userSnap.data.displayName;
userEmail = userSnap.data.email;
}
return Scaffold(
drawer: PopulatedDrawer(
userAvatarUrl: userAvatarUrl,
userDisplayName: userDisplayName,
userEmail: userEmail,
selectedScreen: Screen.home,
),
floatingActionButton: FloatingActionButton(
child: Icon(FontAwesomeIcons.plus),
backgroundColor: Color(0xFF707070),

3
lib/src/widgets/app_bar.dart
View file

@ -17,9 +17,12 @@ class AppBar extends StatelessWidget implements PreferredSizeWidget {
/// It will vary depending on the existance of the bottom widget.
final double _appBarHeight;
/// Whether to show a back button or a menu button.
final bool hasDrawer;
AppBar({
this.title = '',
this.bottom,
this.hasDrawer = false,
}) : _appBarHeight = bottom == null ? 140.0 : 120.0;
/// The preferred size of the app bar.

39
lib/src/widgets/avatar.dart Normal file
View file

@ -0,0 +1,39 @@
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
class Avatar extends StatelessWidget {
/// The url of hte image to be displayed.
final String imageUrl;
/// The size of the Avatar.
final double size;
Avatar({
this.imageUrl,
this.size = 60.0,
});
Widget build(BuildContext context) {
return imageUrl == null
? Container(
height: size,
width: size,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(30),
),
child: Center(
child: Icon(
FontAwesomeIcons.question,
),
),
)
: ClipOval(
child: Image.network(
imageUrl,
height: size,
width: size,
),
);
}
}

44
lib/src/widgets/home_app_bar.dart
View file

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import './logo.dart';
import './avatar.dart';
//TODO: Add callback for the menu button.
@ -32,7 +33,7 @@ class HomeAppBar extends StatelessWidget implements PreferredSizeWidget {
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
buildTopSection(),
buildTopSection(context),
SizedBox(
height: 20,
),
@ -58,19 +59,26 @@ class HomeAppBar extends StatelessWidget implements PreferredSizeWidget {
);
}
Widget buildTopSection() {
Widget buildTopSection(BuildContext context) {
final scaffolContext = Scaffold.of(context);
return Row(
children: <Widget>[
SizedBox(
width: 20,
),
Icon(
FontAwesomeIcons.bars,
IconButton(
onPressed: () => scaffolContext.openDrawer(),
icon: Icon(
FontAwesomeIcons.bars,
size: 24,
),
color: Colors.white,
size: 24,
),
Spacer(),
maybeBuildAvatar(),
Avatar(
imageUrl: avatarUrl,
),
SizedBox(
width: 20,
)
@ -78,30 +86,6 @@ class HomeAppBar extends StatelessWidget implements PreferredSizeWidget {
);
}
Widget maybeBuildAvatar() {
return avatarUrl == null
? Container(
height: 60,
width: 60,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(30),
),
child: Center(
child: Icon(
FontAwesomeIcons.question,
),
),
)
: ClipOval(
child: Image.network(
avatarUrl,
height: 60,
width: 60,
),
);
}
@override
final preferredSize = Size.fromHeight(220.0);
}

126
lib/src/widgets/populated_drawer.dart Normal file
View file

@ -0,0 +1,126 @@
import 'package:flutter/material.dart';
import '../services/auth_service.dart';
import '../widgets/avatar.dart';
import '../widgets/gradient_touchable_container.dart';
class PopulatedDrawer extends StatelessWidget {
/// The user's display name.
final String userDisplayName;
/// The url for the user's avatar.
final String userAvatarUrl;
/// The current user's email.
final String userEmail;
/// The selected screen.
final Screen selectedScreen;
PopulatedDrawer({
this.userDisplayName = '',
this.userAvatarUrl,
this.userEmail = '',
@required this.selectedScreen,
}) : assert(selectedScreen != null),
assert(userDisplayName != null),
assert(userEmail != null);
Widget build(BuildContext context) {
return Drawer(
child: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Material(
elevation: 10,
child: UserAccountsDrawerHeader(
decoration: BoxDecoration(
color: Theme.of(context).canvasColor,
),
accountEmail: Text(userEmail),
accountName: Text(userDisplayName),
currentAccountPicture: Avatar(
imageUrl: userAvatarUrl,
),
),
),
SizedBox(
height: 10,
),
buildDrawerTile(
text: 'Home',
isSelected: selectedScreen == Screen.home,
action: () => Navigator.of(context)
.pushNamedAndRemoveUntil('home/', (_) => false),
),
buildDrawerTile(
text: 'Events',
isSelected: selectedScreen == Screen.events,
action: () => Navigator.of(context)
.pushNamedAndRemoveUntil('events/', (_) => false),
),
Spacer(),
Padding(
padding: const EdgeInsets.only(left: 10),
child: GradientTouchableContainer(
onTap: () => onLogoutTap(context),
child: Text(
'LOGOUT',
style: TextStyle(
color: Colors.white,
fontSize: 15,
fontWeight: FontWeight.w600,
),
),
),
),
],
),
),
);
}
Widget buildDrawerTile({
String text,
bool isSelected = false,
VoidCallback action,
}) {
final result = Container(
color: isSelected ? Colors.white10 : null,
height: 50,
padding: EdgeInsets.only(
left: 10,
),
child: Row(
children: <Widget>[
Text(
text,
style: TextStyle(
color: Colors.white,
fontSize: 16,
),
),
],
),
);
if (isSelected) {
return result;
}
return GestureDetector(
onTap: action,
child: result,
);
}
void onLogoutTap(BuildContext context) {
authService.signOut();
// Push the login screen and remove all other screens from the navigator.
Navigator.of(context).pushNamedAndRemoveUntil('login/', (_) => false);
}
}
enum Screen {
home,
events,
}