feat: custom switch and custom settings item.

lib/ui/views/patcher/patcher_view.dart

@@ -29,11 +29,11 @@ class PatcherView extends StatelessWidget {
         ),
         body: SafeArea(
           child: SingleChildScrollView(
-            padding: const EdgeInsets.all(12.0),
+            padding: const EdgeInsets.symmetric(horizontal: 20.0),
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
               children: [
-                const SizedBox(height: 12),
+                const SizedBox(height: 60),
                 I18nText(
                   'patcherView.widgetTitle',
                   child: Text(

lib/ui/views/settings/settings_view.dart

@@ -5,6 +5,7 @@ import 'package:revanced_manager/constants.dart';
 import 'package:revanced_manager/theme.dart';
 import 'package:revanced_manager/ui/views/settings/settings_viewmodel.dart';
 import 'package:revanced_manager/ui/widgets/settingsView/about_info_widget.dart';
+import 'package:revanced_manager/ui/widgets/settingsView/settings_switch_item.dart';
 import 'package:stacked/stacked.dart';
 import 'package:stacked_themes/stacked_themes.dart';
 
@@ -20,11 +21,11 @@ class SettingsView extends StatelessWidget {
       builder: (context, SettingsViewModel model, child) => Scaffold(
         body: SafeArea(
           child: Padding(
-            padding: const EdgeInsets.all(12.0),
+            padding: const EdgeInsets.symmetric(horizontal: 12.0),
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
               children: <Widget>[
-                const SizedBox(height: 12),
+                const SizedBox(height: 60),
                 I18nText(
                   'settingsView.widgetTitle',
                   child: Text(
@@ -36,23 +37,15 @@ class SettingsView extends StatelessWidget {
                   ),
                 ),
                 const SizedBox(height: 12),
-                ListTile(
+                SettingsSwitchItem(
-                  title: I18nText(
+                  title: 'settingsView.themeLabel',
-                    'settingsView.themeLabel',
+                  subtitle: 'settingsView.themeHint',
-                    child: Text(
-                      '',
-                      style: kSettingItemTextStyle,
-                    ),
-                  ),
-                  subtitle: I18nText('settingsView.themeHint'),
-                  trailing: Switch(
                   value: isDark,
-                    onChanged: (value) {
+                  onTap: (value) {
                     isDark = value;
                     getThemeManager(context).toggleDarkLightTheme();
                   },
                 ),
-                ),
                 ListTile(
                   title: I18nText(
                     'settingsView.rootModeLabel',

lib/ui/widgets/settingsView/custom_switch.dart

@@ -0,0 +1,65 @@
+import 'package:flutter/material.dart';
+import 'package:fluttertoast/fluttertoast.dart';
+
+class CustomSwitch extends StatelessWidget {
+  final ValueChanged<bool> onChanged;
+  final bool value;
+  const CustomSwitch({
+    Key? key,
+    required this.onChanged,
+    required this.value,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    Color? activeColor = Theme.of(context).colorScheme.tertiary;
+    Color? inactiveColor = Theme.of(context).colorScheme.secondary;
+    return GestureDetector(
+      onTap: () {
+        onChanged(!value);
+        Fluttertoast.showToast(msg: 'Rooted: ${!value}');
+      },
+      child: SizedBox(
+        height: 25,
+        width: 50,
+        child: Stack(
+          children: [
+            AnimatedContainer(
+              height: 25,
+              width: 50,
+              curve: Curves.ease,
+              duration: const Duration(milliseconds: 500),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(
+                  Radius.circular(25.0),
+                ),
+                color: !value ? activeColor : inactiveColor,
+              ),
+            ),
+            AnimatedAlign(
+              curve: Curves.ease,
+              duration: const Duration(milliseconds: 500),
+              alignment: !value ? Alignment.centerLeft : Alignment.centerRight,
+              child: Container(
+                height: 20,
+                width: 20,
+                margin: const EdgeInsets.symmetric(horizontal: 3),
+                decoration: BoxDecoration(
+                  shape: BoxShape.circle,
+                  color: Colors.white,
+                  boxShadow: [
+                    BoxShadow(
+                      color: Colors.black12.withOpacity(0.1),
+                      spreadRadius: 0.5,
+                      blurRadius: 1,
+                    )
+                  ],
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/ui/widgets/settingsView/settings_switch_item.dart

@@ -0,0 +1,37 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_i18n/widgets/I18nText.dart';
+import 'package:revanced_manager/constants.dart';
+import 'package:revanced_manager/ui/widgets/settingsView/custom_switch.dart';
+
+class SettingsSwitchItem extends StatelessWidget {
+  final String title;
+  final String subtitle;
+  final bool value;
+  final Function(bool) onTap;
+
+  const SettingsSwitchItem({
+    Key? key,
+    required this.title,
+    required this.subtitle,
+    required this.value,
+    required this.onTap,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return ListTile(
+      title: I18nText(
+        title,
+        child: Text(
+          '',
+          style: kSettingItemTextStyle,
+        ),
+      ),
+      subtitle: I18nText(subtitle),
+      trailing: CustomSwitch(
+        value: value,
+        onChanged: onTap,
+      ),
+    );
+  }
+}