Now copy the contents of main.dart from below into lib/main.dart into your project.
main.dart
import'dart:async';import'package:flutter/material.dart';import'package:at_onboarding_flutter/at_onboarding_flutter.dart';import'package:flutter_dotenv/flutter_dotenv.dart';import'package:path_provider/path_provider.dart'show getApplicationSupportDirectory;import'home_screen.dart';Future<void> main() async {WidgetsFlutterBinding.ensureInitialized();await dotenv.load();runApp(constMyApp());}Future<AtClientPreference> loadAtClientPreference() async {var dir =awaitgetApplicationSupportDirectory();returnAtClientPreference() ..rootDomain ='root.atsign.org' ..namespace = dotenv.env['NAMESPACE'] ..hiveStoragePath = dir.path ..commitLogPath = dir.path ..isLocalStoreRequired =true;// * By default, this configuration is suitable for most applications// * In advanced cases you may need to modify [AtClientPreference]// * Read more here: https://pub.dev/documentation/at_client/latest/at_client/AtClientPreference-class.html}classMyAppextendsStatefulWidget {constMyApp({Key? key}) : super(key: key);@overrideMyAppStatecreateState() =>MyAppState();}classMyAppStateextendsState<MyApp> {// * load the AtClientPreference in the backgroundFuture<AtClientPreference> futurePreference =loadAtClientPreference();@overrideWidgetbuild(BuildContext context) {returnMaterialApp(// * The onboarding screen (first screen) home:Scaffold( appBar:AppBar( title:constText('MyApp'), ), body:Builder( builder: (context) =>Center( child:ElevatedButton( onPressed: () async {AtOnboardingResult onboardingResult =awaitAtOnboarding.onboard( context: context, config:AtOnboardingConfig( atClientPreference:await futurePreference, rootEnvironment:RootEnvironment.Production, domain:'root.atsign.org', ), );if (mounted) {switch (onboardingResult.status) {caseAtOnboardingResultStatus.success:Navigator.push( context,MaterialPageRoute(builder: (_) =>constHomeScreen()), );break;caseAtOnboardingResultStatus.error:ScaffoldMessenger.of(context).showSnackBar(constSnackBar( backgroundColor:Colors.red, content:Text('An error has occurred'), ), );break;caseAtOnboardingResultStatus.cancel:break; } } }, child:constText('Onboard an @sign'), ), ), ), ), ); }}
4. Add home_screen.dart
Create a second file in lib/ called home_screen.dart. Copy the contents of home_screen.dart from below into your project.
home_screen.dart
import'package:at_client_mobile/at_client_mobile.dart';import'package:flutter/material.dart';// * Once the onboarding process is completed you will be taken to this screenclassHomeScreenextendsStatelessWidget {constHomeScreen({Key? key}) : super(key: key);@overrideWidgetbuild(BuildContext context) {// * Getting the AtClientManager instance to use belowAtClientManager atClientManager =AtClientManager.getInstance();// * Getting the AtClient instance to use belowAtClient atClient = atClientManager.atClient;// * From this widget onwards, you are fully onboarded!// * You can use the AtClient instance to perform operations as the onboared atSignreturnScaffold( appBar:AppBar( title:constText('What\'s my current @sign?'), ), body:Center( child:Column(children: [constText('Successfully onboarded and navigated to FirstAppScreen'),// * Use the AtClient to get the current @signText('Current @sign: ${atClient.getCurrentAtSign()}') ]), ), ); }}
5. Setup the .env file
5.a. gitignore the .env file
Add the following line to the top of .gitignore:
.env
This will prevent accidentally uploading the secret values stored in .env to any git repositories associated with your app.
5.b. Add and populate the .env file
Create a new file in the root of the project (next to pubspec.yaml) called .env. Add the following lines to it:
NAMESPACE=API_KEY=
These values should be populated with your unique app namespace, and registrar API key.
5.c. Register the .env file in pubspec.yaml
In pubspec.yaml there should be a flutter: key, under this key, we want to create and add .env the assets: list:
...flutter:...assets: - .env......
6. Start developing!
Start your application with the following command:
flutterrun
Now you are ready to begin developing!
Additional Notes
Onboarding
To authenticate an atSign, we will use at_onboarding_flutter. You can register an atSign through the registrar or through the widget in the app.