mirror of
https://github.com/flutter/samples.git
synced 2025-11-08 13:58:47 +00:00
Adds ai_recipe_generation sample (#2242)
Adding the demo app from my I/O talk. Because AI. ## Pre-launch Checklist - [x] I read the [Flutter Style Guide] _recently_, and have followed its advice. - [x] I signed the [CLA]. - [x] I read the [Contributors Guide]. - [x] I updated/added relevant documentation (doc comments with `///`). - [x] All existing and new tests are passing. --------- Co-authored-by: Brett Morgan <brett.morgan@gmail.com>
This commit is contained in:
248
ai_recipe_generation/lib/router.dart
Normal file
248
ai_recipe_generation/lib/router.dart
Normal file
@@ -0,0 +1,248 @@
|
||||
import 'package:ai_recipe_generation/app_bar.dart';
|
||||
import 'package:ai_recipe_generation/features/prompt/prompt_screen.dart';
|
||||
import 'package:ai_recipe_generation/features/prompt/prompt_view_model.dart';
|
||||
import 'package:ai_recipe_generation/features/recipes/saved_recipes_screen.dart';
|
||||
import 'package:ai_recipe_generation/widgets/bottom_bar_shape_border.dart';
|
||||
import 'package:ai_recipe_generation/widgets/marketplace_button_widget.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:material_symbols_icons/symbols.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import 'theme.dart';
|
||||
import 'widgets/icon_loading_indicator.dart';
|
||||
|
||||
const double avatarSize = 50;
|
||||
const double collapsedHeight = 100;
|
||||
const double expandedHeight = 300;
|
||||
const double bottomTabBarHeight = 50;
|
||||
|
||||
class AdaptiveRouter extends StatefulWidget {
|
||||
const AdaptiveRouter({super.key});
|
||||
|
||||
@override
|
||||
State<AdaptiveRouter> createState() => _AdaptiveRouterState();
|
||||
}
|
||||
|
||||
class _AdaptiveRouterState extends State<AdaptiveRouter>
|
||||
with TickerProviderStateMixin {
|
||||
late TextStyle _textStyle;
|
||||
late ScrollController scrollController;
|
||||
late TabController tabController;
|
||||
bool innerScrollAllowed = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
tabController = TabController(length: 2, vsync: this);
|
||||
_textStyle = MarketplaceTheme.heading1.copyWith(
|
||||
color: Colors.black87.withOpacity(
|
||||
1.0,
|
||||
),
|
||||
);
|
||||
|
||||
scrollController = ScrollController();
|
||||
scrollController.addListener(_scrollListener);
|
||||
}
|
||||
|
||||
double prevOffset = 0;
|
||||
void _scrollListener() {
|
||||
setState(() {
|
||||
innerScrollAllowed = scrollController.offset >= 230;
|
||||
if (scrollController.offset >= 230) {
|
||||
scrollController.animateTo(230,
|
||||
duration: const Duration(milliseconds: 100),
|
||||
curve: Curves.decelerate);
|
||||
}
|
||||
|
||||
// Don't change the text opacity if scrolling down from original position (overscroll)
|
||||
if (scrollController.offset < 0) return;
|
||||
|
||||
// By offset 200, ensure the text is transparent
|
||||
if (scrollController.offset > 200) {
|
||||
_textStyle = _textStyle.copyWith(
|
||||
color: Colors.black87.withOpacity(0),
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
var value = double.parse(
|
||||
(1 - (scrollController.offset - 50) / 100).toStringAsFixed(2),
|
||||
);
|
||||
|
||||
if (scrollController.offset > 200 && value > 0) value = 0;
|
||||
if (value > 1) value = 1;
|
||||
if (value < 0) value = 0;
|
||||
_textStyle = _textStyle.copyWith(
|
||||
color: Colors.black87.withOpacity(
|
||||
value,
|
||||
),
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
scrollController.dispose();
|
||||
tabController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
List<NavigationRailDestination> destinations = [
|
||||
const NavigationRailDestination(
|
||||
icon: Icon(Symbols.home),
|
||||
label: Text('Create a recipe'),
|
||||
),
|
||||
const NavigationRailDestination(
|
||||
icon: Icon(Symbols.bookmarks),
|
||||
label: Text('Saved Recipes'),
|
||||
)
|
||||
];
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final viewModel = context.watch<PromptViewModel>();
|
||||
|
||||
return LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
return Scaffold(
|
||||
body: Stack(
|
||||
children: [
|
||||
CustomScrollView(
|
||||
controller: scrollController,
|
||||
keyboardDismissBehavior:
|
||||
ScrollViewKeyboardDismissBehavior.onDrag,
|
||||
slivers: [
|
||||
AnimatedAppBar(
|
||||
scrollController: scrollController,
|
||||
textStyle: _textStyle,
|
||||
tabController: tabController,
|
||||
),
|
||||
SliverToBoxAdapter(
|
||||
child: ConstrainedBox(
|
||||
constraints: BoxConstraints(
|
||||
maxHeight: constraints.minHeight,
|
||||
),
|
||||
child: TabBarView(
|
||||
controller: tabController,
|
||||
children: [
|
||||
PromptScreen(
|
||||
canScroll: innerScrollAllowed,
|
||||
),
|
||||
SavedRecipesScreen(
|
||||
canScroll: innerScrollAllowed,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
Positioned(
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
child: Container(
|
||||
height: bottomTabBarHeight,
|
||||
decoration: ShapeDecoration(
|
||||
shadows: const [
|
||||
BoxShadow(
|
||||
offset: Offset(1, -1),
|
||||
color: Colors.black45,
|
||||
blurRadius: 5,
|
||||
)
|
||||
],
|
||||
shape: const BottomBarShapeBorder(50),
|
||||
color: Theme.of(context).primaryColor,
|
||||
),
|
||||
child: TabBar(
|
||||
labelColor: Colors.black,
|
||||
unselectedLabelColor: Colors.black26,
|
||||
controller: tabController,
|
||||
onTap: (idx) {
|
||||
setState(() {});
|
||||
},
|
||||
dividerColor: Colors.transparent,
|
||||
tabs: [
|
||||
for (var destination in destinations) destination.icon,
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
if (viewModel.loadingNewRecipe)
|
||||
Positioned(
|
||||
top: (MediaQuery.of(context).size.height / 2) - 80,
|
||||
left: (MediaQuery.of(context).size.width / 2) - 80,
|
||||
height: 160,
|
||||
width: 160,
|
||||
child: IconLoadingAnimator(
|
||||
icons: const [
|
||||
Symbols.icecream,
|
||||
Symbols.local_pizza,
|
||||
Symbols.restaurant_menu,
|
||||
Symbols.egg,
|
||||
Symbols.bakery_dining,
|
||||
Symbols.skillet,
|
||||
Symbols.nutrition,
|
||||
Symbols.grocery,
|
||||
Symbols.set_meal,
|
||||
Icons.egg_alt,
|
||||
Symbols.oven,
|
||||
Icons.dinner_dining,
|
||||
Icons.outdoor_grill,
|
||||
Icons.cookie,
|
||||
Icons.blender,
|
||||
Symbols.stockpot,
|
||||
],
|
||||
),
|
||||
),
|
||||
if (viewModel.geminiFailureResponse != null)
|
||||
Positioned(
|
||||
top: (MediaQuery.of(context).size.height / 4),
|
||||
left: (MediaQuery.of(context).size.width / 2) - 160,
|
||||
height: MediaQuery.of(context).size.height / 4,
|
||||
width: 320,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(
|
||||
MarketplaceTheme.defaultBorderRadius),
|
||||
boxShadow: const [
|
||||
BoxShadow(
|
||||
offset: Offset(-1, 1),
|
||||
color: Colors.black45,
|
||||
blurRadius: 5,
|
||||
)
|
||||
],
|
||||
color: Colors.white,
|
||||
border: Border.all(
|
||||
color: MarketplaceTheme.focusedBorderColor,
|
||||
width: 1,
|
||||
),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(MarketplaceTheme.spacing6),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(viewModel.geminiFailureResponse!),
|
||||
Align(
|
||||
alignment: Alignment.bottomRight,
|
||||
child: MarketplaceButton(
|
||||
onPressed: () {
|
||||
viewModel.geminiFailureResponse = null;
|
||||
},
|
||||
buttonText: "Dismiss",
|
||||
icon: Symbols.close,
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user