我構建了應該回傳相互連接的塊樹的應用程式。我希望有可能在用戶在手機上進行更改后保存資訊。我使用這個 getApplicationDocumentsDirectory() 來獲取路徑。用戶進行更改并關閉應用程式后，他或她可以打開它并查看他或她的所有進度。所以我嘗試在 initState() 中異步讀取檔案
我嘗試了一切：FutureBuilder；initState 中的匿名異步函式；然后; 當完成。我一直有相同的結果：在構建樹之后讀取資訊。
你能幫我解決這個問題嗎？（我的代碼在下面；現在它回傳型別錯誤，但我不知道如何解決它）
主要.dart
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:graphview/GraphView.dart';
import 'dart:math';
import 'MyNode.dart';
void main() {
print("main");
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) => MaterialApp(
home: TreeViewPage(),
);
}
class TreeViewPage extends StatefulWidget {
@override
_TreeViewPageState createState() => _TreeViewPageState();
}
var parsedJson;
final Graph graph = Graph()..isTree = true;
SugiyamaConfiguration builder = SugiyamaConfiguration();
// builder
// ..levelSeparation = (150)
// ..nodeSeparation = (100)
// ..orientation = (SugiyamaConfiguration.ORIENTATION_TOP_BOTTOM);
List<MyNode> ListMyNode = [];
int nodesCount = 0;
String text_from_init_state = "no_data";
class _TreeViewPageState extends State {
@override
Widget build(BuildContext context) {
return Scaffold(
body: FutureBuilder(
future: parsedJson,
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (parsedJson == null) {
return Center(
child: CircularProgressIndicator(
backgroundColor: Colors.red,
valueColor: AlwaysStoppedAnimation<Color>(Colors.blue)),
);
}
return Column(
mainAxisSize: MainAxisSize.max,
children: [
Text(text_from_init_state),
Expanded(
child: InteractiveViewer(
constrained: false,
boundaryMargin: EdgeInsets.all(300),
minScale: 0.01,
maxScale: 5.6,
child: GraphView(
graph: graph,
algorithm: SugiyamaAlgorithm(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 a = node.key!.value as int;
return rectangleWidget(a);
},
),
),
),
],
);
},
),
);
}
Widget rectangleWidget(int a) {
TextEditingController textController = TextEditingController();
if (ListMyNode[a - 1].text != "") {
textController.text = ListMyNode[a - 1].text;
}
return InkWell(
onTap: () {
print("a" a.toString());
},
child: Container(
padding: EdgeInsets.all(20),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
boxShadow: [
BoxShadow(color: Colors.blue, spreadRadius: 1),
],
),
child: Column(
children: [
Container(
// height: 80,
width: 80,
child: TextField(
keyboardType: TextInputType.multiline,
maxLines: null,
controller: textController,
decoration: const InputDecoration(),
onChanged: (v) async {
await ListMyNode[a - 1].UpdateText(v, ListMyNode);
},
),
),
Container(
alignment: Alignment.bottomRight,
child: IconButton(
icon: Icon(Icons.add_box_rounded),
iconSize: 24,
onPressed: () async {
nodesCount ;
final newNode = Node.Id(nodesCount);
var edge = graph.getNodeAtPosition(a - 1);
graph.addEdge(edge, newNode);
text_from_init_state = await readJson();
setState(() {
MyNode b = MyNode(nodesCount, "");
ListMyNode.add(b);
});
},
),
),
],
),
),
);
}
@override
void initState() {
readJson2().whenComplete(() {
print("PArsed Json: " parsedJson.toString());
if (parsedJson == "{}") {
final node1 = Node.Id(1);
final node2 = Node.Id(2);
MyNode block0 = MyNode(nodesCount, "empty1");
nodesCount ;
MyNode block1 = MyNode(nodesCount, "empty2");
nodesCount ;
ListMyNode.add(block0);
ListMyNode.add(block1);
graph.addEdge(node1, node2);
} else {
final node1 = Node.Id(1);
final node2 = Node.Id(2);
MyNode block0 = MyNode(nodesCount, parsedJson.toString());
nodesCount ;
MyNode block1 = MyNode(nodesCount, "not_empty2");
nodesCount ;
ListMyNode.add(block0);
ListMyNode.add(block1);
graph.addEdge(node1, node2);
}
print("before setState: " parsedJson);
setState(() {});
print("after setState: " parsedJson);
});
super.initState();
builder
..levelSeparation = (150)
..nodeSeparation = (100)
..orientation = (SugiyamaConfiguration.ORIENTATION_TOP_BOTTOM);
}
Future<void> readJson2() async {
try {
final file = await localFile();
// Read the file
final contents = await file.readAsString();
parsedJson = contents;
} catch (e) {
// If encountering an error, return 0
parsedJson = "{}";
}
}
}
MyNode.dart
import 'dart:async';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:path_provider/path_provider.dart';
String ListMyNodeJSON(List<MyNode> lst) {
Map<int, String> mapMyNodeJSON = {};
for (int i = 0; i < lst.length; i ) {
mapMyNodeJSON[lst[i].id] = lst[i].text;
}
return mapMyNodeJSON.toString();
}
Future<String> localPath() async {
final directory = await getApplicationDocumentsDirectory();
return directory.path;
}
Future<File> localFile() async {
final path = await localPath();
return File('$path/tree.json');
}
Future<File> writeJson(text) async {
final file = await localFile();
return file.writeAsString("$text");
}
Future<String> readJson() async {
try {
final file = await localFile();
// Read the file
final contents = await file.readAsString();
return contents;
} catch (e) {
// If encountering an error, return 0
return "{}";
}
}
class MyNode {
int id = 0;
String text = "";
MyNode(int id, String text) {
this.id = id;
this.text = text;
}
Future<void> UpdateText(String text, List<MyNode> lst) async {
this.text = text;
await writeJson(ListMyNodeJSON(lst));
}
String toString() {
return this.id.toString() "---" this.text;
}
}
uj5u.com熱心網友回復：
我更新了您的代碼以在獲取資料時顯示加載欄并在完成時顯示塊。現在它從檔案中獲取進度，但您似乎還沒有實作恢復進度的游戲邏輯。我覺得這是一個有趣的專案。希望此代碼解決您的問題并繼續開發進度邏輯部分。
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:graphview/GraphView.dart';
import 'dart:math';
import 'MyNode.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) => MaterialApp(
home: TreeViewPage(),
);
}
class TreeViewPage extends StatefulWidget {
@override
_TreeViewPageState createState() => _TreeViewPageState();
}
final Graph graph = Graph()..isTree = true;
SugiyamaConfiguration builder = SugiyamaConfiguration();
// builder
// ..levelSeparation = (150)
// ..nodeSeparation = (100)
// ..orientation = (SugiyamaConfiguration.ORIENTATION_TOP_BOTTOM);
List<MyNode> ListMyNode = [];
int nodesCount = 0;
String text_from_init_state = "no_data";
class _TreeViewPageState extends State {
late String parsedJson;
@override
Widget build(BuildContext context) {
return Scaffold(
body: FutureBuilder(
future: readJson2(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const Center(
child: CircularProgressIndicator(
backgroundColor: Colors.red,
valueColor: AlwaysStoppedAnimation<Color>(Colors.blue)),
);
} else if (snapshot.connectionState == ConnectionState.done) {
parsedJson = snapshot.data as String;
updateNode(parsedJson);
return Column(
mainAxisSize: MainAxisSize.max,
children: [
Text(text_from_init_state),
Expanded(
child: InteractiveViewer(
constrained: false,
boundaryMargin: EdgeInsets.all(300),
minScale: 0.01,
maxScale: 5.6,
child: GraphView(
graph: graph,
algorithm: SugiyamaAlgorithm(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 a = node.key!.value as int;
return rectangleWidget(a);
},
),
),
),
],
);
}
return Center(
child: Text(
'Something went wrong!',
style: TextStyle(
color: Colors.red,
),
),
);
},
),
);
}
void updateNode(String parsedReadJson2) {
if (parsedReadJson2.isEmpty) {
final node1 = Node.Id(1);
final node2 = Node.Id(2);
MyNode block0 = MyNode(nodesCount, "empty1");
nodesCount ;
MyNode block1 = MyNode(nodesCount, "empty2");
nodesCount ;
ListMyNode.add(block0);
ListMyNode.add(block1);
graph.addEdge(node1, node2);
} else {
final node1 = Node.Id(1);
final node2 = Node.Id(2);
MyNode block0 = MyNode(nodesCount, parsedReadJson2.toString());
nodesCount ;
MyNode block1 = MyNode(nodesCount, "not_empty2");
nodesCount ;
ListMyNode.add(block0);
ListMyNode.add(block1);
graph.addEdge(node1, node2);
}
}
Widget rectangleWidget(int a) {
TextEditingController textController = TextEditingController();
if (ListMyNode[a - 1].text != "") {
textController.text = ListMyNode[a - 1].text;
}
return InkWell(
onTap: () {
print("a$a");
},
child: Container(
padding: EdgeInsets.all(20),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4),
boxShadow: [
BoxShadow(color: Colors.blue, spreadRadius: 1),
],
),
child: Column(
children: [
Container(
// height: 80,
width: 80,
child: TextField(
keyboardType: TextInputType.multiline,
maxLines: null,
controller: textController,
decoration: const InputDecoration(),
onChanged: (v) async {
await ListMyNode[a - 1].UpdateText(v, ListMyNode);
},
),
),
Container(
alignment: Alignment.bottomRight,
child: IconButton(
icon: Icon(Icons.add_box_rounded),
iconSize: 24,
onPressed: () async {
nodesCount ;
final newNode = Node.Id(nodesCount);
var edge = graph.getNodeAtPosition(a - 1);
graph.addEdge(edge, newNode);
text_from_init_state = await readJson();
setState(() {
MyNode b = MyNode(nodesCount, "");
ListMyNode.add(b);
});
},
),
),
],
),
),
);
}
@override
void initState() {
super.initState();
builder
..levelSeparation = (150)
..nodeSeparation = (100)
..orientation = (SugiyamaConfiguration.ORIENTATION_TOP_BOTTOM);
}
Future<String> readJson2() async {
try {
final file = await localFile();
// Read the file
final contents = await file.readAsString();
return contents;
} catch (e) {
// If encountering an error, return empty string
return '';
}
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/517873.html