feat(ui_kit): update example by removing adaptative theme

This commit is contained in:
Hugo Pointcheval 2023-04-28 14:04:15 +02:00
parent 4097a420c8
commit a024b7e70a
Signed by: hugo
GPG Key ID: 3AAC487E131E00BC
11 changed files with 184 additions and 101 deletions

View File

@ -1,7 +1,9 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:gap/gap.dart'; import 'package:gap/gap.dart';
import 'package:wyatt_ui_components/wyatt_ui_components.dart'; import 'package:wyatt_ui_components/wyatt_ui_components.dart';
import 'package:wyatt_ui_kit/wyatt_ui_kit.dart'; import 'package:wyatt_ui_kit/wyatt_ui_kit.dart';
import 'package:wyatt_ui_kit_example/cubit/app_mode_cubit.dart';
class InformationCards extends StatelessWidget { class InformationCards extends StatelessWidget {
const InformationCards({super.key}); const InformationCards({super.key});
@ -43,12 +45,21 @@ class InformationCards extends StatelessWidget {
const Gap(20), const Gap(20),
InformationCard( InformationCard(
background: Center( background: Center(
child: Container( child: ColorFiltered(
decoration: const BoxDecoration( colorFilter: ColorFilter.mode(
image: DecorationImage( context.watch<AppModeCubit>().state.brightness ==
image: AssetImage('assets/images/asset_1.png'), Brightness.light
fit: BoxFit.fitHeight, ? Colors.grey.withOpacity(0.2)
alignment: Alignment.centerRight, : Colors.white.withOpacity(0.2),
BlendMode.srcIn,
),
child: Container(
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/asset_1.png'),
fit: BoxFit.fitHeight,
alignment: Alignment.centerRight,
),
), ),
), ),
), ),
@ -110,12 +121,21 @@ class InformationCards extends StatelessWidget {
const Gap(20), const Gap(20),
InformationCard( InformationCard(
background: Center( background: Center(
child: Container( child: ColorFiltered(
decoration: const BoxDecoration( colorFilter: ColorFilter.mode(
image: DecorationImage( context.watch<AppModeCubit>().state.brightness ==
image: AssetImage('assets/images/asset_1.png'), Brightness.light
fit: BoxFit.fitHeight, ? Colors.grey.withOpacity(0.2)
alignment: Alignment.centerRight, : Colors.white.withOpacity(0.2),
BlendMode.srcIn,
),
child: Container(
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/asset_1.png'),
fit: BoxFit.fitHeight,
alignment: Alignment.centerRight,
),
), ),
), ),
), ),
@ -128,9 +148,9 @@ class InformationCards extends StatelessWidget {
subtitle: TextWrapper( subtitle: TextWrapper(
'One single code base.', 'One single code base.',
style: Theme.of(context).textTheme.titleMedium?.copyWith( style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontSize: 15, fontSize: 15,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
), ),
), ),
body: const TextWrapper( body: const TextWrapper(
'Cupidatat reprehenderit aliqua eiusmod Lorem. ' 'Cupidatat reprehenderit aliqua eiusmod Lorem. '

View File

@ -1,4 +1,3 @@
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:gap/gap.dart'; import 'package:gap/gap.dart';
import 'package:wyatt_ui_components/wyatt_ui_components.dart'; import 'package:wyatt_ui_components/wyatt_ui_components.dart';
@ -31,10 +30,12 @@ class PortfolioCards extends StatelessWidget {
'quis elit ut amet velit. Incididunt fugiat proident ' 'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '), 'proident deserunt tempor Lorem cillum qui do '),
ctas: [ ctas: [
CupertinoButton( context.components.flatButtonComponent.call(
color: Theme.of(context).primaryColor, label: const TextWrapper('En savoir plus'),
onPressed: () {}, suffix: const Icon(
child: const Text('En savoir plus >'), Icons.arrow_forward_ios,
size: 15,
),
), ),
], ],
assets: [ assets: [
@ -64,10 +65,12 @@ class PortfolioCards extends StatelessWidget {
'quis elit ut amet velit. Incididunt fugiat proident ' 'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '), 'proident deserunt tempor Lorem cillum qui do '),
ctas: [ ctas: [
CupertinoButton( context.components.flatButtonComponent.call(
color: Theme.of(context).primaryColor, label: const TextWrapper('En savoir plus'),
onPressed: () {}, suffix: const Icon(
child: const Text('En savoir plus >'), Icons.arrow_forward_ios,
size: 15,
),
), ),
], ],
assets: [ assets: [
@ -97,10 +100,12 @@ class PortfolioCards extends StatelessWidget {
'quis elit ut amet velit. Incididunt fugiat proident ' 'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '), 'proident deserunt tempor Lorem cillum qui do '),
ctas: [ ctas: [
CupertinoButton( context.components.flatButtonComponent.call(
color: Theme.of(context).primaryColor, label: const TextWrapper('En savoir plus'),
onPressed: () {}, suffix: const Icon(
child: const Text('En savoir plus >'), Icons.arrow_forward_ios,
size: 15,
),
), ),
], ],
assets: [ assets: [
@ -140,10 +145,12 @@ class PortfolioCards extends StatelessWidget {
'quis elit ut amet velit. Incididunt fugiat proident ' 'quis elit ut amet velit. Incididunt fugiat proident '
'proident deserunt tempor Lorem cillum qui do '), 'proident deserunt tempor Lorem cillum qui do '),
ctas: [ ctas: [
CupertinoButton( context.components.flatButtonComponent.call(
color: Theme.of(context).primaryColor, label: const TextWrapper('En savoir plus'),
onPressed: () {}, suffix: const Icon(
child: const Text('En savoir plus >'), Icons.arrow_forward_ios,
size: 15,
),
), ),
], ],
assets: [ assets: [

View File

@ -40,7 +40,7 @@ class SkillCards extends StatelessWidget {
padding: const EdgeInsets.all(15), padding: const EdgeInsets.all(15),
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
color: Colors.white.withOpacity(0.04), color: Colors.grey.withOpacity(0.1),
), ),
child: GradientIcon( child: GradientIcon(
icon: Icons.ac_unit_sharp, icon: Icons.ac_unit_sharp,
@ -71,7 +71,7 @@ class SkillCards extends StatelessWidget {
padding: const EdgeInsets.all(15), padding: const EdgeInsets.all(15),
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
color: Colors.white.withOpacity(0.04), color: Colors.grey.withOpacity(0.1),
), ),
child: GradientIcon( child: GradientIcon(
icon: Icons.ac_unit_sharp, icon: Icons.ac_unit_sharp,

View File

@ -0,0 +1,24 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
part 'app_mode_state.dart';
class AppModeCubit extends Cubit<AppModeState> {
AppModeCubit({
required int theme,
required Brightness brightness,
}) : super(
AppModeState(
theme: theme,
brightness: brightness,
),
);
void changeTheme(int theme) {
emit(state.copyWith(theme: theme));
}
void changeBrightness(Brightness brightness) {
emit(state.copyWith(brightness: brightness));
}
}

View File

@ -0,0 +1,32 @@
// ignore_for_file: avoid_equals_and_hash_code_on_mutable_classes
part of 'app_mode_cubit.dart';
class AppModeState {
const AppModeState({
required this.theme,
required this.brightness,
});
final int theme;
final Brightness brightness;
AppModeState copyWith({
int? theme,
Brightness? brightness,
}) =>
AppModeState(
theme: theme ?? this.theme,
brightness: brightness ?? this.brightness,
);
@override
bool operator ==(Object other) =>
identical(this, other) ||
other is AppModeState &&
runtimeType == other.runtimeType &&
theme == other.theme &&
brightness == other.brightness;
@override
int get hashCode => theme.hashCode ^ brightness.hashCode;
}

View File

@ -1,16 +1,17 @@
import 'package:adaptive_theme/adaptive_theme.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:gap/gap.dart'; import 'package:gap/gap.dart';
import 'package:wyatt_ui_kit_example/bars/bars.dart'; import 'package:wyatt_ui_kit_example/bars/bars.dart';
import 'package:wyatt_ui_kit_example/buttons/buttons.dart'; import 'package:wyatt_ui_kit_example/buttons/buttons.dart';
import 'package:wyatt_ui_kit_example/cards/cards.dart'; import 'package:wyatt_ui_kit_example/cards/cards.dart';
import 'package:wyatt_ui_kit_example/cubit/app_mode_cubit.dart';
import 'package:wyatt_ui_kit_example/demo_page.dart'; import 'package:wyatt_ui_kit_example/demo_page.dart';
import 'package:wyatt_ui_kit_example/loaders/loaders.dart'; import 'package:wyatt_ui_kit_example/loaders/loaders.dart';
import 'package:wyatt_ui_kit_example/rich_text_builders/rich_text_builders.dart'; import 'package:wyatt_ui_kit_example/rich_text_builders/rich_text_builders.dart';
import 'package:wyatt_ui_kit_example/text_input/text_inputs.dart'; import 'package:wyatt_ui_kit_example/text_input/text_inputs.dart';
import 'package:wyatt_ui_kit_example/theme/themes.dart';
const String title = 'Wyatt UIKit Example'; const String title = 'Wyatt UIKit Example';
const List<String> themes = ['Material', 'Studio'];
class Home extends StatefulWidget { class Home extends StatefulWidget {
const Home({super.key, this.forceIndex = 0}); const Home({super.key, this.forceIndex = 0});
@ -75,34 +76,34 @@ class _HomeState extends State<Home> {
actions: [ actions: [
Row( Row(
children: [ children: [
const Text('Mode'), const Text('Dark'),
Switch.adaptive( Switch.adaptive(
value: value: context.watch<AppModeCubit>().state.brightness ==
AdaptiveTheme.of(context).brightness == Brightness.dark, Brightness.dark,
onChanged: (_) { onChanged: (value) {
AdaptiveTheme.of(context).brightness == Brightness.light context.read<AppModeCubit>().changeBrightness(
? AdaptiveTheme.of(context).setDark() value ? Brightness.dark : Brightness.light,
: AdaptiveTheme.of(context).setLight(); );
}, },
), ),
], ],
), ),
const Gap(30), const Gap(30),
Row( DropdownButton<int>(
children: [ items: themes
const Text('Studio'), .map(
Switch.adaptive( (e) => DropdownMenuItem(
value: Themes.currentThemeIndex == 1, value: themes.indexOf(e),
onChanged: (_) { child: Text(e),
setState(() { ),
Themes.currentThemeIndex = )
(Themes.currentThemeIndex == 1) ? 0 : 1; .toList(),
}); value: context.watch<AppModeCubit>().state.theme,
Themes.auto(context); onChanged: (value) {
}, context.read<AppModeCubit>().changeTheme(value ?? 0);
), },
], hint: const Text('Theme'),
) ),
], ],
), ),
body: Padding( body: Padding(

View File

@ -14,11 +14,12 @@
// You should have received a copy of the GNU General Public License // You should have received a copy of the GNU General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>. // along with this program. If not, see <https://www.gnu.org/licenses/>.
import 'package:adaptive_theme/adaptive_theme.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_localizations/flutter_localizations.dart'; import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:wyatt_ui_components/wyatt_ui_components.dart'; import 'package:wyatt_ui_components/wyatt_ui_components.dart';
import 'package:wyatt_ui_kit/wyatt_ui_kit.dart'; import 'package:wyatt_ui_kit/wyatt_ui_kit.dart';
import 'package:wyatt_ui_kit_example/cubit/app_mode_cubit.dart';
import 'package:wyatt_ui_kit_example/home.dart'; import 'package:wyatt_ui_kit_example/home.dart';
import 'package:wyatt_ui_kit_example/theme/themes.dart'; import 'package:wyatt_ui_kit_example/theme/themes.dart';
@ -41,28 +42,41 @@ class App extends StatelessWidget {
final int defaultTheme; final int defaultTheme;
@override @override
Widget build(BuildContext context) => AdaptiveTheme( Widget build(BuildContext context) {
initial: AdaptiveThemeMode.light, final brightness = WidgetsBinding.instance.window.platformBrightness;
light: Themes.lightFromTheme(defaultTheme), return BlocProvider(
dark: Themes.darkFromTheme(defaultTheme), create: (context) => AppModeCubit(
builder: (light, dark) => ComponentTheme( theme: defaultTheme,
data: WyattComponentThemeData.wyattComponentThemeData, brightness: brightness,
child: MaterialApp( ),
localizationsDelegates: const [ child: Builder(
GlobalMaterialLocalizations.delegate, builder: (context) => BlocBuilder<AppModeCubit, AppModeState>(
GlobalWidgetsLocalizations.delegate, builder: (context, state) {
GlobalCupertinoLocalizations.delegate, final light = Themes.lightFromTheme(state.theme);
], final dark = Themes.darkFromTheme(state.theme);
theme: light, final theme = state.brightness == Brightness.light ? light : dark;
darkTheme: dark, return ComponentTheme(
supportedLocales: const [ data: WyattComponentThemeData.wyattComponentThemeData,
Locale('fr', ''), child: MaterialApp(
], debugShowCheckedModeBanner: false,
title: title, localizationsDelegates: const [
home: Home( GlobalMaterialLocalizations.delegate,
forceIndex: defaultPage, GlobalWidgetsLocalizations.delegate,
), GlobalCupertinoLocalizations.delegate,
), ],
theme: theme,
supportedLocales: const [
Locale('fr', ''),
],
title: title,
home: Home(
forceIndex: defaultPage,
),
),
);
},
), ),
); ),
);
}
} }

View File

@ -14,10 +14,11 @@
// You should have received a copy of the GNU General Public License // You should have received a copy of the GNU General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>. // along with this program. If not, see <https://www.gnu.org/licenses/>.
import 'package:adaptive_theme/adaptive_theme.dart';
import 'package:flutter/material.dart' hide CardTheme; import 'package:flutter/material.dart' hide CardTheme;
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:google_fonts/google_fonts.dart'; import 'package:google_fonts/google_fonts.dart';
import 'package:wyatt_ui_kit/wyatt_ui_kit.dart'; import 'package:wyatt_ui_kit/wyatt_ui_kit.dart';
import 'package:wyatt_ui_kit_example/cubit/app_mode_cubit.dart';
/// Easely switch between Material and Studio themes. /// Easely switch between Material and Studio themes.
abstract class Themes { abstract class Themes {
@ -46,17 +47,11 @@ abstract class Themes {
} }
static void material(BuildContext context) { static void material(BuildContext context) {
AdaptiveTheme.of(context).setTheme( context.read<AppModeCubit>().changeTheme(0);
light: materialLight,
dark: materialDark,
);
} }
static void studio(BuildContext context) { static void studio(BuildContext context) {
AdaptiveTheme.of(context).setTheme( context.read<AppModeCubit>().changeTheme(1);
light: studioLight,
dark: studioDark,
);
} }
static ThemeData get materialLight => ThemeData.light().copyWith( static ThemeData get materialLight => ThemeData.light().copyWith(

View File

@ -6,9 +6,7 @@ import FlutterMacOS
import Foundation import Foundation
import path_provider_foundation import path_provider_foundation
import shared_preferences_foundation
func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) { func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) {
PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin")) PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin"))
SharedPreferencesPlugin.register(with: registry.registrar(forPlugin: "SharedPreferencesPlugin"))
} }

View File

@ -3,27 +3,20 @@ PODS:
- path_provider_foundation (0.0.1): - path_provider_foundation (0.0.1):
- Flutter - Flutter
- FlutterMacOS - FlutterMacOS
- shared_preferences_foundation (0.0.1):
- Flutter
- FlutterMacOS
DEPENDENCIES: DEPENDENCIES:
- FlutterMacOS (from `Flutter/ephemeral`) - FlutterMacOS (from `Flutter/ephemeral`)
- path_provider_foundation (from `Flutter/ephemeral/.symlinks/plugins/path_provider_foundation/macos`) - path_provider_foundation (from `Flutter/ephemeral/.symlinks/plugins/path_provider_foundation/macos`)
- shared_preferences_foundation (from `Flutter/ephemeral/.symlinks/plugins/shared_preferences_foundation/macos`)
EXTERNAL SOURCES: EXTERNAL SOURCES:
FlutterMacOS: FlutterMacOS:
:path: Flutter/ephemeral :path: Flutter/ephemeral
path_provider_foundation: path_provider_foundation:
:path: Flutter/ephemeral/.symlinks/plugins/path_provider_foundation/macos :path: Flutter/ephemeral/.symlinks/plugins/path_provider_foundation/macos
shared_preferences_foundation:
:path: Flutter/ephemeral/.symlinks/plugins/shared_preferences_foundation/macos
SPEC CHECKSUMS: SPEC CHECKSUMS:
FlutterMacOS: 8f6f14fa908a6fb3fba0cd85dbd81ec4b251fb24 FlutterMacOS: 8f6f14fa908a6fb3fba0cd85dbd81ec4b251fb24
path_provider_foundation: c68054786f1b4f3343858c1e1d0caaded73f0be9 path_provider_foundation: c68054786f1b4f3343858c1e1d0caaded73f0be9
shared_preferences_foundation: 986fc17f3d3251412d18b0265f9c64113a8c2472
PODFILE CHECKSUM: 353c8bcc5d5b0994e508d035b5431cfe18c1dea7 PODFILE CHECKSUM: 353c8bcc5d5b0994e508d035b5431cfe18c1dea7

View File

@ -17,7 +17,6 @@ dependencies:
flutter_localizations: { sdk: flutter } flutter_localizations: { sdk: flutter }
gap: ^2.0.1 gap: ^2.0.1
google_fonts: ^4.0.3 google_fonts: ^4.0.3
adaptive_theme: ^3.2.0
wyatt_ui_components: wyatt_ui_components:
hosted: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub hosted: https://git.wyatt-studio.fr/api/packages/Wyatt-FOSS/pub