feat(style): use native switch & chip (#732)

* chore: remove useless themedata

* feat(style): new switch

* feat(style): use native chip components

* chore: remove unused import

* feat(accessibility): set tooltip

* chore: remove unneeded themedata

* chore: fix theme

* feat(i18n): add 3 new strings

* feat(style): correct material 3 theme on nondynamic
This commit is contained in:
EvadeMaster 2023-03-14 21:53:42 +07:00 committed by GitHub
parent b475bd25c8
commit 92a3b0d6e0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 75 additions and 202 deletions

View File

@ -79,8 +79,11 @@
"searchBarHint": "Search patches",
"doneButton": "Done",
"recommended": "Recommended",
"recommendedTooltip": "Select all recommended patches",
"all": "All",
"allTooltip": "Select all patches",
"none": "None",
"noneTooltip": "Deselect all patches",
"loadPatchesSelection": "Load patches selection",
"noSavedPatches": "No saved patches for the selected app.\nPress Done to save current selection.",
"noPatchesFound": "No patches found for the selected app",

View File

@ -12,7 +12,7 @@ var lightCustomTheme = ThemeData(
navigationBarTheme: NavigationBarThemeData(
labelTextStyle: MaterialStateProperty.all(
TextStyle(
color: lightCustomColorScheme.secondary,
color: lightCustomColorScheme.onSurface,
fontWeight: FontWeight.w500,
),
),
@ -33,7 +33,7 @@ var darkCustomTheme = ThemeData(
navigationBarTheme: NavigationBarThemeData(
labelTextStyle: MaterialStateProperty.all(
TextStyle(
color: darkCustomColorScheme.secondary,
color: darkCustomColorScheme.onSurface,
fontWeight: FontWeight.w500,
),
),
@ -41,50 +41,4 @@ var darkCustomTheme = ThemeData(
canvasColor: const Color(0xff1B1A1D),
scaffoldBackgroundColor: const Color(0xff1B1A1D),
textTheme: GoogleFonts.robotoTextTheme(ThemeData.dark().textTheme),
switchTheme: SwitchThemeData(
thumbColor:
MaterialStateProperty.resolveWith<Color?>((Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return const Color(0xffA5CAFF);
}
return null;
}),
trackColor:
MaterialStateProperty.resolveWith<Color?>((Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return const Color(0xffA5CAFF);
}
return null;
}),
),
radioTheme: RadioThemeData(
fillColor:
MaterialStateProperty.resolveWith<Color?>((Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return const Color(0xffA5CAFF);
}
return null;
}),
),
checkboxTheme: CheckboxThemeData(
fillColor:
MaterialStateProperty.resolveWith<Color?>((Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return const Color(0xffA5CAFF);
}
return null;
}),
),
);

View File

@ -23,139 +23,29 @@ class DynamicThemeBuilder extends StatelessWidget {
builder: (lightColorScheme, darkColorScheme) {
final ThemeData lightDynamicTheme = ThemeData(
useMaterial3: true,
canvasColor: lightColorScheme?.surface,
navigationBarTheme: NavigationBarThemeData(
backgroundColor: lightColorScheme?.surface,
indicatorColor: lightColorScheme?.secondaryContainer,
labelTextStyle: MaterialStateProperty.all(
GoogleFonts.roboto(
color: lightColorScheme?.onSurface,
fontWeight: FontWeight.w500,
),
),
iconTheme: MaterialStateProperty.all(
IconThemeData(
color: lightColorScheme?.onSecondaryContainer,
),
),
),
scaffoldBackgroundColor: lightColorScheme?.surface,
colorScheme: lightColorScheme?.harmonized(),
textTheme: GoogleFonts.robotoTextTheme(ThemeData.light().textTheme),
switchTheme: SwitchThemeData(
thumbColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return lightColorScheme?.primary;
}
return null;
}),
trackColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return lightColorScheme?.primary;
}
return null;
}),
),
radioTheme: RadioThemeData(
fillColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return lightColorScheme?.primary;
}
return null;
}),
),
checkboxTheme: CheckboxThemeData(
fillColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return lightColorScheme?.primary;
}
return null;
}),
),
);
final ThemeData darkDynamicTheme = ThemeData(
useMaterial3: true,
canvasColor: darkColorScheme?.surface,
navigationBarTheme: NavigationBarThemeData(
backgroundColor: darkColorScheme?.surface,
indicatorColor: darkColorScheme?.secondaryContainer,
labelTextStyle: MaterialStateProperty.all(
GoogleFonts.roboto(
color: darkColorScheme?.onSurface,
fontWeight: FontWeight.w500,
),
),
iconTheme: MaterialStateProperty.all(
IconThemeData(
color: darkColorScheme?.onSecondaryContainer,
),
),
),
scaffoldBackgroundColor: darkColorScheme?.surface,
colorScheme: darkColorScheme?.harmonized(),
textTheme: GoogleFonts.robotoTextTheme(ThemeData.dark().textTheme),
switchTheme: SwitchThemeData(
thumbColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return darkColorScheme?.primary;
}
return null;
}),
trackColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return darkColorScheme?.primary;
}
return null;
}),
),
radioTheme: RadioThemeData(
fillColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return darkColorScheme?.primary;
}
return null;
}),
),
checkboxTheme: CheckboxThemeData(
fillColor: MaterialStateProperty.resolveWith<Color?>(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return null;
}
if (states.contains(MaterialState.selected)) {
return darkColorScheme?.primary;
}
return null;
}),
),
);
return DynamicTheme(
themeCollection: ThemeCollection(

View File

@ -7,7 +7,6 @@ import 'package:revanced_manager/ui/views/home/home_viewmodel.dart';
import 'package:revanced_manager/ui/widgets/homeView/available_updates_card.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_chip.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_sliver_app_bar.dart';
import 'package:stacked/stacked.dart';
@ -22,8 +21,6 @@ class HomeView extends StatelessWidget {
viewModelBuilder: () => locator<HomeViewModel>(),
builder: (context, model, child) => Scaffold(
body: RefreshIndicator(
color: Theme.of(context).colorScheme.secondary,
backgroundColor: Theme.of(context).colorScheme.secondaryContainer,
onRefresh: () => model.forceRefresh(context),
child: CustomScrollView(
slivers: <Widget>[
@ -67,21 +64,47 @@ class HomeView extends StatelessWidget {
const SizedBox(height: 8),
Row(
children: <Widget>[
CustomChip(
ActionChip(
avatar: const Icon(Icons.grid_view),
label: I18nText('homeView.installed'),
isSelected: !model.showUpdatableApps,
onSelected: (value) {
side: BorderSide(
color: model.showUpdatableApps
? Theme.of(context).colorScheme.outline
: Theme.of(context)
.colorScheme
.secondaryContainer,
width: model.showUpdatableApps ? 1 : 1,
),
backgroundColor: model.showUpdatableApps
? Theme.of(context).colorScheme.background
: Theme.of(context)
.colorScheme
.secondaryContainer,
onPressed: () {
model.toggleUpdatableApps(false);
},
),
const SizedBox(width: 10),
CustomChip(
ActionChip(
avatar: const Icon(Icons.update),
label: I18nText('homeView.updatesAvailable'),
isSelected: model.showUpdatableApps,
onSelected: (value) {
side: BorderSide(
color: !model.showUpdatableApps
? Theme.of(context).colorScheme.outline
: Theme.of(context)
.colorScheme
.secondaryContainer,
width: !model.showUpdatableApps ? 1 : 1,
),
backgroundColor: !model.showUpdatableApps
? Theme.of(context).colorScheme.background
: Theme.of(context)
.colorScheme
.secondaryContainer,
onPressed: () {
model.toggleUpdatableApps(true);
},
)
),
],
),
const SizedBox(height: 14),

View File

@ -42,7 +42,6 @@ class NavigationView extends StatelessWidget {
context,
'navigationView.dashboardTab',
),
tooltip: '',
),
NavigationDestination(
icon: model.isIndexSelected(1)
@ -52,7 +51,6 @@ class NavigationView extends StatelessWidget {
context,
'navigationView.patcherTab',
),
tooltip: '',
),
NavigationDestination(
icon: model.isIndexSelected(2)
@ -62,7 +60,6 @@ class NavigationView extends StatelessWidget {
context,
'navigationView.settingsTab',
),
tooltip: '',
),
],
),

View File

@ -2,7 +2,6 @@ import 'package:flutter/material.dart';
import 'package:flutter_i18n/flutter_i18n.dart';
import 'package:revanced_manager/ui/views/patches_selector/patches_selector_viewmodel.dart';
import 'package:revanced_manager/ui/widgets/patchesSelectorView/patch_item.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_chip.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_popup_menu.dart';
import 'package:revanced_manager/ui/widgets/shared/search_bar.dart';
import 'package:stacked/stacked.dart';
@ -135,27 +134,36 @@ class _PatchesSelectorViewState extends State<PatchesSelectorView> {
children: [
Row(
children: [
CustomChip(
label:
I18nText('patchesSelectorView.recommended'),
onSelected: (value) {
ActionChip(
label: I18nText('patchesSelectorView.recommended'),
tooltip: FlutterI18n.translate(
context,
'patchesSelectorView.recommendedTooltip',
),
onPressed: () {
model.selectRecommendedPatches();
},
),
const SizedBox(width: 8),
CustomChip(
ActionChip(
label: I18nText('patchesSelectorView.all'),
onSelected: (value) {
if (value) {
model.selectAllPatcherWarning(context);
}
tooltip: FlutterI18n.translate(
context,
'patchesSelectorView.allTooltip',
),
onPressed: () {
model.selectAllPatcherWarning(context);
model.selectAllPatches(true);
},
),
const SizedBox(width: 8),
CustomChip(
ActionChip(
label: I18nText('patchesSelectorView.none'),
onSelected: (value) {
tooltip: FlutterI18n.translate(
context,
'patchesSelectorView.noneTooltip',
),
onPressed: () {
model.clearPatches();
},
),

View File

@ -7,7 +7,6 @@ import 'package:flutter_i18n/widgets/I18nText.dart';
import 'package:revanced_manager/app/app.locator.dart';
import 'package:revanced_manager/services/manager_api.dart';
import 'package:revanced_manager/ui/views/settings/settings_viewmodel.dart';
import 'package:revanced_manager/ui/widgets/settingsView/custom_switch_tile.dart';
import 'package:revanced_manager/ui/widgets/settingsView/settings_section.dart';
import 'package:stacked/stacked.dart';
@ -64,8 +63,8 @@ class SUpdateThemeUI extends StatelessWidget {
return SettingsSection(
title: 'settingsView.appearanceSectionTitle',
children: <Widget>[
CustomSwitchTile(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
SwitchListTile(
contentPadding: const EdgeInsets.symmetric(horizontal: 20.0),
title: I18nText(
'settingsView.darkThemeLabel',
child: const Text(
@ -78,7 +77,7 @@ class SUpdateThemeUI extends StatelessWidget {
),
subtitle: I18nText('settingsView.darkThemeHint'),
value: SUpdateTheme().getDarkThemeStatus(),
onTap: (value) => SUpdateTheme().setUseDarkTheme(
onChanged: (value) => SUpdateTheme().setUseDarkTheme(
context,
value,
),
@ -88,8 +87,8 @@ class SUpdateThemeUI extends StatelessWidget {
builder: (context, snapshot) => Visibility(
visible:
snapshot.hasData && snapshot.data! >= ANDROID_12_SDK_VERSION,
child: CustomSwitchTile(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
child: SwitchListTile(
contentPadding: const EdgeInsets.symmetric(horizontal: 20.0),
title: I18nText(
'settingsView.dynamicThemeLabel',
child: const Text(
@ -102,11 +101,12 @@ class SUpdateThemeUI extends StatelessWidget {
),
subtitle: I18nText('settingsView.dynamicThemeHint'),
value: _settingViewModel.sUpdateTheme.getDynamicThemeStatus(),
onTap: (value) =>
_settingViewModel.sUpdateTheme.setUseDynamicTheme(
context,
value,
),
onChanged: (value) => {
_settingViewModel.sUpdateTheme.setUseDynamicTheme(
context,
value,
),
},
),
),
),

View File

@ -1,7 +1,6 @@
import 'package:flutter/material.dart';
import 'package:flutter_i18n/widgets/I18nText.dart';
import 'package:revanced_manager/ui/views/settings/settings_viewmodel.dart';
import 'package:revanced_manager/ui/widgets/settingsView/custom_switch_tile.dart';
class SExperimentalPatches extends StatefulWidget {
const SExperimentalPatches({super.key});
@ -15,8 +14,8 @@ final _settingsViewModel = SettingsViewModel();
class _SExperimentalPatchesState extends State<SExperimentalPatches> {
@override
Widget build(BuildContext context) {
return CustomSwitchTile(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
return SwitchListTile(
contentPadding: const EdgeInsets.symmetric(horizontal: 20.0),
title: I18nText(
'settingsView.experimentalPatchesLabel',
child: const Text(
@ -29,7 +28,7 @@ class _SExperimentalPatchesState extends State<SExperimentalPatches> {
),
subtitle: I18nText('settingsView.experimentalPatchesHint'),
value: _settingsViewModel.areExperimentalPatchesEnabled(),
onTap: (value) {
onChanged: (value) {
setState(() {
_settingsViewModel.useExperimentalPatches(value);
});

View File

@ -1,7 +1,6 @@
import 'package:flutter/material.dart';
import 'package:flutter_i18n/widgets/I18nText.dart';
import 'package:revanced_manager/ui/views/settings/settings_viewmodel.dart';
import 'package:revanced_manager/ui/widgets/settingsView/custom_switch_tile.dart';
class SExperimentalUniversalPatches extends StatefulWidget {
const SExperimentalUniversalPatches({super.key});
@ -17,8 +16,8 @@ class _SExperimentalUniversalPatchesState
extends State<SExperimentalUniversalPatches> {
@override
Widget build(BuildContext context) {
return CustomSwitchTile(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
return SwitchListTile(
contentPadding: const EdgeInsets.symmetric(horizontal: 20.0),
title: I18nText(
'settingsView.experimentalUniversalPatchesLabel',
child: const Text(
@ -31,7 +30,7 @@ class _SExperimentalUniversalPatchesState
),
subtitle: I18nText('settingsView.experimentalUniversalPatchesHint'),
value: _settingsViewModel.areUniversalPatchesEnabled(),
onTap: (value) {
onChanged: (value) {
setState(() {
_settingsViewModel.showUniversalPatches(value);
});