Как центрировать представление графика или дерева в flutter?

#flutter #dart #binary-tree #android-graphview #mlmodel

Вопрос:

 InteractiveViewer(
            constrained: false,
            boundaryMargin: const EdgeInsets.all(20),
            child: Container(
              child: GraphView(
                graph: graph,
                algorithm:
                    BuchheimWalkerAlgorithm(builder, TreeEdgeRenderer(builder)),
                paint: Paint()
                  ..color = Colors.black
                  ..strokeWidth = 1.5
                  ..style = PaintingStyle.stroke,
                builder: (Node node) {
                  var a = node.key?.value as int;

                  
                  var nodeValue =
                      _nodeData.firstWhere((element) => element.id == a);
                  //print('node Value : $nodeValue');
                  var _eid = (nodeValue.id).toString(); 
                  var _id = (nodeValue.uid).toString(); 
                  var _name = (nodeValue.name).toString(); 
                  return Center(child: rectangleWidget(_id, _name, _eid));
                },
              ),
            ),
          ),
 

Я хочу центрировать приведенный выше виджет GraphView. Я пробовал центрирование столбцов, строк и даже виджет контейнера и центра…

Комментарии:

1. Добавьте дополнительные сведения или снимок экрана. Является ли InteractiveViewer вашим родительским виджетом или он находится внутри другого виджета.

2. body:InteractiveViewer ()

Ответ №1:

Я просто передаю то, что нашел в закрытом выпуске, но симбонатор говорит

если вы установите для параметра restricted значение true в своем интерактивном просмотрщике и обернете его дочерний элемент переполнением с выравниванием.центр, он будет центрировать дерево.

и они следуют этому примеру:

 @override
Widget build(BuildContext context) {
  return InteractiveViewer(
    minScale: 0.35,
    maxScale: 1,
    boundaryMargin: EdgeInsets.all(double.infinity),
    child: OverflowBox(
      alignment: Alignment.center,
      minWidth: 0.0,
      minHeight: 0.0,
      maxWidth: double.infinity,
      maxHeight: double.infinity,
      child: GraphView(
        algorithm: BuchheimWalkerAlgorithm(
          builder,
          TreeEdgeRenderer(builder),
        ),
        graph: graph,
        paint: Paint()
          ..color = Theme.of(context).primaryIconTheme.color
          ..strokeWidth = 1
          ..style = PaintingStyle.stroke,
      ),
    ),
  );
}
 

Комментарии:

1. Спасибо за ответ, но центрирование графического представления появляется на картинке, когда я увеличиваю масштаб.