ammar/syncrow-web
1
0
Fork 0
mirror of https://github.com/SyncrowIOT/web.git synced 2025-11-27 20:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added login screen and Tree page screen to test graph view package

Browse Source
This commit is contained in:
Abdullah-Alassaf
2024-05-16 01:01:14 +03:00
parent a8dd969e07
commit 71bba79887
137 changed files with 5399 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
lib/pages/home/view/home_page.dart Normal file
View File

@ -0,0 +1,17 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
import 'package:syncrow_web/pages/home/view/tree_page.dart';
class HomePage extends StatelessWidget {
const HomePage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
body: BlocProvider(
create: (context) => HomeBloc(),
child: const TreeWidget(),
));
}
}

150
lib/pages/home/view/tree_page.dart Normal file
View File

@ -0,0 +1,150 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:graphview/GraphView.dart';
import 'package:syncrow_web/pages/home/bloc/home_bloc.dart';
import 'package:syncrow_web/pages/home/bloc/home_event.dart';
import 'package:syncrow_web/pages/home/bloc/home_state.dart';
class TreeWidget extends StatelessWidget {
const TreeWidget({super.key});
@override
Widget build(BuildContext context) {
// final HomeBloc homeBloc = BlocProvider.of<HomeBloc>(context);
String firstNodeName = '';
String secondNodeName = '';
return SafeArea(
child: Container(
padding: const EdgeInsets.all(24),
width: MediaQuery.sizeOf(context).width,
height: MediaQuery.sizeOf(context).height,
alignment: AlignmentDirectional.center,
child: Column(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
BlocBuilder<HomeBloc, HomeState>(builder: (context, state) {
if (state is HomeInitial) {
return Wrap(
children: [
Container(
width: 100,
child: TextFormField(
decoration:
InputDecoration(labelText: "Subtree separation"),
onChanged: (text) {
firstNodeName = text;
},
),
),
const SizedBox(
width: 8,
),
Container(
width: 100,
child: TextFormField(
decoration: InputDecoration(labelText: "Node Name"),
onChanged: (text) {
secondNodeName = text;
},
),
),
ElevatedButton(
onPressed: () {
final node1 = Node.Id(firstNodeName);
final node2 = Node.Id(secondNodeName);
context.read<HomeBloc>().add(CreateNewNode(
sourceNode: node1, destinationNode: node2));
},
child: Text("Add"),
)
],
);
}
if (state is HomeUpdateTree) {
return Expanded(
child: InteractiveViewer(
constrained: false,
boundaryMargin: const EdgeInsets.all(100),
minScale: 0.01,
maxScale: 5.6,
child: GraphView(
graph: state.graph,
algorithm: BuchheimWalkerAlgorithm(
state.builder, TreeEdgeRenderer(state.builder)),
paint: Paint()
..color = Colors.green
..strokeWidth = 1
..style = PaintingStyle.stroke,
builder: (Node node) {
// I can decide what widget should be shown here based on the id
var nodeName = node.key!.value;
return rectangleWidget(nodeName, node, context);
},
)),
);
} else {
return Container();
}
})
],
),
),
);
}
}
Widget rectangleWidget(String text, Node node, BuildContext blocContext) {
String nodeName = '';
return InkWell(
onTap: () {
showDialog(
context: blocContext,
builder: (BuildContext context) {
return AlertDialog(
title: const Text('Add a child'),
content: TextField(
decoration:
const InputDecoration(hintText: 'Enter your text here'),
onChanged: (value) {
nodeName = value;
},
),
actions: <Widget>[
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: Text('Close'),
),
TextButton(
onPressed: () {
if (nodeName.isNotEmpty) {
final newNode = Node.Id(nodeName);
blocContext.read<HomeBloc>().add(CreateNewNode(
sourceNode: node, destinationNode: newNode));
}
Navigator.of(context).pop();
},
child: Text('Add'),
),
],
);
},
);
},
child: Container(
padding: EdgeInsets.all(16),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
boxShadow: [
BoxShadow(color: Colors.blue[100]!, spreadRadius: 1),
],
),
child: Text(text)),
);
}