fluttercommunity / fluttercommunity/community
Issue with go router - go to details page
- Dominant language
- No language data
- Stars
- 1.7k
- Forks
- 128
- PR merge metrics
- No merged PRs in 30d
Description
Hi guys,
I've developed course manager app that fits specific requirements of a sports club that I am a member of. The app fulfills the following main function:
Users (or participants in our sports group) can navigate from the homepage to an overview page that lists all available courses.
By clicking on one of the courses, you will be taken to a detail page where you can then register for and cancel the course.
I use firebase for the data structure. Each event is assigned a unique ID from the firestore collection.
Now I would like to implement a "Share" button on the detail page. By clicking on it, a link should be generated and moved to the clipboard so that I can then send it via Whatsapp, for example. Users who click on it should be taken directly to the details page.
I have already defined the following routes:
```dart
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp(
options: DefaultFirebaseOptions.currentPlatform,
);
await dotenv.load();
await FirebaseAppCheck.instance.activate(
webProvider:
ReCaptchaV3Provider('####'),
//androidProvider: AndroidProvider.debug,
androidProvider: AndroidProvider.playIntegrity,
appleProvider: AppleProvider.deviceCheck,
);
runApp(const ProviderScope(child: MyApp()));
}
class MyApp extends StatelessWidget {
/// Constructs a [MyApp]
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp.router(
routerConfig: _router,
localizationsDelegates: const [
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
],
supportedLocales: const [Locale('de', 'DE')],
debugShowCheckedModeBanner: false,
title: 'myApp',
theme: getThemeData(),
);
}
}
final GlobalKey navigatorKey = GlobalKey();
/// The route configuration.
final GoRouter _router = GoRouter(
navigatorKey: navigatorKey,
initialLocation: '/',
routes: [
GoRoute(
path: '/',
builder: (BuildContext context, GoRouterState state) {
return StreamBuilder(
stream: FirebaseAuth.instance.authStateChanges(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return Loading();
}
if (snapshot.hasData) {
return Consumer(
builder: (BuildContext context, WidgetRef ref, Widget? child) {
final userProfileAsync = ref.watch(userProfileProvider);
return userProfileAsync.when(
data: (userData) {
if (userData != null) {
//check if user has already been activated
bool accountActivated = userData.accountActivated;
return accountActivated
? const MainScreen()
: const AccountNotActivatedScreen();
} else {
//other events
return Center(
child: Loading(),
);
}
},
loading: () => Scaffold(body: Loading()),
error: (error, stackTrace) {
return const Text(
'Fehler beim Abrufen der Benutzerdaten');
},
);
},
);
}
return const LoginScreen();
},
);
},
routes: [
GoRoute(
path: 'events/:eventId',
builder: (BuildContext context, GoRouterState state) {
final id = state.pathParameters['eventId']!;
return EventDetailsPage(eventId: id);
},
),
],
),
],
);
```
As you can see, there is a GoRoute defined which gets the eventId (the event id comes from firestore).
Futhermore, I created a details page. This is the place where the share button should be included. I think the only interesting thing should be the "_copyLinkToClipboard" function and the share button I added:
```dart
class EventDetailsPage extends ConsumerStatefulWidget {
final String eventId;
const EventDetailsPage({super.key, required this.eventId});
@override
ConsumerState createState() => _EventDetailsPageState();
}
class _EventDetailsPageState extends ConsumerState {
...some code
@override
void initState() {
super.initState();
initializeDateFormatting('de_DE'); //initialize system language
...some more code
}
void _copyLinkToClipboard(BuildContext context) {
String currentUrl = 'paravertikale-augsburg.de/event/${widget.eventId}';
Clipboard.setData(ClipboardData(text: currentUrl));
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Link zur Veranstaltung kopiert')),
);
}
@override
Widget build(BuildContext context) {
final streamData = ref.read(userProfileProvider);
final futureEvent = ref.watch(eventDetailsProvider(widget.eventId));
return Scaffold(
body: _isLoading
? Platform.isIOS
? const Center(
child:
CupertinoActivityIndicator(radius: 20, animating: true))
: Loading()
: futureEvent.when(
loading: () => Platform.isIOS
? const Center(
child: CupertinoActivityIndicator(
radius: 20, animating: true))
: Loading(),
error: (error, stack) => Text("Error: $error"),
data: (eventData) {
return streamData.when(
error: (error, stackTrace) => Text(error.toString()),
loading: () => Platform.isIOS
? const Center(
child: CupertinoActivityIndicator(
radius: 20, animating: true))
: Loading(),
data: ((data) => Stack(
children: [
CustomScrollView(
slivers: [
...some boring extra code in between
Expanded(
flex: 5,
child: AutoSizeText(
maxFontSize: 18,
maxLines: 2,
"Dieser Kurs wird $_lowerCaseRecurrenceType wiederholt",
textAlign:
TextAlign.start,
)),
const SizedBox(width: 20),
**IconButton(
onPressed: () {
_copyLinkToClipboard(
context);
},
icon: const Icon(
FontAwesomeIcons
.share),
),**
... and lots of more code
```
I added this to my androidmanisfest.xml
```dart
```
The thing is, I don't know why it doesn't work and I don't know how to generate a dynamic link that points to the event details.
Can anyone help me with this?
Thanks and regards
Dennis
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.