feat: overall UI rework in Settings View (#53)

This commit is contained in:
Alberto Ponces
2022-09-02 14:35:25 +01:00
committed by GitHub
parent 036e8c99b3
commit 4f7b1d4520
37 changed files with 485 additions and 361 deletions

View File

@ -50,7 +50,7 @@ class _AppSelectorViewState extends State<AppSelectorView> {
),
)
: Column(
children: [
children: <Widget>[
SearchBar(
showSelectIcon: false,
fillColor: isDark

View File

@ -15,7 +15,7 @@ class ContributorsView extends StatelessWidget {
body: SafeArea(
child: SingleChildScrollView(
child: Column(
children: [
children: <Widget>[
ContributorsCard(
title: 'Patcher Contributors',
contributors: model.patcherContributors,

View File

@ -8,6 +8,7 @@ import 'package:revanced_manager/ui/widgets/homeView/available_updates_card.dart
import 'package:revanced_manager/ui/widgets/homeView/dashboard_raw_chip.dart';
import 'package:revanced_manager/ui/widgets/homeView/installed_apps_card.dart';
import 'package:revanced_manager/ui/widgets/homeView/latest_commit_card.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_sliver_app_bar.dart';
import 'package:stacked/stacked.dart';
class HomeView extends StatelessWidget {
@ -22,32 +23,14 @@ class HomeView extends StatelessWidget {
builder: (context, model, child) => Scaffold(
body: CustomScrollView(
slivers: <Widget>[
SliverAppBar(
pinned: true,
snap: false,
floating: false,
expandedHeight: 100.0,
automaticallyImplyLeading: false,
backgroundColor: MaterialStateColor.resolveWith(
(states) => states.contains(MaterialState.scrolledUnder)
? isDark
? Theme.of(context).colorScheme.primary
: Theme.of(context).navigationBarTheme.backgroundColor!
: Theme.of(context).scaffoldBackgroundColor,
),
flexibleSpace: FlexibleSpaceBar(
titlePadding: const EdgeInsets.symmetric(
vertical: 23.0,
horizontal: 20.0,
),
title: I18nText(
'homeView.widgetTitle',
child: Text(
'',
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
CustomSliverAppBar(
title: I18nText(
'homeView.widgetTitle',
child: Text(
'',
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
),
),
@ -89,9 +72,9 @@ class HomeView extends StatelessWidget {
),
const SizedBox(height: 8),
Row(
children: [
children: <Widget>[
DashboardChip(
label: 'homeView.updatesAvailable',
label: I18nText('homeView.updatesAvailable'),
isSelected: model.showUpdatableApps,
onSelected: (value) {
model.toggleUpdatableApps(true);
@ -99,7 +82,7 @@ class HomeView extends StatelessWidget {
),
const SizedBox(width: 10),
DashboardChip(
label: 'homeView.installed',
label: I18nText('homeView.installed'),
isSelected: !model.showUpdatableApps,
onSelected: (value) {
model.toggleUpdatableApps(false);

View File

@ -1,8 +1,9 @@
import 'package:flutter/material.dart';
import 'package:flutter_i18n/flutter_i18n.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:revanced_manager/theme.dart';
import 'package:revanced_manager/ui/views/installer/installer_viewmodel.dart';
import 'package:revanced_manager/ui/widgets/installerView/custom_material_button.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_sliver_app_bar.dart';
import 'package:stacked/stacked.dart';
class InstallerView extends StatelessWidget {
@ -18,32 +19,12 @@ class InstallerView extends StatelessWidget {
body: CustomScrollView(
controller: model.scrollController,
slivers: <Widget>[
SliverAppBar(
pinned: true,
snap: false,
floating: false,
expandedHeight: 100.0,
automaticallyImplyLeading: false,
backgroundColor: MaterialStateColor.resolveWith(
(states) => states.contains(MaterialState.scrolledUnder)
? isDark
? Theme.of(context).colorScheme.primary
: Theme.of(context)
.navigationBarTheme
.backgroundColor!
: Theme.of(context).scaffoldBackgroundColor,
),
flexibleSpace: FlexibleSpaceBar(
titlePadding: const EdgeInsets.symmetric(
vertical: 23.0,
horizontal: 20.0,
),
title: Text(
model.headerLogs,
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
CustomSliverAppBar(
title: Text(
model.headerLogs,
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
),
bottom: PreferredSize(
@ -84,17 +65,17 @@ class InstallerView extends StatelessWidget {
visible: !model.isPatching,
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
children: <Widget>[
CustomMaterialButton(
text: 'installerView.shareButton',
label: I18nText('installerView.shareButton'),
isFilled: false,
onPressed: () => model.shareResult(),
),
const SizedBox(width: 16),
CustomMaterialButton(
text: model.isInstalled
? 'installerView.openButton'
: 'installerView.installButton',
label: model.isInstalled
? I18nText('installerView.openButton')
: I18nText('installerView.installButton'),
isFilled: true,
isExpanded: true,
onPressed: () {

View File

@ -9,6 +9,7 @@ import 'package:revanced_manager/ui/views/patcher/patcher_viewmodel.dart';
import 'package:revanced_manager/ui/views/patches_selector/patches_selector_view.dart';
import 'package:revanced_manager/ui/widgets/patcherView/app_selector_card.dart';
import 'package:revanced_manager/ui/widgets/patcherView/patch_selector_card.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_sliver_app_bar.dart';
import 'package:revanced_manager/ui/widgets/shared/open_container_wrapper.dart';
import 'package:stacked/stacked.dart';
@ -39,32 +40,14 @@ class PatcherView extends StatelessWidget {
),
body: CustomScrollView(
slivers: <Widget>[
SliverAppBar(
pinned: true,
snap: false,
floating: false,
expandedHeight: 100.0,
automaticallyImplyLeading: false,
backgroundColor: MaterialStateColor.resolveWith(
(states) => states.contains(MaterialState.scrolledUnder)
? isDark
? Theme.of(context).colorScheme.primary
: Theme.of(context).navigationBarTheme.backgroundColor!
: Theme.of(context).scaffoldBackgroundColor,
),
flexibleSpace: FlexibleSpaceBar(
titlePadding: const EdgeInsets.symmetric(
vertical: 23.0,
horizontal: 20.0,
),
title: I18nText(
'patcherView.widgetTitle',
child: Text(
'',
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
CustomSliverAppBar(
title: I18nText(
'patcherView.widgetTitle',
child: Text(
'',
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
),
),

View File

@ -49,7 +49,7 @@ class _PatchesSelectorViewState extends State<PatchesSelectorView> {
),
)
: Column(
children: [
children: <Widget>[
SearchBar(
showSelectIcon: true,
fillColor:

View File

@ -1,5 +1,5 @@
import 'package:flutter/material.dart';
import 'package:flutter_i18n/widgets/I18nText.dart';
import 'package:flutter_i18n/flutter_i18n.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:revanced_manager/ui/views/root_checker/root_checker_viewmodel.dart';
import 'package:revanced_manager/ui/widgets/rootCheckerView/magisk_button.dart';
@ -27,7 +27,7 @@ class RootCheckerView extends StatelessWidget {
height: double.infinity,
padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 28.0),
child: Column(
children: [
children: <Widget>[
const SizedBox(height: 120),
I18nText(
'rootCheckerView.widgetTitle',
@ -53,7 +53,7 @@ class RootCheckerView extends StatelessWidget {
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
children: <Widget>[
MagiskButton(
onPressed: () => model.navigateAsRoot(),
),

View File

@ -3,11 +3,16 @@ import 'package:flutter_i18n/flutter_i18n.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:revanced_manager/constants.dart';
import 'package:revanced_manager/theme.dart';
import 'package:revanced_manager/ui/views/contributors/contributors_view.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/custom_text_field.dart';
import 'package:revanced_manager/ui/widgets/settingsView/settings_switch_item.dart';
import 'package:revanced_manager/ui/widgets/settingsView/social_media_cards.dart';
import 'package:revanced_manager/ui/widgets/settingsView/about_widget.dart';
import 'package:revanced_manager/ui/widgets/settingsView/custom_switch_tile.dart';
import 'package:revanced_manager/ui/widgets/settingsView/settings_tile_dialog.dart';
import 'package:revanced_manager/ui/widgets/settingsView/settings_section.dart';
import 'package:revanced_manager/ui/widgets/settingsView/social_media_widget.dart';
import 'package:revanced_manager/ui/widgets/settingsView/sources_widget.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_sliver_app_bar.dart';
import 'package:revanced_manager/ui/widgets/shared/open_container_wrapper.dart';
import 'package:stacked/stacked.dart';
import 'package:stacked_themes/stacked_themes.dart';
@ -22,149 +27,124 @@ class SettingsView extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ViewModelBuilder<SettingsViewModel>.reactive(
disposeViewModel: false,
viewModelBuilder: () => SettingsViewModel(),
onModelReady: (model) => model.initialize(),
builder: (context, SettingsViewModel model, child) => Scaffold(
body: CustomScrollView(
slivers: <Widget>[
SliverAppBar(
pinned: true,
snap: false,
floating: false,
expandedHeight: 100.0,
automaticallyImplyLeading: false,
backgroundColor: MaterialStateColor.resolveWith(
(states) => states.contains(MaterialState.scrolledUnder)
? isDark
? Theme.of(context).colorScheme.primary
: Theme.of(context).navigationBarTheme.backgroundColor!
: Theme.of(context).scaffoldBackgroundColor,
),
flexibleSpace: FlexibleSpaceBar(
titlePadding: const EdgeInsets.symmetric(
vertical: 23.0,
horizontal: 20.0,
),
title: I18nText(
'settingsView.widgetTitle',
child: Text(
'',
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
CustomSliverAppBar(
title: I18nText(
'settingsView.widgetTitle',
child: Text(
'',
style: GoogleFonts.inter(
color: Theme.of(context).textTheme.headline5!.color,
fontWeight: FontWeight.w500,
),
),
),
),
SliverPadding(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
padding: const EdgeInsets.symmetric(
vertical: 10.0,
horizontal: 20.0,
),
sliver: SliverList(
delegate: SliverChildListDelegate.fixed(
<Widget>[
SettingsSwitchItem(
title: 'settingsView.themeLabel',
subtitle: 'settingsView.themeHint',
value: isDark,
onTap: (value) {
isDark = value;
getThemeManager(context).toggleDarkLightTheme();
},
),
ListTile(
title: I18nText(
'settingsView.rootModeLabel',
child: Text(
'',
style: kSettingItemTextStyle,
),
),
subtitle: I18nText('settingsView.rootModeHint'),
trailing: GestureDetector(
onTap: () {
model.navigateToRootChecker();
},
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 16, vertical: 8),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
border: Border.all(
width: 1,
color: Theme.of(context).colorScheme.secondary,
SettingsSection(
title: 'settingsView.appearanceSectionTitle',
children: <Widget>[
CustomSwitchTile(
title: I18nText(
'settingsView.themeLabel',
child: Text(
'',
style: kSettingItemTextStyle,
),
),
child: Text(
model.isRooted ? 'Rooted' : 'Not rooted',
),
subtitle: I18nText('settingsView.themeHint'),
value: isDark,
onTap: (value) {
isDark = value;
getThemeManager(context).toggleDarkLightTheme();
},
),
),
],
),
CustomTextField(
inputController: organizationController,
label: 'settingsView.organizationLabel',
hint: ghOrg,
onChanged: (value) {
ghOrg = value;
},
),
CustomTextField(
inputController: patchesSourceController,
label: 'settingsView.patchesSourceLabel',
hint: patchesRepo,
onChanged: (value) {
patchesRepo = value;
},
),
CustomTextField(
inputController: integrationsSourceController,
label: 'settingsView.integrationsSourceLabel',
hint: integrationsRepo,
onChanged: (value) {
integrationsRepo = value;
},
),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 16.0,
vertical: 8.0,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
I18nText(
'settingsView.languageLabel',
child: Text('', style: kSettingItemTextStyle),
),
DropdownButton(
SettingsTileDialog(
title: 'settingsView.languageLabel',
subtitle: 'English',
children: <Widget>[
RadioListTile<String>(
title: I18nText('settingsView.englishOption'),
value: 'en',
items: const [
DropdownMenuItem(
value: 'en',
child: Text('English'),
),
DropdownMenuItem(
value: 'fr',
child: Text('French'),
),
],
groupValue: 'en',
onChanged: (value) {
value = value;
model.updateLanguage(context, value);
Navigator.of(context).pop();
},
),
],
),
RadioListTile<String>(
title: I18nText('settingsView.frenchOption'),
value: 'fr',
groupValue: 'en',
onChanged: (value) {
model.updateLanguage(context, value);
Navigator.of(context).pop();
},
),
]),
const Divider(thickness: 1.0),
SettingsSection(
title: 'settingsView.patcherSectionTitle',
children: <Widget>[
ListTile(
contentPadding: EdgeInsets.zero,
title: I18nText(
'settingsView.rootModeLabel',
child: Text(
'',
style: kSettingItemTextStyle,
),
),
subtitle: I18nText('settingsView.rootModeHint'),
onTap: () => model.navigateToRootChecker(),
),
SourcesWidget(
title: 'settingsView.sourcesLabel',
organizationController: organizationController,
patchesSourceController: patchesSourceController,
integrationsSourceController:
integrationsSourceController,
),
],
),
ListTile(
title: I18nText(
'settingsView.contributorsLabel',
child: Text('', style: kSettingItemTextStyle),
),
onTap: model.navigateToContributors,
const Divider(thickness: 1.0),
SettingsSection(
title: 'settingsView.teamSectionTitle',
children: <Widget>[
OpenContainerWrapper(
openBuilder: (_, __) => const ContributorsView(),
closedBuilder: (_, openContainer) => ListTile(
contentPadding: EdgeInsets.zero,
title: I18nText(
'settingsView.contributorsLabel',
child: Text('', style: kSettingItemTextStyle),
),
subtitle: I18nText('settingsView.contributorsHint'),
onTap: openContainer,
),
),
const SocialMediaWidget(),
],
),
const Divider(thickness: 1.0),
const SettingsSection(
title: 'settingsView.infoSectionTitle',
children: <Widget>[
AboutWidget(),
],
),
const SocialMediaCards(),
const AboutWidget(),
],
),
),

View File

@ -1,29 +1,26 @@
import 'package:flutter/material.dart';
import 'package:flutter_i18n/flutter_i18n.dart';
import 'package:revanced_manager/app/app.locator.dart';
import 'package:revanced_manager/app/app.router.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:stacked/stacked.dart';
import 'package:stacked_services/stacked_services.dart';
import 'package:timeago/timeago.dart';
class SettingsViewModel extends BaseViewModel {
bool isRooted = false;
Future<void> initialize() async {
SharedPreferences prefs = await SharedPreferences.getInstance();
isRooted = prefs.getBool('isRooted') ?? false;
notifyListeners();
}
final NavigationService _navigationService = locator<NavigationService>();
void setLanguage(String language) {
notifyListeners();
}
void navigateToContributors() {
_navigationService.navigateTo(Routes.contributorsView);
}
void navigateToRootChecker() {
_navigationService.navigateTo(Routes.rootCheckerView);
}
Future<void> updateLanguage(BuildContext context, String? value) async {
if (value != null) {
await FlutterI18n.refresh(context, Locale(value));
setLocaleMessages(value, EnMessages());
}
}
}