sdga_design_system 1.0.0

A comprehensive set of UI components and design principles that adhere to the Saudi Digital Government Authority (SDGA) design guidelines.

example/lib/main.dart

import 'dart:ui';

import 'package:example/example.dart';
import 'package:flutter/material.dart';
import 'package:sdga_design_system/sdga_design_system.dart';

void main() {
  runApp(const MainApp());
}

class MainApp extends StatefulWidget {
  const MainApp({super.key});

  @override
  State<MainApp> createState() => _MainAppState();
}

class _MainAppState extends State<MainApp> {
  Locale _locale = const Locale('en');
  bool _isLightTheme = true;

  void _toggleTheme() {
    setState(() => _isLightTheme = !_isLightTheme);
  }

  @override
  Widget build(BuildContext context) {
    return AppSettings(
      locale: _locale,
      theme: _isLightTheme ? ThemeMode.light : ThemeMode.dark,
      toggleTheme: _toggleTheme,
      changeLocale: (locale) => setState(() => _locale = locale),
      child: MaterialApp(
        locale: _locale,
        debugShowCheckedModeBanner: false,
        scrollBehavior: const MaterialScrollBehavior().copyWith(
          dragDevices: {
            PointerDeviceKind.mouse,
            PointerDeviceKind.touch,
            PointerDeviceKind.stylus,
            PointerDeviceKind.unknown,
          },
        ),
        localizationsDelegates: AppLocalizations.localizationsDelegates,
        supportedLocales: AppLocalizations.supportedLocales,
        theme: ThemeData.from(
          colorScheme: ColorScheme.fromSeed(
            seedColor: SDGAColors.primary,
            brightness: Brightness.light,
          ),
        ).applySDGATheme(),
        darkTheme: ThemeData.from(
          colorScheme: ColorScheme.fromSeed(
            seedColor: SDGAColors.primary,
            brightness: Brightness.dark,
          ),
        ).applySDGATheme(),
        themeMode: _isLightTheme ? ThemeMode.light : ThemeMode.dark,
        home: const HomePage(),
      ),
    );
  }
}

class AppSettings extends InheritedWidget {
  const AppSettings({
    super.key,
    required super.child,
    required this.theme,
    required this.locale,
    required this.toggleTheme,
    required this.changeLocale,
  });

  final ThemeMode theme;
  final Locale locale;
  final VoidCallback toggleTheme;
  final void Function(Locale locale) changeLocale;

  bool get isLight => theme == ThemeMode.light;
  String get language => locale.languageCode == 'en' ? 'English' : 'عربي';
  String get otherLanguage => locale.languageCode == 'en' ? 'عربي' : 'English';

  void toggleLocale() {
    changeLocale(Locale(locale.languageCode == 'en' ? 'ar' : 'en'));
  }

  @override
  bool updateShouldNotify(covariant AppSettings oldWidget) {
    return theme != oldWidget.theme ||
        toggleTheme != oldWidget.toggleTheme ||
        locale != oldWidget.locale ||
        changeLocale != oldWidget.changeLocale;
  }

  static AppSettings of(BuildContext context) => maybeOf(context)!;

  static AppSettings? maybeOf(BuildContext context) =>
      context.dependOnInheritedWidgetOfExactType<AppSettings>();
}