Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Added the screen for draw clipart functionality #976

Merged
merged 11 commits into from
Jul 31, 2024
Binary file added assets/icons/pencil.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 8 additions & 2 deletions lib/main.dart
Original file line number Diff line number Diff line change
@@ -1,19 +1,24 @@
import 'package:badgemagic/providers/cardsprovider.dart';
import 'package:badgemagic/providers/drawbadge_provider.dart';
import 'package:badgemagic/providers/getitlocator.dart';
import 'package:badgemagic/providers/imageprovider.dart';
import 'package:badgemagic/view/draw_badge_screen.dart';
import 'package:badgemagic/view/homescreen.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:badgemagic/providers/cardsprovider.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:provider/provider.dart';

void main() {
setupLocator();
WidgetsFlutterBinding.ensureInitialized();
runApp(MultiProvider(
providers: [
ChangeNotifierProvider<CardProvider>(
create: (context) => getIt<CardProvider>()),
ChangeNotifierProvider<InlineImageProvider>(
create: (context) => getIt<InlineImageProvider>()),
ChangeNotifierProvider<DrawBadgeProvider>(
create: (context) => DrawBadgeProvider()),
],
child: const MyApp(),
));
Expand All @@ -36,6 +41,7 @@ class MyApp extends StatelessWidget {
initialRoute: '/',
routes: {
'/': (context) => const HomeScreen(),
'/drawBadge': (context) => const DrawBadge(),
},
);
},
Expand Down
34 changes: 34 additions & 0 deletions lib/providers/drawbadge_provider.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import 'package:flutter/material.dart';

class DrawBadgeProvider extends ChangeNotifier {
//List that contains the state of each cell of the badge
List<List<bool>> grid =
List.generate(11, (i) => List.generate(44, (j) => false));

//function to update the state of the cell
void updateGrid(int row, int col) {
grid[row][col] = isDrawing;
notifyListeners();
}

//function to reset the state of the cell
void resetGrid() {
grid = List.generate(11, (i) => List.generate(44, (j) => false));
notifyListeners();
}

//function to get the state of the cell
List<List<bool>> getGrid() => grid;

//boolean variable to check for isDrawing on Draw badge screen
bool isDrawing = true;

//function to toggle the isDrawing variable
void toggleIsDrawing(bool drawing) {
isDrawing = drawing;
notifyListeners();
}

//function to get the isDrawing variable
bool getIsDrawing() => isDrawing;
}
2 changes: 2 additions & 0 deletions lib/providers/getitlocator.dart
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import 'package:badgemagic/providers/cardsprovider.dart';
import 'package:badgemagic/providers/drawbadge_provider.dart';
import 'package:badgemagic/providers/imageprovider.dart';
import 'package:get_it/get_it.dart';

Expand All @@ -7,4 +8,5 @@ final GetIt getIt = GetIt.instance;
void setupLocator() {
getIt.registerLazySingleton<CardProvider>(() => CardProvider());
getIt.registerLazySingleton<InlineImageProvider>(() => InlineImageProvider());
getIt.registerLazySingleton<DrawBadgeProvider>(() => DrawBadgeProvider());
}
162 changes: 162 additions & 0 deletions lib/view/draw_badge_screen.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,162 @@
import 'package:badgemagic/providers/drawbadge_provider.dart';
import 'package:badgemagic/view/widgets/navigation_drawer.dart';
import 'package:badgemagic/virtualbadge/view/draw_badge.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get_it/get_it.dart';
import 'package:provider/provider.dart';

class DrawBadge extends StatefulWidget {
const DrawBadge({super.key});

@override
State<DrawBadge> createState() => _DrawBadgeState();
}

class _DrawBadgeState extends State<DrawBadge> {
DrawBadgeProvider cellStateToggle = GetIt.instance<DrawBadgeProvider>();

@override
void initState() {
SystemChrome.setPreferredOrientations([
DeviceOrientation.landscapeLeft,
]);
super.initState();
}

@override
void dispose() {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
DeviceOrientation.landscapeLeft,
DeviceOrientation.landscapeRight,
]);
cellStateToggle.resetGrid();
super.dispose();
}

