added multimedia support and STT. STT and photos are have bugs but are functional. file upload is conceptualized but will require additional backend work. video is on hold for now.
This commit is contained in:
@@ -0,0 +1,303 @@
|
||||
import 'package:flutterflow_ui/flutterflow_ui.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_animate/flutter_animate.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import 'package:app/theme.dart';
|
||||
|
||||
import 'setup_model.dart';
|
||||
export 'setup_model.dart';
|
||||
|
||||
class SetupWidget extends StatefulWidget {
|
||||
const SetupWidget({super.key});
|
||||
|
||||
@override
|
||||
State<SetupWidget> createState() => _SetupWidgetState();
|
||||
}
|
||||
|
||||
class _SetupWidgetState extends State<SetupWidget>
|
||||
with TickerProviderStateMixin {
|
||||
late SetupModel _model;
|
||||
|
||||
final scaffoldKey = GlobalKey<ScaffoldState>();
|
||||
|
||||
final animationsMap = <String, AnimationInfo>{};
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_model = createModel(context, () => SetupModel());
|
||||
|
||||
animationsMap.addAll({
|
||||
'containerOnPageLoadAnimation1': AnimationInfo(
|
||||
trigger: AnimationTrigger.onPageLoad,
|
||||
effectsBuilder: () => [
|
||||
VisibilityEffect(duration: 1.ms),
|
||||
FadeEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 0.0.ms,
|
||||
duration: 400.0.ms,
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
),
|
||||
ScaleEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 0.0.ms,
|
||||
duration: 400.0.ms,
|
||||
begin: const Offset(3.0, 3.0),
|
||||
end: const Offset(1.0, 1.0),
|
||||
),
|
||||
],
|
||||
),
|
||||
'containerOnPageLoadAnimation2': AnimationInfo(
|
||||
trigger: AnimationTrigger.onPageLoad,
|
||||
effectsBuilder: () => [
|
||||
VisibilityEffect(duration: 300.ms),
|
||||
FadeEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 300.0.ms,
|
||||
duration: 300.0.ms,
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
),
|
||||
ScaleEffect(
|
||||
curve: Curves.bounceOut,
|
||||
delay: 300.0.ms,
|
||||
duration: 300.0.ms,
|
||||
begin: const Offset(0.6, 0.6),
|
||||
end: const Offset(1.0, 1.0),
|
||||
),
|
||||
],
|
||||
),
|
||||
'textOnPageLoadAnimation1': AnimationInfo(
|
||||
trigger: AnimationTrigger.onPageLoad,
|
||||
effectsBuilder: () => [
|
||||
VisibilityEffect(duration: 350.ms),
|
||||
FadeEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 350.0.ms,
|
||||
duration: 400.0.ms,
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
),
|
||||
MoveEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 350.0.ms,
|
||||
duration: 400.0.ms,
|
||||
begin: const Offset(0.0, 30.0),
|
||||
end: const Offset(0.0, 0.0),
|
||||
),
|
||||
],
|
||||
),
|
||||
'textOnPageLoadAnimation2': AnimationInfo(
|
||||
trigger: AnimationTrigger.onPageLoad,
|
||||
effectsBuilder: () => [
|
||||
VisibilityEffect(duration: 400.ms),
|
||||
FadeEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 400.0.ms,
|
||||
duration: 400.0.ms,
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
),
|
||||
MoveEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 400.0.ms,
|
||||
duration: 400.0.ms,
|
||||
begin: const Offset(0.0, 30.0),
|
||||
end: const Offset(0.0, 0.0),
|
||||
),
|
||||
],
|
||||
),
|
||||
'rowOnPageLoadAnimation': AnimationInfo(
|
||||
trigger: AnimationTrigger.onPageLoad,
|
||||
effectsBuilder: () => [
|
||||
VisibilityEffect(duration: 300.ms),
|
||||
FadeEffect(
|
||||
curve: Curves.easeInOut,
|
||||
delay: 300.0.ms,
|
||||
duration: 600.0.ms,
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
),
|
||||
ScaleEffect(
|
||||
curve: Curves.bounceOut,
|
||||
delay: 300.0.ms,
|
||||
duration: 600.0.ms,
|
||||
begin: const Offset(0.6, 0.6),
|
||||
end: const Offset(1.0, 1.0),
|
||||
),
|
||||
],
|
||||
),
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_model.dispose();
|
||||
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: () => _model.unfocusNode.canRequestFocus
|
||||
? FocusScope.of(context).requestFocus(_model.unfocusNode)
|
||||
: FocusScope.of(context).unfocus(),
|
||||
child: Scaffold(
|
||||
key: scaffoldKey,
|
||||
backgroundColor: AppTheme.secondaryBackground,
|
||||
body: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
height: 500,
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
AppTheme.primary,
|
||||
AppTheme.error,
|
||||
AppTheme.tertiary
|
||||
],
|
||||
stops: [0, 0.5, 1],
|
||||
begin: AlignmentDirectional(-1, -1),
|
||||
end: AlignmentDirectional(1, 1),
|
||||
),
|
||||
),
|
||||
child: Container(
|
||||
width: 100,
|
||||
height: 100,
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
Color(0x00FFFFFF),
|
||||
AppTheme.secondaryBackground
|
||||
],
|
||||
stops: [0, 1],
|
||||
begin: AlignmentDirectional(0, -1),
|
||||
end: AlignmentDirectional(0, 1),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
width: 120,
|
||||
height: 120,
|
||||
decoration: const BoxDecoration(
|
||||
color: AppTheme.accent4,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8),
|
||||
child: Image.network(
|
||||
'https://storage.googleapis.com/flutterflow-io-6f20.appspot.com/projects/f-f-templates-q1-23-fbcr63/assets/ax4fvwjz7awx/@4xff_badgeDesign_dark_small.png',
|
||||
width: 100,
|
||||
height: 100,
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
),
|
||||
).animateOnPageLoad(
|
||||
animationsMap['containerOnPageLoadAnimation2']!),
|
||||
Padding(
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(0, 44, 0, 0),
|
||||
child: const Text(
|
||||
'Welcome!',
|
||||
style: AppTheme.displaySmall,
|
||||
).animateOnPageLoad(
|
||||
animationsMap['textOnPageLoadAnimation1']!),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(44, 8, 44, 0),
|
||||
child: const Text(
|
||||
'Thanks for joining! Access or create your account below, and get started on your journey!',
|
||||
textAlign: TextAlign.center,
|
||||
style: AppTheme.labelMedium,
|
||||
).animateOnPageLoad(
|
||||
animationsMap['textOnPageLoadAnimation2']!),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
).animateOnPageLoad(
|
||||
animationsMap['containerOnPageLoadAnimation1']!),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(16, 24, 16, 44),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Align(
|
||||
alignment: const AlignmentDirectional(0, 0),
|
||||
child: Padding(
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(0, 0, 8, 16),
|
||||
child: FFButtonWidget(
|
||||
onPressed: () {
|
||||
print('Button pressed ...');
|
||||
},
|
||||
text: 'Get Started',
|
||||
options: FFButtonOptions(
|
||||
width: 230,
|
||||
height: 52,
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(0, 0, 0, 0),
|
||||
iconPadding:
|
||||
const EdgeInsetsDirectional.fromSTEB(0, 0, 0, 0),
|
||||
color: AppTheme
|
||||
.secondaryBackground,
|
||||
textStyle: AppTheme.bodyLarge,
|
||||
elevation: 0,
|
||||
borderSide: const BorderSide(
|
||||
color: AppTheme.alternate,
|
||||
width: 2,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Align(
|
||||
alignment: const AlignmentDirectional(0, 0),
|
||||
child: Padding(
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(8, 0, 0, 16),
|
||||
child: FFButtonWidget(
|
||||
onPressed: () {
|
||||
print('Button pressed ...');
|
||||
},
|
||||
text: 'My Account',
|
||||
options: FFButtonOptions(
|
||||
width: 230,
|
||||
height: 52,
|
||||
padding: const EdgeInsetsDirectional.fromSTEB(0, 0, 0, 0),
|
||||
iconPadding:
|
||||
const EdgeInsetsDirectional.fromSTEB(0, 0, 0, 0),
|
||||
color: AppTheme.primary,
|
||||
textStyle: AppTheme.titleSmall,
|
||||
elevation: 3,
|
||||
borderSide: const BorderSide(
|
||||
color: Colors.transparent,
|
||||
width: 1,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
).animateOnPageLoad(animationsMap['rowOnPageLoadAnimation']!),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user