{"id":22561579,"url":"https://github.com/speeedev/slang_example","last_synced_at":"2025-03-28T12:41:13.602Z","repository":{"id":264533191,"uuid":"893608548","full_name":"speeedev/slang_example","owner":"speeedev","description":null,"archived":false,"fork":false,"pushed_at":"2024-11-25T13:26:23.000Z","size":413,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-02T13:13:21.976Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/speeedev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-11-24T21:39:25.000Z","updated_at":"2024-11-25T13:26:27.000Z","dependencies_parsed_at":"2024-11-25T00:02:58.546Z","dependency_job_id":null,"html_url":"https://github.com/speeedev/slang_example","commit_stats":null,"previous_names":["speeedev/slang_example"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/speeedev%2Fslang_example","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/speeedev%2Fslang_example/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/speeedev%2Fslang_example/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/speeedev%2Fslang_example/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/speeedev","download_url":"https://codeload.github.com/speeedev/slang_example/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246034222,"owners_count":20712851,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-12-07T22:08:21.195Z","updated_at":"2025-03-28T12:41:13.573Z","avatar_url":"https://github.com/speeedev.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"**Medium content:** https://medium.com/@speedev/flutterda-lokalizasyon-i18n-nas%C4%B1l-yap%C4%B1l%C4%B1r-ad%C4%B1m-ad%C4%B1m-0c438fcb8537 (Turkish)\n\n# Flutter Slang Localization Example\n\nThis project demonstrates how to implement localization (i18n) in a Flutter application using the Slang package efficiently and effectively. The application includes two main screens: a login screen (`LoginView`) and a home screen (`HomeView`). It also features dynamic language switching and automatic language detection based on the device's default settings.\n\n\n### Features\n- Automatically generated localization code using the Slang package.\n- Dynamic language switching via a dropdown menu.\n- Automatic language selection based on the device's default locale.\n- Supports English (en), Turkish (tr), and German (de).\n- Simple and clean code structure.\n\n### Project Structure\n\n**Key Directories and Files**\n- `lib/main.dart`: The entry point of the application, which includes localization setup and the main navigation structure.\n- `lib/views/login_view.dart`: The login screen, where users can input their credentials and navigate to the home screen.\n- `lib/views/home_view.dart`: The home screen, displaying a welcome message and a dropdown for language selection.\n- `assets/i18n/`: Contains the JSON files.\n- `lib/i18n/`: Contains generated Dart files for localization. \n\n**Localization Process**\n\n### 1. Define Localization Files\nCreate JSON files for each supported language in the assets/i18n directory. For example:\n\n- `strings.i18n.json` (default locale: English)\n- `strings_tr.i18n.json` (Turkish translations)\n- `strings_de.i18n.json` (German translations)\n\n**Example `strings.i18n.json`:**\n\n```json\n{\n  \"views\": {\n    \"login\": {\n      \"welcome\": \"Welcome\",\n      \"userName\": \"Username\",\n      \"userNameRequired\": \"Please enter your username.\",\n      \"password\": \"Password\",\n      \"passwordRequired\": \"Please enter your password.\",\n      \"passwordInvalid\": \"Password must be at least 6 characters.\",\n      \"loginButton\": \"Login\",\n      \"forgotPassword\": \"Forgot your password?\"\n    },\n    \"home\": {\n      \"welcome\": \"Welcome Home!\",\n      \"greeting\": \"Hello, {{userName}}!\",\n      \"language\": \"Current Language\"\n    }\n  }\n}\n```\n\n### 2. Generate Code\nRun the following command to generate Dart files for localization:\n\n```\ndart run slang\n```\n\nThis generates files such as `strings.g.dart` in the `lib/i18n` directory.\n\n### 3. Main Dart Configuration\n\nIn this step, we configure the app's localization and initialization settings in main.dart. This ensures that the app automatically adapts to the user's device language and enables translation features across the app.\n\n\n**Main Function Configuration**\n\n```dart\nvoid main() {\n  WidgetsFlutterBinding.ensureInitialized();\n  LocaleSettings.useDeviceLocale();  // Automatically sets the app's locale based on device settings\n  runApp(\n    TranslationProvider(  // Provides access to translations globally in the app\n      child: const MyApp(),\n    ),\n  );\n}\n```\n\n**MaterialApp Configuration**\n\n```dart\nclass MyApp extends StatelessWidget {\n  const MyApp({super.key});\n\n  @override\n  Widget build(BuildContext context) {\n    return MaterialApp(\n      debugShowCheckedModeBanner: false,\n      locale: TranslationProvider.of(context).flutterLocale,  // Uses the locale set by TranslationProvider\n      supportedLocales: AppLocaleUtils.supportedLocales,\n      localizationsDelegates: GlobalMaterialLocalizations.delegates,\n      theme: ThemeData(\n        primarySwatch: Colors.blue,\n      ),\n      home: LoginView(),  // The first screen displayed in the app\n    );\n  }\n}\n```\n\n### Final: Use Translations in Code\nAccess localized strings via the `t` variable:\n\n```dart\nText(t.views.login.welcome) // Displays \"Welcome\" in English.\nText(t.views.home.greeting(userName: \"John\")) // Displays \"Hello, John!\".\n```\n\n### Dynamic Language Switching\nThe application allows users to change the language dynamically using the dropdown menu on the `HomeView` screen. The language is switched using:\n\n```dart\nLocaleSettings.setLocale(AppLocale.tr); // Switch to Turkish.\n```\n\n### Screenshots\n| View            | Screenshot                                                                 |\n|------------------|------------------------------------------------------------------------|\n| **Login Screen** | ![Login Screen](https://github.com/speeedev/slang_example/blob/master/screenshots/login.png) |\n| **Home Screen**  | ![Home Screen](https://github.com/speeedev/slang_example/blob/master/screenshots/home.png)  |\n\n### Setup Instructions\n\nClone the Repository\n\n```\ngit clone https://github.com/speeedev/slang_example.git\ncd slang-example\n```\n\nInstall Dependencies Run the following command to install the required packages:\n\n```\nflutter pub get\n```\n\nRun the Application Start the application using:\n\n```\nflutter run\n```\n\nThanks for read.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fspeeedev%2Fslang_example","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fspeeedev%2Fslang_example","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fspeeedev%2Fslang_example/lists"}