Added support for tab navigation (bottom widgets) for the custom app bar

This commit is contained in:
Mariano Uvalle 2019-04-06 23:16:15 -06:00
parent dd13cebb80
commit 74c63ee70a
2 changed files with 30 additions and 11 deletions

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import '../utils.dart';
import '../blocs/event_bloc.dart';
import '../widgets/custom_app_bar.dart';
@ -14,18 +15,31 @@ class EventScreen extends StatefulWidget {
_EventScreenState createState() => _EventScreenState();
}
class _EventScreenState extends State<EventScreen> {
class _EventScreenState extends State<EventScreen>
with SingleTickerProviderStateMixin {
EventBloc bloc;
TabController _tabController;
initState() {
super.initState();
bloc = EventBloc(eventName: widget.eventName);
_tabController = TabController(vsync: this, length: 2);
}
Widget build(BuildContext context) {
return Scaffold(
appBar: CustomAppBar(
title: widget.eventName,
bottom: TabBar(
controller: _tabController,
tabs: <Tab>[
Tab(
text: 'tab1',
),
Tab(
text: 'tab2',
),
],
),
),
);
}

View file

@ -1,8 +1,6 @@
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
//TODO: add support for tabed navigation.
/// A custom app bar to match the DO> design rules.
///
/// This app bar is meant to be usen in screens that are not the home screen.
@ -12,16 +10,17 @@ class CustomAppBar extends StatelessWidget implements PreferredSizeWidget {
final String title;
/// Widget to be shown on the bottom of the app bar.
final PreferredSize bottom;
/// the preferred size for this widget.
final Size preferredSize;
final PreferredSizeWidget bottom;
/// The size of only the app bar part.
final double appBarHeight;
CustomAppBar({
this.title = '',
this.bottom,
}) : preferredSize =
Size.fromHeight(140.0 + (bottom?.preferredSize?.height ?? 0));
}) : appBarHeight = bottom == null ? 140.0 : 120.0;
Size get preferredSize =>
Size.fromHeight(appBarHeight + (bottom?.preferredSize?.height ?? 0));
Widget build(BuildContext context) {
Widget result = Container(
@ -56,8 +55,14 @@ class CustomAppBar extends StatelessWidget implements PreferredSizeWidget {
if (bottom != null) {
result = Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
result,
Flexible(
child: ConstrainedBox(
constraints: const BoxConstraints(maxHeight: 140.0),
child: result,
),
),
bottom,
],
);