It’s simple to configure and use Beagle’s Flutter library, follow the steps below:
All the configuration necessary for Beagle to work is centered on the parameters of the BeagleSdk.init
startup method. These params tell everything Beagle needs to know how to render your widgets. Here you will see only the basic options baseUrl
and components
. For a list of all the available options, please check the
Beagle Initialization section.
You can start Beagle at any point of the application. In this example, we will start Beagle as soon as the app starts. To do that:
lib/main.dart
;package:beagle/beagle.dart
;beagle_components
package, import package:beagle_components/beagle_components.dart
as well;BeagleSdk.init
passing the parameter previously informed.
See the example below:import 'package:beagle/beagle.dart';
import 'package:beagle_components/beagle_components.dart';
void main() {
BeagleSdk.init(
baseUrl: 'http://yourBffBaseUrl.io',
components: defaultComponents,
);
// runApp();
}
You must use the component BeagleWidget
which is provided by the Beagle Library. This widget requires a single parameter, the screenRequest
, which specifies the request to fetch the first server-driven view of the flow. See the example below:
import 'package:beagle/beagle.dart';
import 'package:beagle_components/beagle_components.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
void main() {
BeagleSdk.init(
baseUrl: 'http://yourBffBaseUrl.io',
components: defaultComponents,
);
runApp(const BeagleSampleApp());
}
class BeagleSampleApp extends StatelessWidget {
const BeagleSampleApp({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Beagle Sample',
home: Scaffold(
body: BeagleWidget(
screenRequest: BeagleScreenRequest('welcome'),
),
),
);
}
}
The example above used a simple Material App to render the server-driven widget. The component BeagleWidget
includes a remote view in the layout.
The BeagleWidget
accepts other optional parameters, just like the BeagleScreenRequest
. If you want to check them, please visit the BeagleWidget section.
Check out more information in the following sections:
👉 If you want to know the current development status of Beagle Flutter, check it in the Resources section. Contributions are welcomed!
Was this page helpful?
Glad to hear it! Please tell us how we can improve.
Sorry to hear that. Please tell us how we can improve.