@override
Widget build(BuildContext context) {
DrawBadgeProvider drawToggle = Provider.of<DrawBadgeProvider>(context);
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
return Scaffold(
appBar: AppBar(
leading: Builder(builder: (context) {
return IconButton(
onPressed: () {
Scaffold.of(context).openDrawer();
},
icon: const Icon(
Icons.menu,
color: Colors.white,
));
}),
backgroundColor: Colors.red,
title: const Text(
'Badge Magic',
style: TextStyle(color: Colors.white),
),
),
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You should create a common class which will encapsulate this logic, rather than duplicating it. We need to manage the drawer from one class. You can then have these hooks which inject the content and creates the entire page for you

drawer: const BMDrawer(),
body: Column(
children: [
Container(
margin: EdgeInsets.symmetric(vertical: 20.h, horizontal: 20.w),
padding: EdgeInsets.all(10.dg),
height: 400.h,
width: 500.w,
decoration: BoxDecoration(
color: Colors.black,
border: Border.all(color: Colors.black),
borderRadius: BorderRadius.circular(10),
),
child: const BMBadge(),
),
SizedBox(
height: 55.h,
),
Row(
children: [
TextButton(
onPressed: () {
setState(() {
drawToggle.toggleIsDrawing(true);
});
},
child: Column(
children: [
Icon(
Icons.edit,
color:
drawToggle.getIsDrawing() ? Colors.red : Colors.black,
),
Text(
'Draw',
style: TextStyle(
color: drawToggle.isDrawing ? Colors.red : Colors.black,
),
)
],
),
),
TextButton(
onPressed: () {
setState(() {
drawToggle.toggleIsDrawing(false);
});
},
child: Column(
children: [
Icon(
Icons.delete,
color: drawToggle.isDrawing ? Colors.black : Colors.red,
),
Text(
'Erase',
style: TextStyle(
color: drawToggle.isDrawing ? Colors.black : Colors.red,
),
)
],
),
),
TextButton(
onPressed: () {
setState(() {
drawToggle.resetGrid();
});
},
child: const Column(
children: [
Icon(
Icons.refresh,
color: Colors.black,
),
Text(
'Reset',
style: TextStyle(color: Colors.black),
)
],
),
),
TextButton(
onPressed: () {},
child: const Column(
children: [
Icon(
Icons.save,
color: Colors.black,
),
Text('Save', style: TextStyle(color: Colors.black))
],
),
),
],
)
],
),
);
}
}
44 changes: 40 additions & 4 deletions lib/view/homescreen.dart
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,13 @@ import 'package:badgemagic/providers/cardsprovider.dart';
import 'package:badgemagic/providers/imageprovider.dart';
import 'package:badgemagic/view/special_text_field.dart';
import 'package:badgemagic/view/widgets/homescreentabs.dart';
import 'package:badgemagic/view/widgets/navigation_drawer.dart';
import 'package:badgemagic/view/widgets/speedial.dart';
import 'package:badgemagic/view/widgets/vectorview.dart';
import 'package:badgemagic/virtualbadge/view/badgeui.dart';
import 'package:badgemagic/virtualbadge/view/badge_home_view.dart';
import 'package:extended_text_field/extended_text_field.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get_it/get_it.dart';
import 'package:provider/provider.dart';
Expand All @@ -29,19 +31,39 @@ class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
InlineImageProvider inlineImageProvider =
GetIt.instance<InlineImageProvider>();
Converters converters = Converters();

bool isCacheInitialized = false;
bool isPrefixIconClicked = false;

@override
void initState() {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
]);
_startImageCaching();
super.initState();

_tabController = TabController(length: 3, vsync: this);
}

@override
void dispose() {
_tabController.dispose();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
DeviceOrientation.landscapeLeft,
DeviceOrientation.landscapeRight,
]);
super.dispose();
}

Future<void> _startImageCaching() async {
await inlineImageProvider.generateImageCache();
if (!isCacheInitialized) {
await inlineImageProvider.generateImageCache();
setState(() {
isCacheInitialized = true;
});
}
}

@override
Expand All @@ -57,6 +79,19 @@ class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
length: 3,
child: Scaffold(
appBar: AppBar(
leading: Builder(
builder: (BuildContext context) {
return IconButton(
icon: const Icon(
Icons.menu,
color: Colors.white,
),
onPressed: () {
Scaffold.of(context).openDrawer();
},
);
},
),
backgroundColor: Colors.red,
title: const Text(
key: Key(homeScreenTitleKey),
Expand All @@ -65,11 +100,12 @@ class _HomeScreenState extends State<HomeScreen> with TickerProviderStateMixin {
),
centerTitle: true,
),
drawer: const BMDrawer(),
body: SafeArea(
child: SingleChildScrollView(
child: Column(
children: [
const BMBadge(),
const BMBadgeHome(),
Container(
margin: EdgeInsets.all(15.w),
child: Material(
Expand Down
44 changes: 44 additions & 0 deletions lib/view/widgets/navigation_drawer.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
import 'package:flutter/material.dart';

class BMDrawer extends StatelessWidget {
const BMDrawer({super.key});

@override
Widget build(BuildContext context) {
return Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: <Widget>[
const DrawerHeader(
decoration: BoxDecoration(
color: Colors.red,
),
child: Center(
child: Text(
'Badge Magic',
style: TextStyle(
color: Colors.white,
fontSize: 24,
),
),
),
),
ListTile(
leading: const Icon(Icons.edit),
title: const Text('Create Badges'),
onTap: () {
Navigator.pushNamed(context, '/');
},
),
ListTile(
leading: const Icon(Icons.draw_outlined),
title: const Text('Draw Clipart'),
onTap: () {
Navigator.pushNamed(context, '/drawBadge');
},
),
],
),
);
}
}
Loading
Loading