Development

Installation

Before you start developing on Piwigo NG, you first need to install it's dependencies. To do so, you need to install Flutter, see Flutter installation guide. note: we do our best to keep this project up to date.

Then, clone the project from this repository :

git clone [email protected]:Piwigo/piwigo-flutter-app.git

Or your repository if you forked it :

git clone [email protected]:ACCOUNT_NAME/piwigo-flutter-app.git

Finally, go to the project's root and use :

flutter pub get

To install all dependencies, then :

flutter run

To launch the application in debug mode.

File organisation

Here are the files and folders of the app :

• /android is the Android configuration folder.
  • /app/build.gradle is where you set the supported android versions.
  • /app/src/main/AndroidManifest.xml is one important files from android folder because it's where you can manage app permissions.
• /assets contains app logos and images that will be displayed in-app.
• /build is a generated folder that will containts the executables.
• /l10n contains all localizations in .arb files. You only need to add or remove strings on the app_en.arb. Translation is made on Crowdin.
• /lib contains all the code of the app (like a src folder)
• /crowdin.yaml helps Crowdin to locate the localization files.
• /l10n.yaml is localization configuration file.
• /pubspec.yaml is the Flutter and Dart configuration file. You can manage Dart and Piwigo NG version, dependencies, and assets.

Concerning the application's file code architecture from the lib folder :

• /api is where requests to the Piwigo's API are made.
• /components contains all components widgets. You will find basic components like buttons and textfields, but also ones that are so important they needed to be defined in their own file.
• /models contains all model class retrieved from the API (like Album, Image, Tag, ...).
• /services contains all functionnal classes.
• /utils contains constants and useful functions.
• /views contains all pages of the application.
• /app.dart is the root of the application.
• /main.dart is the starting function of the application.

Create your first page

Most of the time, when you want to add a new feature, you need to add a new page on the app. In Piwigo NG, all pages are defined in the folder .../lib/views. So start by creating a new file /views/your_page.dart. Then, in this file, create a stateful widget :

import 'package:flutter/material.dart';

class YourPage extends StatefulWidget {
  const YourPage({Key? key}) : super(key: key);

  @override
  State<YourPage> createState() => _YourPageState();
}

class _YourPageState extends State<YourPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold();
  }
}

Now you have your page, you need to implement the routing in order to use it. Start by adding a routeName argument :

class YourPage extends StatefulWidget {
  const YourPage({Key? key}) : super(key: key);

  static const String routeName = '/your_route';

  @override
  State<YourPage> createState() => _YourPageState();
}

Then, go to .../lib/app.dart. Inside the generateRoute function, add the routing to your new page :

case YourPage.routeName:
  return MaterialPageRoute(
    builder: (_) => const YourPage(),
    settings: settings,
  );

Now all you need to do is to call this function when you want to redirect to your page.

Navigator.of(context).pushNamed(YourPage.routeName);

*note: if you don't have access to context property :

import 'package:piwigo_ng/app.dart';

App.navigatorKey.currentState!.pushNamed(YourPage.routeName);

For more info about routing in Flutter, see Flutter navigation and routing guide.

Investigate APK issues

If your apk is larger than expected you can inspect multiple step of the build process

Get verbose build process

The command bellow can be pipped to a file (ex : > build.log)

fvm flutter build apk --verbose 

Get environment info

flutter doctor --verbose # Simple info
flutter doctor -vv # Advanced logs

Inspect APK with dart dev tools

You can run a build with verbose that exported a size graph in .flutter/ and analyse it with dart devtools

flutter build apk --target-platform android-arm64 --analyze-size
dart devtools --appSizeBase=<PATH TO ANALYSIS .json>