How to use Functions of another File in Dart / Flutter?
Use mixin
instead of global functions!
Why does this happen?
I'm using it over several different files and would love to create its own file and reference with the _launchwebview function anywhere in my app because there are several lines of code needed in order to make it work.
Underscored methods are private to a given library. Thus, if we define _launchwebview
in one file, that function is in a mini-library (Source). So, the method will only be accessible within that file. I explored how to expose private methods across files, but found the solution messy. I thus think the question would be better answered using public functions. The problem is implementing a shared function within different classes rather than simply providing access.
I've chosen to add this solution for this particular question since the method (launching a web view) would be good to have implemented within every appropriate Widget
class. Note that extension methods could also work in this case, but Flutter prefers composition over inheritance.
If we want to move a public, i.e. non-underscored method, to a different class without copy-pasting, we could try several outlined approaches. I have detailed the drawbacks of the existing options below.
Hacky solutions
- Using the
part
directive enables us to copy the source of one file with a private implementation and use it in another file. But this is discouraged because the technique increases the binary size, goes against the Effective Dart usage guide, and is clearly a code smell because we are copy-pasting the same code. - Using global functions doesn't follow Object Oriented programming. Global state breaks the Encapsulation principle. OOP is the best paradigm to use within Dart apps because of the way the language is designed (classes). The top answer recommends global functions, however, this should be a last resort given the powerful language capabilities of Dart.
- Static functions break encapsulation and the Open-Closed principle. They are hard to integrate with state management solutions because we track the state within instance method contexts. For example, integrating
provider
and other packages likeGetX
. - Defining a
Function
as a property of a class can lead to subtle bugs further down the line. For example, we could assign any function to this property because there is no function signature type checking. Furthermore, this is not a scalable solution with code duplications.
Solution: Mixins
Dart has inbuilt support for optionally adding functions to a class when we want to reduce duplicated code but avoid extending the whole class (Source). The mixin
keyword enables this by mixing a class with some specific logic. We can restrict the mixin
to a specific subclass with on
if needed.
Code example
LaunchWebView.dart
mixin LaunchWebView on StatelessWidget { // you can also constrain the mixin to specific classes using on in this line.
void launchWebView() {
// Add web view logic here. We can add variables to the mixin itself as well.
}
}
Usage
class ExampleClass extends StatelessWidget with LaunchWebView {
Widget build(BuildContext context) {
....
}
void testFunction() {
// We now have access to launchWebView().
launchWebView();
}
}
You can write a file with just that function, like:
test.dart
void launchWebView () {
print("1234");
}
and then import that file like this:
main.dart
import "test.dart";
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
launchWebView();
It is not really clean, but you can do that. Alternatively you can use a class with a static method like:
class test {
static void foo() {
print("1234");
}
}
and then in your code invoke it like that (after the import):
test.foo();
Or you can just declare all your functions (helpers) inside a class and pass them as an argument to other class.
//The class which contains your functions
class HelperFunction{
//Define your method
void launchWebView () {
print("1234");
}
//Pass that function to a class
MyHomePage(launchWebView);
}
//The class which receives the function.
class MyHomePage extends StatefulWidget{
//Retrieve the function and store it to a variable of type Function.
final Function launchWebView;
MyHomePage(this.launchWebView);
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
//Access that function in State class using widget keyword.
widget.launchWebView();
}
}