Mini Project

on

“Distributed Application for Interactive Multiplayer Games”

Submitted to the

Savitribai Phule Pune University

In partial fulfillment for the award of the Degree of

Bachelor of Engineering
in

Information Technology
By

Dhruv Gangal (BEITB73)

Shashi Ranjan(BEITB85)
Utkarsh Singh(BEITB102)
Dhanandri Mane (BEIT103)
Parth Jhanwar (BEITB112)

Under the guidance of

Mrs. R.J. Kodulkar

Department Of Information Technology

D. Y. Patil College Of Engineering
Akurdi, Pune-44, Maharashtra, India
2023-2024
1. Screens:
 2. Screens:

Code:
Home Screen:
import 'package:flutter/material.dart'; import
'package:google_fonts/google_fonts.dart'; import
'package:skribbl_clone/screens/join_room_screen.dart';

import '../widgets/custom_button.dart';
import 'create_room_screen.dart';

class HomeScreen extends StatefulWidget {

const HomeScreen({Key? key}) : super(key: key);
 @override
State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {

@override
Widget build(BuildContext context) {
return Scaffold( body: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [ Text( 'Skribble', style:
TextStyle(
fontFamily: GoogleFonts.pressStart2p(fontWeight: FontWeight.w700)
.fontFamily,
fontSize: 46,
),
),
const SizedBox(height: 22),
const Text(
'Create / join a room to play!',
style: TextStyle(
color: Colors.black,
fontSize: 24,
),
),
SizedBox(
height: MediaQuery.of(context).size.height * 0.1,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
CustomNeoPopButton(
labelText: 'Create Room',
onPress: () {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const CreateRoomScreen()),
);
},
),
CustomNeoPopButton(
labelText: 'Join Room',
onPress: () {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const JoinRoomScreen()),
);
},
),
],
 )
],
));
}
}
Create Room screen:
import 'package:flutter/material.dart'; import
'package:google_fonts/google_fonts.dart';
import 'package:skribbl_clone/widgets/custom_button.dart';

import '../utils.dart';
import '../widgets/custom_text_field.dart'; import
'paint_screen.dart';

class CreateRoomScreen extends StatefulWidget {

const CreateRoomScreen({Key? key}) : super(key: key);

@override
State<CreateRoomScreen> createState() => _CreateRoomScreenState();
}

class _CreateRoomScreenState extends State<CreateRoomScreen> { final

TextEditingController _nameController = TextEditingController(); final
TextEditingController _roomNameController = TextEditingController();
String? _maxRoundsValue;
String? _roomSizeValue;
@override void dispose() {
super.dispose();
_nameController.dispose();
_roomNameController.dispose();
}

void createRoom() { if
(_nameController.text.isNotEmpty &&
_roomNameController.text.isNotEmpty &&
_roomSizeValue != null &&
_maxRoundsValue != null) {
Map<String, String> data = {
"nickname": _nameController.text,
"name": _roomNameController.text,
"occupancy": _roomSizeValue!, "maxRounds":
_maxRoundsValue!
};
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) =>
PaintScreen(data: data, screenFrom: "createRoom"),
),
);
} else {
Utils.toastMessage("Invalid Round or Size");
 }
}

@override
Widget build(BuildContext context) {
return Scaffold( appBar: AppBar(), body:
Column( mainAxisAlignment:
MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'Create a room',
style: TextStyle(
fontFamily: GoogleFonts.pressStart2p(fontWeight: FontWeight.w700)
.fontFamily,
fontSize: 30,
),
),
SizedBox(
height: MediaQuery.of(context).size.height * 0.1,
),
Container(
margin: const EdgeInsets.symmetric(horizontal: 20),
child: CustomTextField(
controller: _nameController,
hintText: "Enter your name",
),
),
const SizedBox(height: 20),
Container(
margin: const EdgeInsets.symmetric(horizontal: 20),
child: CustomTextField(
controller: _roomNameController,
hintText: "Enter your room name",
),
),
const SizedBox(height: 20),
DropdownButton<String>(
focusColor: const Color(0xffF5F6FA),
items: <String>["2", "5", "10", "15"]
.map<DropdownMenuItem<String>>(
(String value) => DropdownMenuItem(
value: value,
child: Text(
value,
style: const TextStyle(color: Colors.black),
)))
.toList(),
hint: Text(
_maxRoundsValue != null
 ? '$_maxRoundsValue Rounds'
: 'Select No. of Rounds', style:
const TextStyle( color:
Colors.black,
fontSize: 14,
fontWeight: FontWeight.w500,
),
),
onChanged: (String? value) {
setState(() {
_maxRoundsValue = value!;
});
},
),
const SizedBox(
height: 20,
),
DropdownButton<String>( focusColor:
const Color(0xffF5F6FA), items: <String>["2",
"3", "4", "5", "6", "7", "8"]
.map<DropdownMenuItem<String>>(
(String value) => DropdownMenuItem(
value: value,
child: Text(
value,
style: const TextStyle(color: Colors.black),
)))
.toList(),
hint: Text(
_roomSizeValue == null
? 'Select Room Size'
: '$_roomSizeValue People',
style: const TextStyle( color:
Colors.black,
fontSize: 14,
fontWeight: FontWeight.w500,
),
),
onChanged: (String? value) {
setState(() {
_roomSizeValue = value!;
});
},
),
const SizedBox(height: 40),
SizedBox(
width: MediaQuery.of(context).size.width / 2.5,
child: CustomNeoPopButton( labelText:
"Create",
onPress: createRoom,
),
 ),
],
),
);
}
}

Custom_paints.dart:

import 'package:flutter/material.dart'; import

'dart:ui' as ui;

import 'touch_points.dart';

class MyCustomPainter extends CustomPainter {

MyCustomPainter({required this.pointsList});
List<TouchPoints> pointsList;

List<Offset> offsetPoints = [];

@override
void paint(Canvas canvas, Size size) { Paint background
= Paint()..color = Colors.white; Rect rect =
Rect.fromLTWH(0, 0, size.width, size.height);
canvas.drawRect(rect, background);
canvas.clipRect(rect);

//Logic for points, if there's a point,we need to display points

//If there's a line,we need to connect the points

for (int i = 0; i < pointsList.length - 1; i++) {

if (pointsList[i + 1] != null) { // This is
Line
canvas.drawLine(pointsList[i].points, pointsList[i + 1].points,
pointsList[i].paint); } else if
(pointsList[i + 1] == null) {
// This is Point
offsetPoints.clear();
offsetPoints.add(pointsList[i].points);
offsetPoints.add(Offset(
pointsList[i].points.dx + 0.1, pointsList[i].points.dy + 0.1));

canvas.drawPoints(
ui.PointMode.points, offsetPoints, pointsList[i].paint);
}
}
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) => true;
}