{"id":252,"date":"2025-05-10T17:41:46","date_gmt":"2025-05-10T14:41:46","guid":{"rendered":"https:\/\/www.webmobkey.com\/blog\/?p=252"},"modified":"2025-11-16T10:21:46","modified_gmt":"2025-11-16T10:21:46","slug":"getx-ile-flutter-uygulamasi-gelistirmek-tema-dil-ve-sayac-yonetimi","status":"publish","type":"post","link":"https:\/\/www.webmobdesign.com\/blog\/tr\/getx-ile-flutter-uygulamasi-gelistirmek-tema-dil-ve-sayac-yonetimi\/","title":{"rendered":"GetX ile Flutter Uygulamas\u0131 Geli\u015ftirmek: Tema, Dil ve Saya\u00e7 Y\u00f6netimi"},"content":{"rendered":"\n

Flutter d\u00fcnyas\u0131nda performansl\u0131, sade ve y\u00f6netilebilir bir mimari olu\u015fturmak istiyorsan\u0131z, GetX<\/strong> harika bir tercih! Bu yaz\u0131da, GetX ile nas\u0131l tema<\/strong>, dil<\/strong> ve durum y\u00f6netimi<\/strong> yap\u0131labilece\u011fini i\u00e7eren \u00f6rnek bir projeyi ad\u0131m ad\u0131m inceleyece\u011fiz.<\/p>\n\n\n\n

\ud83c\udfd7\ufe0f Proje Genel Yap\u0131s\u0131<\/h4>\n\n\n\n

Projemizde \u015fu \u00f6zellikler yer al\u0131yor:<\/p>\n\n\n\n

    \n
  • Tema (Dark\/Light) de\u011fi\u015ftirme<\/li>\n\n\n\n
  • Dil (TR\/EN) de\u011fi\u015ftirme<\/li>\n\n\n\n
  • Saya\u00e7 kontrol\u00fc (her sayfada eri\u015filebilir)<\/li>\n\n\n\n
  • Drawer men\u00fc ile dinamik sayfa y\u00f6nlendirmesi<\/li>\n\n\n\n
  • GetX\u2019in reactive state y\u00f6netimi (.obs)<\/li>\n\n\n\n
  • GetX\u2019in routing ve localization deste\u011fi<\/li>\n<\/ul>\n\n\n\n

    Tam Kod<\/strong><\/h4>\n\n\n
    \n import 'package:flutter\/material.dart';\nimport 'package:get\/get.dart';\n\nvoid main() {\n  \/\/ Controller'lar\u0131 Uygulama Ba\u015f\u0131nda Y\u00fckle\n  Get.put(AppController());\n  Get.put(CounterController());\n\n  runApp(MyApp());\n}\n\n\/\/ \ud83c\udf19 Tema ve Dil Kontrol\u00fc\nclass AppController extends GetxController {\n  var isDark = false.obs;\n  var locale = const Locale('en', 'US').obs;\n\n  void toggleTheme() {\n    isDark.value = !isDark.value;\n    Get.changeThemeMode(isDark.value ? ThemeMode.dark : ThemeMode.light);\n  }\n\n  void changeLang(String langCode) {\n    locale.value =\n    langCode == 'tr' ? const Locale('tr', 'TR') : const Locale('en', 'US');\n    Get.updateLocale(locale.value);\n  }\n}\n\n\/\/ \ud83d\udd22 Saya\u00e7\nclass CounterController extends GetxController {\n  var count = 0.obs;\n  void increment() => count++;\n}\n\n\/\/ \ud83c\udf0d Dil Deste\u011fi\nclass MyTranslations extends Translations {\n  @override\n  Map&lt;String, Map&lt;String, String>> get keys => {\n    'en_US': {\n      'home': 'Home',\n      'page': 'Page',\n      'change_theme': 'Change Theme',\n      'change_lang': 'Change Language',\n      'back': 'Back',\n      'increase': 'Increase',\n    },\n    'tr_TR': {\n      'home': 'Ana Sayfa',\n      'page': 'Sayfa',\n      'change_theme': 'Temay\u0131 De\u011fi\u015ftir',\n      'change_lang': 'Dili De\u011fi\u015ftir',\n      'back': 'Geri',\n      'increase': 'Artt\u0131r',\n    },\n  };\n}\n\n\/\/ \ud83d\ude80 Uygulama\nclass MyApp extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    return GetMaterialApp(\n      translations: MyTranslations(),\n      locale: const Locale('en', 'US'),\n      fallbackLocale: const Locale('en', 'US'),\n      title: 'GetX Layout App',\n      theme: ThemeData.light(),\n      darkTheme: ThemeData.dark(),\n      themeMode: ThemeMode.system,\n      initialRoute: '\/',\n      getPages: [\n        GetPage(name: '\/', page: () => LayoutPage(child: HomePage())),\n        for (int i = 1; i &lt;= 5; i++)\n          GetPage(name: '\/page$i', page: () => LayoutPage(child: PageX(i))),\n      ],\n    );\n  }\n}\n\n\/\/ \ud83e\uddf1 LAYOUT SAYFASI\nclass LayoutPage extends StatelessWidget {\n  final Widget child;\n\n  LayoutPage({required this.child});\n\n  @override\n  Widget build(BuildContext context) {\n    final AppController appController = Get.find();\n\n    return Obx(\n          () => Scaffold(\n        appBar: AppBar(\n          title: Text('GetX Layout'),\n          actions: [\n            IconButton(\n              icon: Icon(Icons.language),\n              onPressed:\n                  () => appController.changeLang(\n                appController.locale.value.languageCode == 'en'\n                    ? 'tr'\n                    : 'en',\n              ),\n            ),\n            IconButton(\n              icon: Icon(\n                appController.isDark.value ? Icons.light_mode : Icons.dark_mode,\n              ),\n              onPressed: appController.toggleTheme,\n            ),\n          ],\n        ),\n        drawer: Drawer(\n          child: ListView(\n            children: [\n              DrawerHeader(child: Text('Menu', style: TextStyle(fontSize: 24))),\n              ListTile(title: Text('home'.tr), onTap: () => Get.offNamed('\/')),\n              for (int i = 1; i &lt;= 5; i++)\n                ListTile(\n                  title: Text('${'page'.tr} $i'),\n                  onTap: () => Get.offNamed('\/page$i'),\n                ),\n            ],\n          ),\n        ),\n        body: child,\n      ),\n    );\n  }\n}\n\n\/\/ \ud83c\udfe0 Ana Sayfa\nclass HomePage extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    return Center(child: Text('home'.tr, style: TextStyle(fontSize: 32)));\n  }\n}\n\n\/\/ \ud83d\udcc4 Sayfalar\nclass PageX extends StatelessWidget {\n  final int page;\n  final CounterController counterController = Get.find();\n  PageX(this.page);\n\n  @override\n  Widget build(BuildContext context) {\n    return Center(\n      child: Column(\n        mainAxisAlignment: MainAxisAlignment.center,\n        children: [\n          Obx(\n                () => Text(\n              'Sayfa $page - Saya\u00e7: ${counterController.count.value}',\n              style: TextStyle(fontSize: 24),\n            ),\n          ),\n          const SizedBox(height: 10),\n          ElevatedButton(\n            onPressed: counterController.increment,\n            child: Text('increase'.tr),\n          ),\n          const SizedBox(height: 10),\n          ElevatedButton(onPressed: () => Get.back(), child: Text('back'.tr)),\n        ],\n      ),\n    );\n  }\n}\n<\/pre><\/div>\n\n\n
    \u0130ki adet controller\u2019\u0131m\u0131z var:<\/p>\n\n\n\n
    AppController<\/h4>\n\n\n\n
    : Tema ve Dil Y\u00f6netimi<\/h4>\n\n\n
    \nvar isDark = false.obs;\nvar locale = const Locale('en', 'US').obs;\n<\/pre><\/div>\n\n\n
    GetX\u2019in .obs yap\u0131s\u0131 sayesinde de\u011fer de\u011fi\u015fti\u011finde UI otomatik olarak g\u00fcncellenir.<\/p>\n\n\n\n