Flutter-基于XML文件(通过RESTneneneba API)的动态页面设计

Question

我在飞镖和扑动方面工作了几个月。我需要一些关于以下任务的支持，以及如何启动这样的项目/如何找到解决方案。

其目的是将Flutter开发为一个从XML文件中获取每个页面的页面结构的应用程序。页面以节为结构，以列和行为结构。该应用程序具有预定义的标准样式(按钮标签等的样式…(，这些样式可在具有名称的XML文件中调用。

下面的示例展示了XML文件中的一个部分的外观。

<SectionTop>
<Column1>
<Row1>
<label>
<title>label text</title>
<algin>center</algin>
</style>defaultLabelStyle</style>
</label>
</Row1>
<Row2>
<Button>
<title>add Customer</title>
<algin>center</algin>
</style>defaultButton_Blue</style>
</Button>
</Row2>
</Column1>
</SectionTop>

我希望你能帮我，提前谢谢：(

Answer 1

有一个名为Dynamic Widget的包，但它使用自己的模式，并且是json。如果您希望自己控制xml及其模式，则需要构建类似Dynamic Widget包的东西

还有XmlLayout包，它可以让您开始思考如何将其组合在一起。

还有Flutter XML布局助手

还有一个VSCode的插件，你可以看看它是如何完成的

Answer 2

您可以使用此包

https://pub.dev/packages/xml

从文件读取xml

final document = XmlDocument.parse(File('bookshelf.xml').readAsStringSync());

从api 读取xml

//get response string user http or dio package
final document = XmlDocument.parse(responseString);

xml文档上的元素可以迭代，小部件可以在构建方法中填充，如下所示

@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
children: _getChildren(document.descendants),
),
);
}
_getChildren(Iterable<XmlNode> descendants) {
List<Widget> widgets = List();
for (XmlNode node in descendants) {
if (node.text == 'Column') {
widgets.add(Column(
children: _getChildren(node.descendants),
));
} else if (node.text == 'Row') {
widgets.add(Row(
children: _getChildren(node.descendants),
));
} else if (node.text == 'label') {
String text = node.descendants
.firstWhere((element) => element.text == 'title')
.innerText;
String align = node.descendants
.firstWhere((element) => element.text == 'align')
.innerText ??
'center';
widgets.add(Text(text,
textAlign: align == 'center'
? TextAlign.center
: align == 'start'
? TextAlign.start
: TextAlign.end));
}
//add more if else for other elements
}
return widgets;
}